@keyframes o-upfade-top { 0% { opacity: 0; transform: translateY(0.4rem); } 100% { opacity: 1; transform: translateY(0); } } @keyframes o-upfade-top-1 { 0% { opacity: 0; transform: translateY(0.2rem); } 100% { opacity: 1; transform: translateY(0); } } @keyframes opacity-1 { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes o-map-scale { 0% { opacity: 1; transform: scale(0); } 70% { opacity: 1; } 100% { opacity: 0; transform: scale(1); } } @keyframes oindex-1 { 0% { stroke-dashoffset: 120; } 100% { stroke-dashoffset: 0; } } @keyframes index-banner { 0% { transform: scaleX(0); } 100% { transform: scaleX(1); } } @keyframes index-banner-1 { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } @media screen and (min-width: 1025px) { .dom-loaded .header { transition: all .3s ease; } .dom-loaded .header li a.single { transition: all .3s ease; } } .header { position: fixed; top: 0; left: 0; width: 100%; background-color: #fff; z-index: 9; } @media screen and (min-width: 1025px) { .header.down { background-color: rgba(255, 255, 255, 0.8); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } .header.down li a.single { line-height: max(70px, 0.8rem); } } .header .flex { width: 86%; max-width: 1440px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; } .header .logo { width: 1.8rem; } .header .logo img { display: block; width: 100%; } .header .ope { display: flex; align-items: center; } .header ul { display: flex; } .header li { margin-right: 0.4rem; } .header li:last-of-type { margin-right: 0; } .header li a.single { display: block; font-size: max(15px, 0.18rem); color: #181818; line-height: max(80px, 1rem); } .header li .subnav-1 { position: absolute; top: 100%; left: 0; width: 100%; padding: 0.6rem 0; background-color: #092240; background-position: center; background-repeat: no-repeat; background-size: cover; background-image: url("../images/nav-1.jpg"); opacity: 0; visibility: hidden; } .header li .subnav-1 .wrap-s { display: flex; align-items: flex-start; position: static; } .header li .subnav-1 .left-box { width: 50%; opacity: 0; transform: translateY(-4px); } .header li .subnav-1 .left-box .tit { font-size: max(24px, 0.32rem); color: #fff; } .header li .subnav-1 .left-box .para { font-size: max(13px, 0.16rem); color: #fff; line-height: 1.5; margin-top: 0.15rem; max-width: max(300px, 4.2rem); } .header li .subnav-1 .right-box { display: flex; position: relative; opacity: 0; transform: translateY(-4px); } .header li .subnav-1 .right-box .link { margin-left: 0.6rem; display: flex; flex-direction: column; align-items: flex-start; gap: 0.2rem 0; } .header li .subnav-1 .right-box .link:nth-of-type(1) { margin-left: 0; } .header li .subnav-1 .right-box .link a { font-size: max(15px, 0.18rem); color: #90cdf0; transition: color .3s ease; } @media (any-hover: hover) { .header li .subnav-1 .right-box .link a:hover { color: #fff; } } .header li:hover a.single { color: #0071bc; } .header li:hover .subnav-1 { opacity: 1; visibility: visible; } .header li:hover .subnav-1 .left-box, .header li:hover .subnav-1 .right-box { opacity: 1; transform: translateY(0); transition: all 0.3s cubic-bezier(0.4, 0, 0.6, 1); } .header li:hover .subnav-1 .right-box { transition-delay: .1s; } .header .search-btn { margin-left: 0.4rem; width: max(16px, 0.2rem); height: max(16px, 0.2rem); background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/search-2.svg"); cursor: pointer; } .header .mNavBtn { display: none; } .fixed-search { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; background-color: rgba(0, 0, 0, 0.5); opacity: 0; pointer-events: none; transition: all .3s ease; transition-delay: .3s; } .fixed-search.active { opacity: 1; transition-delay: 0s; pointer-events: auto; } .fixed-search.active .main { transform: translateX(0); transition-delay: .3s; } .fixed-search .main { transform: translateY(-101%); transition: transform .5s ease; z-index: 2; } .fixed-search .top-box { height: 1rem; position: relative; background-color: #fff; display: flex; justify-content: center; align-items: center; } .fixed-search .top-box .close { position: absolute; right: max(40px, 0.6em); top: calc(50% - 15px); width: 30px; height: 30px; border-radius: 50%; background-position: center; background-repeat: no-repeat; background-image: url("../images/close.svg"); background-size: auto 12px; cursor: pointer; } .fixed-search .form { max-width: 1020px; margin: 0 auto; width: 86%; position: relative; height: 36px; padding-left: 44px; } .fixed-search .form:before { content: ''; position: absolute; top: 0; left: 0; width: 40px; height: 40px; background: url("../images/search-2.svg") left center no-repeat; background-size: auto 18px; border-right: 1px solid #e6e6e6; } .fixed-search .form input { display: block; width: 100%; height: 100%; padding: 0 20px; background-color: transparent; font-size: max(13px, 0.16rem); color: #808080; font-family: 'Inter-Regular'; } .fixed-search .form input::-webkit-input-placeholder { color: #808080; } .fixed-search .form input:-moz-placeholder { color: #808080; } .fixed-search .form input::-moz-placeholder { color: #808080; } .fixed-search .form input:-ms-input-placeholder { color: #808080; } .fixed-search .bot-box { background-color: #f5f5f5; padding: 0.4rem 0 0.6rem; } .fixed-search .block { max-width: max(500px, 7.2rem); width: 86%; margin: 0 auto; } .fixed-search .tit { font-size: max(13px, 0.16rem); color: #20252b; } .fixed-search .link { margin-top: 0.2rem; } .fixed-search .link a { display: block; padding: 0 0.4rem; border-radius: 5px; position: relative; transition: all .3s ease; } .fixed-search .link a span { display: block; font-size: max(15px, 0.2rem); line-height: max(40px, 0.6rem); color: #808080; transition: color .3s ease; } .fixed-search .link a:after { content: ''; width: 8px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/icon-1-1.svg"); position: absolute; right: 0.4rem; top: 50%; margin-top: -7px; transition: all .3s ease; } @media (any-hover: hover) { .fixed-search .link a:hover { background-color: #fff; } .fixed-search .link a:hover span { color: #0071bc; } .fixed-search .link a:hover:after { background-image: url("../images/icon-1-2.svg"); } } .head-null { height: max(80px, 1rem); } .footer { background-color: #092240; border-top: 0.1rem solid #0071bc; } .footer .top-block { display: flex; justify-content: space-between; align-items: flelx-start; padding: 0.6rem 0 1rem; } .footer .top-block .tit { font-size: max(13px, 0.16rem); color: #90cdf0; } .footer .left-box { width: 1.8rem; } .footer .left-box img { display: block; width: 100%; } .footer .center-box .link { margin-top: 0.3rem; display: flex; flex-wrap: wrap; max-width: max(400px, 5.4rem); gap: 0.25rem 0.1rem; } .footer .center-box .link a { width: calc((100% - 0.3rem) / 4); font-size: max(15px, 0.2rem); color: #fff; transition: color .3s ease; } @media (any-hover: hover) { .footer .center-box .link a:hover { color: #90cdf0; } } .footer .share { margin-top: 0.2rem; display: flex; } .footer .share .box { position: relative; margin-left: 0.1rem; } .footer .share .box:nth-of-type(1) { margin-left: 0; } .footer .share .box .show { display: block; width: max(40px, 0.6rem); height: max(40px, 0.6rem); background-color: #0c2f59; border-radius: 50%; background-position: center; background-repeat: no-repeat; background-size: auto max(30px, 0.4rem); cursor: pointer; transition: all .3s ease; } @media (any-hover: hover) { .footer .share .box .show:hover { background-color: #0071bc; } } .footer .share .box .show.wx { background-image: url("../images/share-1-1.svg"); } .footer .share .box .show.wb { background-image: url("../images/share-2-1.svg"); } .footer .share .box .show.dy { background-image: url("../images/share-3-1.svg"); } .footer .share .box .hide { position: absolute; top: 100%; padding-top: 15px; left: calc(50% - 50px); opacity: 0; transition: all .3s ease; pointer-events: none; } .footer .share .box .hide:after { content: ''; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #fff; position: absolute; top: 9px; left: 0; right: 0; margin: 0 auto; } .footer .share .box .hide .img-box { width: 100px; height: 100px; display: flex; align-items: center; justify-content: center; background-color: #fff; } .footer .share .box .hide .img-box img { max-width: 100%; max-height: 100%; } .footer .share .box:hover .hide { opacity: 1; } .footer .bot-block { padding: 0.4rem 0; border-top: 1px solid rgba(140, 205, 240, 0.2); display: flex; align-items: center; justify-content: space-between; } .footer .bot-block .copyright { font-size: max(12px, 0.14rem); color: #ffffff; } .footer .bot-block .copyright a { color: #ffffff; margin-left: 0.15rem; } .footer .bot-block .link { display: flex; grid-gap: 0.2rem; } .footer .bot-block .link a { font-size: max(12px, 0.14rem); color: #ffffff; transition: color .3s ease; } @media (any-hover: hover) { .footer .bot-block .link a:hover { color: #90cdf0; } } .fixed-right { position: fixed; right: 0; bottom: 0.6rem; z-index: 10; display: none; } .fixed-right .block { width: max(50px, 0.6rem); background-color: #fff; box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1); } .fixed-right .box { position: relative; padding: 0.05rem; } .fixed-right .box .show { width: 100%; height: max(calc(50px - 0.1rem), 0.5rem); position: relative; transition: all .3s ease; } .fixed-right .box .show i { width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-position: center; background-repeat: no-repeat; background-size: max(12px, 0.16rem) auto; cursor: pointer; transition: opacity .3s ease; } .fixed-right .box .show i.h { opacity: 0; } .fixed-right .box .hide { position: absolute; right: calc(100% - 1px); top: 50%; transform: translateY(-50%); padding-right: 0.2rem; opacity: 0; visibility: hidden; transition: all .3s ease; } .fixed-right .box .hide.style-1 { top: auto; transform: none; bottom: 0; } .fixed-right .box .hide.style-1 .inner { width: 240px; } .fixed-right .box .hide.style-1 .tips { text-align: center; } .fixed-right .box .hide .inner { background-color: #fff; border-top: 2px solid #0071bc; width: 300px; padding: 30px; box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.1); } .fixed-right .box .hide .tit { font-size: 16px; color: #181818; } .fixed-right .box .hide .sbox { margin-top: 15px; display: flex; align-items: center; } .fixed-right .box .hide .img { width: 60px; height: 60px; border-radius: 50%; overflow: hidden; } .fixed-right .box .hide .img img { display: block; width: 100%; height: 100%; object-fit: cover; } .fixed-right .box .hide .txt { width: calc(100% - 60px); padding-left: 10px; } .fixed-right .box .hide a { display: block; font-size: 14px; text-align: center; color: #0071bc; border: 1px solid #0071bc; line-height: 36px; margin-top: 20px; } .fixed-right .box .hide p { font-size: 12px; color: #808080; margin-top: 10px; } .fixed-right .box .hide .tips { font-size: 12px; color: #808080; line-height: 1.5; } .fixed-right .box .hide .tips.mt { margin-top: 20px; } .fixed-right .box .hide .qw-img { width: 160px; border: 1px solid #e6e6e6; margin: 0 auto; } .fixed-right .box .hide .qw-img img { display: block; width: 100%; } @media (any-hover: hover) { .fixed-right .box:hover .show { background-color: #0071bc; } .fixed-right .box:hover .show i.s { opacity: 0; } .fixed-right .box:hover .show i.h { opacity: 1; } .fixed-right .box:hover .hide { opacity: 1; visibility: visible; } } .fixed-right .totop { margin-top: 0.1rem; width: max(50px, 0.6rem); height: max(32px, 0.4rem); background-color: #fff; background-position: center; background-repeat: no-repeat; background-image: url("../images/totop.svg"); background-size: auto max(8px, 0.12rem); cursor: pointer; } .fixed-form { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 15; display: none; } .fixed-form .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); } .fixed-form .main { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; display: flex; align-items: center; justify-content: center; } .fixed-form .block { width: 86%; max-width: 400px; background-color: #fff; } .fixed-form .top-block { padding: 0 30px; height: 60px; display: flex; align-items: center; justify-content: space-between; background-color: #0071bc; } .fixed-form .top-block span { font-size: 20px; color: #fff; } .fixed-form .top-block .close { width: 20px; height: 20px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/close-1.svg"); cursor: pointer; } .fixed-form .form { padding: 30px; } .fixed-form .item { margin-top: 15px; } .fixed-form .item:nth-of-type(1) { margin-top: 0; } .fixed-form .item span { display: block; padding-left: 10px; font-size: 14px; color: #333; margin-bottom: 5px; position: relative; } .fixed-form .item span i { position: absolute; top: 0; left: 0; color: red; font-style: normal; } .fixed-form .item input { width: 100%; height: 40px; border: 1px solid #e6e6e6; background-color: #fff; border-radius: 5px; padding: 0 20px; font-size: 14px; color: #333; } .fixed-form .item textarea { display: block; width: 100%; height: 80px; border: 1px solid #e6e6e6; background-color: #fff; border-radius: 5px; padding: 10px 20px; font-size: 14px; color: #333; resize: none; } .fixed-form .item button { width: 100%; height: 40px; font-size: 16px; color: #fff; background-color: #0071bc; border-radius: 5px; cursor: pointer; } .fixed-form .item .layui-input:hover, .fixed-form .item .layui-textarea:hover, .fixed-form .item .layui-input:focus, .fixed-form .item .layui-textarea:focus { border-color: #0071bc !important; } .fixed-form .item .layui-input:focus, .fixed-form .item .layui-textarea:focus { box-shadow: none; } .swiper-pagination-lock { display: none !important; } .wrap-s { width: 86%; max-width: 1440px; margin: 0 auto; position: relative; z-index: 3; } .c-banner { position: relative; } .c-banner .img-box { height: 33.33vw; } .c-banner .img-box img { display: block; width: 100%; height: 100%; object-fit: cover; } .c-banner .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; } .c-banner .tit { font-size: 0.44rem; color: #fff; font-weight: bold; } .c-banner p { max-width: 6.8rem; font-size: max(16px, 0.22rem); color: #fff; line-height: 1.5; margin-top: 0.1rem; } .c-banner .btns { margin-top: 0.3rem; display: flex; } .c-banner .btns a { position: relative; width: max(100px, 1.2rem); height: max(36px, 0.42rem); border: 1px solid #fff; overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .c-banner .btns a span { font-size: max(12px, 0.14rem); color: #fff; transition: color .3s ease; } @media (any-hover: hover) { .c-banner .btns a:hover { transform: translateY(-3px); background-color: #0071bc; border-color: #0071bc; } .c-banner .btns a:hover span { color: #fff; } } .c-label { display: flex; align-items: center; justify-content: space-between; } .c-label span { font-size: max(24px, 0.32rem); color: #181818; } .c-label a { display: flex; align-items: center; } .c-label a i { font-size: max(13px, 0.16rem); color: #393939; font-style: normal; transition: color .3s ease; } .c-label a:after { content: ''; width: 7px; height: 10px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/icon-1-1.svg"); margin-left: 0.1rem; transition: all .3s ease; } @media (any-hover: hover) { .c-label a:hover i { color: #0071bc; } .c-label a:hover:after { background-image: url("../images/icon-1-2.svg"); } } .c-pages { display: flex; align-items: center; justify-content: space-between; justify-content: center; margin-top: 0.6rem; } .c-pages ul { display: flex; } .c-pages ul li { position: relative; margin-left: 0.1rem; } .c-pages ul li:nth-of-type(1) { margin-left: 0; } .c-pages ul li a { display: block; width: max(30px, 0.48rem); height: max(30px, 0.48rem); border: 1px solid #e1e6ec; border-radius: 50%; position: relative; font-size: max(10px, 0.12rem); line-height: max(28px, 0.46rem); color: #666666; text-align: center; z-index: 2; transition: all .3s ease; } .c-pages ul li.prev a, .c-pages ul li.next a { background-position: center; background-repeat: no-repeat; background-size: auto 10px; background-image: url("../images/icon-1-1.svg"); } @media (any-hover: hover) { .c-pages ul li.prev:hover a, .c-pages ul li.next:hover a { background-image: url("../images/icon-1-3.svg"); } } .c-pages ul li.prev { transform: rotateY(180deg); } .c-pages ul li.active a { color: #fff; background-color: #0071bc; } @media (any-hover: hover) { .c-pages ul li:hover a { color: #fff; background-color: #0071bc; } } .c-filter-block { display: flex; position: relative; z-index: 2; } .c-filter-block .data-box { position: relative; width: max(200px, 2.5rem); } .c-filter-block .data-box .show { height: max(40px, 0.46rem); border: 1px solid #dcdcdc; border-radius: 3px; background-color: #fff; display: flex; align-items: center; justify-content: space-between; position: relative; padding: 0 0.45rem 0 0.2rem; cursor: pointer; z-index: 2; } .c-filter-block .data-box .show span { font-size: max(12px, 0.14rem); color: #333333; } .c-filter-block .data-box .show .year { font-size: max(12px, 0.14rem); color: #999999; } .c-filter-block .data-box .show:after { content: ''; width: 10px; height: 6px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-3.svg"); position: absolute; right: 0.2rem; top: calc(50% - 3px); } .c-filter-block .data-box .hide { position: absolute; font-size: 0; top: 100%; left: 0; width: 100%; background-color: #fff; padding: 0.2rem; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1); border-radius: 0 0 8px 8px; z-index: 1; display: none; } .c-filter-block .data-box .hide a { display: inline-block; vertical-align: top; width: 25%; font-size: max(12px, 0.14rem); color: #808080; line-height: 2; } @media (any-hover: hover) { .c-filter-block .data-box .hide a:hover { color: #0071bc; } } .c-filter-block .data-box.open .show { box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } .c-filter-block .data-box.open .hide { display: block; } .c-filter-block .form-box { margin-left: 0.15rem; width: max(380px, 4.55rem); height: max(40px, 0.46rem); border: 1px solid #dcdcdc; border-radius: 3px; background-color: #fff; position: relative; padding-right: 0.8rem; } .c-filter-block .form-box input { width: 100%; height: 100%; padding: 0 0.2rem; font-size: max(12px, 0.14rem); color: #333333; background-color: transparent; } .c-filter-block .form-box button { width: 0.6rem; height: 100%; position: absolute; right: 0; top: 0; background-position: center; background-repeat: no-repeat; background-image: url("../images/search-2.svg"); background-size: auto max(16px, 0.2rem); background-color: transparent; opacity: 0.8; cursor: pointer; } .c-crumbs { position: relative; z-index: 5; border-top: 1px solid #e6e6e6; } .c-crumbs .wrap-s { display: flex; align-items: center; } .c-crumbs a.home { position: relative; width: 0.18rem; height: 0.18rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/home.svg"); } .c-crumbs a.home:after { content: ''; width: 5px; height: 9px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/crumbs-2-1.svg"); position: absolute; right: -22px; top: 50%; margin-top: -5px; opacity: 0.3; } .c-crumbs a.link { position: relative; font-size: max(12px, 0.16rem); color: #666666; line-height: max(40px, 0.6rem); margin-left: 45px; } .c-crumbs a.link:after { content: ''; width: 5px; height: 9px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/crumbs-2-1.svg"); position: absolute; right: -22px; top: 50%; margin-top: -5px; opacity: 0.3; } .c-crumbs span { font-size: max(12px, 0.16rem); color: #666666; line-height: max(40px, 0.6rem); margin-left: 45px; } .video-pop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9; display: none; } .video-pop .bg { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.6); z-index: 1; } .video-pop .close { width: 20px; height: 20px; position: absolute; right: 20px; top: 20px; background: url("../images/close-1.svg") center no-repeat; transition: all .3s ease; cursor: pointer; z-index: 2; } @media (any-hover: hover) { .video-pop .close:hover { transform: rotate(180deg); } } .video-pop video { position: absolute; top: 50%; left: 50%; max-height: 86%; max-width: 86%; z-index: 3; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .pd-main { padding-bottom: 1.2rem; background-image: linear-gradient(180deg, #f2f6fa, #f2f6fa, #fff); } .pd-main1 { padding-bottom: 1.2rem; } .c-pd-label.mb { margin-bottom: 1.2rem; } .c-pd-label .label { font-size: 0.4rem; color: #141c3c; font-weight: bold; text-align: center; } .c-pd-label p { font-size: max(14px, 0.18rem); color: #242f43; text-align: center; margin-top: 0.15rem; opacity: 0.5; } .index-s1 { position: relative; } .index-s1 .item { position: relative; } .index-s1 .item .img-box { height: 33.33vw; } .index-s1 .item .img-box img, .index-s1 .item .img-box video { display: block; width: 100%; height: 100%; object-fit: cover; } .index-s1 .item .img-box video { position: absolute; top: 0; left: 0; z-index: 2; } .index-s1 .item .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; padding: 0.6rem 0; display: flex; align-items: flex-end; } .index-s1 .item .txt-box .wrap-s { display: flex; justify-content: flex-end; } .index-s1 .item .box { width: max(360px, 4.8rem); padding: 0.4rem 0.4rem; background-color: rgba(0, 0, 0, 0.5); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } .index-s1 .item .tit { font-size: max(24px, 0.32rem); color: #fff; line-height: 1.5; } .index-s1 .item .video-btn { margin-top: 0.4rem; display: flex; align-items: center; cursor: pointer; } .index-s1 .item .video-btn:before { content: ''; width: 0.4rem; height: 0.4rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/index/icon-3.png"); } .index-s1 .item .video-btn span { padding-left: 0.1rem; font-size: max(12px, 0.14rem); color: #fff; } .index-s1 .item a.link { display: inline-block; vertical-align: top; margin-top: 0.4rem; font-size: max(12px, 0.14rem); color: #fff; } .index-s1 .rolltxt { position: absolute; top: 0.2rem; left: 0; right: 0; margin: 0 auto; width: 86%; max-width: 1280px; padding: 0.1rem 0.24rem; background-color: rgba(255, 255, 255, 0.5); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 0; white-space: nowrap; z-index: 3; overflow: hidden; } .index-s1 .rolltxt p { display: inline-block; vertical-align: top; font-size: max(12px, 0.14rem); color: #b73933; } .index-s1 .rolltxt p i { display: inline-block; vertical-align: top; width: 100px; height: 10px; } .index-s1 .rolltxt p.ani { animation: index-banner-1 30s linear infinite; } .index-s1 .pagination { position: absolute; bottom: 0.6rem; left: 0; right: 0; z-index: 3; } .index-s1 .pagination .wrap-s { display: flex; width: 86% !important; } .index-s1 .pagination span { position: relative; width: 0.6rem; height: 0.04rem; background-color: rgba(255, 255, 255, 0.2); border-radius: 2px; overflow: hidden; cursor: pointer; margin-left: 0.1rem; } .index-s1 .pagination span:nth-of-type(1) { margin-left: 0; } .index-s1 .pagination span:before { content: ''; background-color: #fff; position: absolute; width: 100%; height: 100%; top: 0; left: 0; transform: scaleX(0); transform-origin: left top; will-change: transform; } .index-s1 .pagination span.active:before { animation: index-banner 5s linear forwards; } .index-s1 .button { position: absolute; top: 50%; transform: translateY(-50%); width: max(40px, 0.6rem); height: max(40px, 0.6rem); cursor: pointer; opacity: 0; z-index: 3; transition: opacity .3s ease; } .index-s1 .button .btn { width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; opacity: 0.5; transition: opacity .3s ease; } @media (any-hover: hover) { .index-s1 .button .btn:hover { opacity: 1; } } .index-s1 .button.show { opacity: 1; } .index-s1 .prev { left: 0.6rem; } .index-s1 .prev .btn { background-image: url("../images/index/left.png"); } .index-s1 .next { right: 0.6rem; } .index-s1 .next .btn { background-image: url("../images/index/right.png"); } .index-s2 .top-block { background-color: #fff; padding-top: 0.8rem; } .index-s2 .top-block .sw { display: flex; justify-content: space-between; } .index-s2 .top-block .item { position: relative; padding-bottom: 0.3rem; width: max(120px, 1.7rem); cursor: pointer; } .index-s2 .top-block .item .icon { width: max(30px, 0.48rem); height: max(30px, 0.48rem); margin: 0 auto; position: relative; will-change: transform; } .index-s2 .top-block .item .icon > div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; transition: opacity .3s ease; } .index-s2 .top-block .item .icon .hide { opacity: 0; } .index-s2 .top-block .item span { display: block; font-size: max(14px, 0.18rem); color: #181818; text-align: center; margin-top: 0.15rem; transition: color .3s ease; } .index-s2 .top-block .item:after { content: ''; width: 100%; height: 0.03rem; background-color: #0071bc; position: absolute; bottom: 0; left: 0; opacity: 0; transition: opacity .3s ease; } .index-s2 .top-block .item.active .icon .show { opacity: 0; } .index-s2 .top-block .item.active .icon .hide { opacity: 1; } .index-s2 .top-block .item.active span { color: #0071bc; } .index-s2 .top-block .item.active:after { opacity: 1; } @media (any-hover: hover) { .index-s2 .top-block .item:hover .icon { transform: rotateY(360deg); transition: transform .6s ease; } .index-s2 .top-block .item:hover .icon .show { opacity: 0; } .index-s2 .top-block .item:hover .icon .hide { opacity: 1; } .index-s2 .top-block .item:hover span { color: #0071bc; } } .index-s2 .bot-block { padding-top: 0.8rem; background-image: linear-gradient(180deg, #f2f3f4, #fff); } .index-s2 .bot-block .child { display: none; } .index-s2 .bot-block .child.active { display: block; } .index-s2 .bot-block .child.active .img-box, .index-s2 .bot-block .child.active .txt-box, .index-s2 .bot-block .child.active .btns { animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .index-s2 .bot-block .child.active .img-box, .index-s2 .bot-block .child.active .btns { display: flex; } .index-s2 .bot-block .child.active .txt-box { display: block; animation-delay: .1s; } .index-s2 .bot-block .child.active .btns { animation-delay: .2s; } .index-s2 .bot-block .flex { display: flex; align-items: center; } .index-s2 .bot-block .img-box { width: 50%; height: 3.32rem; align-items: center; justify-content: center; opacity: 0; display: none; } .index-s2 .bot-block img { max-width: 70%; max-height: 100%; } .index-s2 .bot-block .txt-box { width: 50%; padding-left: 0.5rem; opacity: 0; display: none; } .index-s2 .bot-block .tit { font-size: max(24px, 0.36rem); color: #181818; } .index-s2 .bot-block .s-tit { font-size: max(14px, 0.18rem); color: #333333; line-height: 1.5; margin-top: 0.1rem; } .index-s2 .bot-block .para { font-size: max(14px, 0.18rem); color: #000000; opacity: 0.5; line-height: 1.5; margin-top: 0.15rem; } .index-s2 .bot-block .btns { margin-top: 0.3rem; justify-content: center; opacity: 0; display: none; } .index-s2 .bot-block .btns a { position: relative; width: max(100px, 1.8rem); height: max(36px, 0.48rem); border: 1px solid rgba(0, 113, 188, 0.3); overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .index-s2 .bot-block .btns a span { font-size: max(12px, 0.14rem); color: #0071bc; transition: color .3s ease; } @media (any-hover: hover) { .index-s2 .bot-block .btns a:hover { transform: translateY(-3px); background-color: #0071bc; } .index-s2 .bot-block .btns a:hover span { color: #fff; } } .index-s3 { padding: 1.2rem 0; } .index-s3 .sw { display: flex; flex-wrap: wrap; gap: 0.24rem; } .index-s3 .item { width: calc((100% - 0.48rem) / 3); } @media screen and (min-width: 640px) { .index-s3 .item:nth-of-type(4), .index-s3 .item:nth-of-type(5) { width: calc((100% - 0.24rem) / 2); } .index-s3 .item:nth-of-type(4) .img-box, .index-s3 .item:nth-of-type(5) .img-box { aspect-ratio: 708/320; } } .index-s3 .item a { display: block; height: 100%; position: relative; overflow: hidden; } .index-s3 .item a:before { content: ''; width: 100%; height: 50%; position: absolute; left: 0; bottom: 0; background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.8)); z-index: 2; } .index-s3 .item .img-box { height: 100%; aspect-ratio: 1 / 1; position: relative; z-index: 1; } .index-s3 .item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s3 .item .txt-box { position: absolute; bottom: 0; left: 0; width: 100%; padding: 0.4rem; z-index: 3; } .index-s3 .item .tit { font-size: max(18px, 0.24rem); color: #fff; } @media (any-hover: hover) { .index-s3 .item:hover img { transform: scale(1.05); } } .index-s4 { position: relative; padding: 1.2rem 0; background-image: linear-gradient(180deg, #deecf5, #fff, #fff); overflow: hidden; } .index-s4 .wrap-s { position: static; } .index-s4 .top-block { padding-top: 1rem; } .index-s4 .top-block .txt-box { width: 50%; position: relative; z-index: 2; } .index-s4 .top-block .label { font-size: max(24px, 0.36rem); color: #181818; } .index-s4 .top-block .para { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; opacity: 0.5; margin-top: 0.15rem; } .index-s4 .top-block .img-box { width: 10.62rem; position: absolute; top: 1rem; left: 45%; z-index: 1; mix-blend-mode: darken; } .index-s4 .top-block .img-box img { display: block; width: 100%; } .index-s4 .bot-block { margin-top: 1.8rem; position: relative; z-index: 3; } .index-s4 .items { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 0.16rem; } .index-s4 .item { background-color: rgba(223, 238, 252, 0.3); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } .index-s4 .item a { display: block; height: 100%; padding: 0.4rem; } .index-s4 .item .icon { width: 0.6rem; height: 0.6rem; display: flex; align-items: center; } .index-s4 .item .icon img { max-width: 100%; max-height: 100%; } .index-s4 .item .tit { font-size: max(18px, 0.24rem); color: #181818; margin-top: 0.24rem; } .index-s4 .item p { font-size: max(12px, 0.14rem); color: #808080; line-height: 1.5; margin-top: 0.15rem; } @media (any-hover: hover) { .index-s4 .item:hover .icon { transform: rotateY(360deg); transition: transform .6s ease; } } .index-s5 { position: relative; } .index-s5:before { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.3); z-index: 2; } .index-s5:after { content: ''; width: 100%; height: 3rem; position: absolute; top: 0; left: 0; background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0)); z-index: 3; } .index-s5 .bg-block { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; z-index: 1; } .index-s5 .bg-block .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; opacity: 0; transition: opacity .3s ease; } .index-s5 .bg-block .bg.active { opacity: 1; } .index-s5 .cont-block { padding: 1.2rem 0; position: relative; z-index: 4; } .index-s5 .label { font-size: max(24px, 0.36rem); color: #fff; text-align: center; } .index-s5 .tab-tit { margin-top: 0.2rem; } .index-s5 .tab-tit .sw { display: flex; justify-content: center; gap: 0.6rem; } .index-s5 .tab-tit .item { position: relative; padding: 0.1rem 0; cursor: pointer; } .index-s5 .tab-tit .item span { display: block; font-size: max(15px, 0.2rem); color: #fff; } .index-s5 .tab-tit .item:after { content: ''; width: 100%; height: 1px; background-color: #fff; position: absolute; bottom: 0; left: 0; opacity: 0; transform: scale(0); transition: all .3s ease; } .index-s5 .tab-tit .item.active:after { opacity: 1; transform: scale(1); } .index-s5 .tab-cont { margin-top: 1.2rem; height: 3.6rem; } .index-s5 .tab-cont .child { display: none; } .index-s5 .tab-cont .child.active { display: block; } .index-s5 .tab-cont .child.active .tit, .index-s5 .tab-cont .child.active .para, .index-s5 .tab-cont .child.active .btns { animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .index-s5 .tab-cont .child.active .tit, .index-s5 .tab-cont .child.active .para { display: block; } .index-s5 .tab-cont .child.active .para { animation-delay: .1s; } .index-s5 .tab-cont .child.active .btns { display: flex; animation-delay: .2s; } .index-s5 .tab-cont .tit { font-size: max(18px, 0.24rem); color: #fff; opacity: 0; display: none; } .index-s5 .tab-cont .para { max-width: 6rem; font-size: max(14px, 0.18rem); color: #fff; line-height: 1.5; margin-top: 0.15rem; opacity: 0; display: none; } .index-s5 .tab-cont .btns { margin-top: 0.5rem; display: none; opacity: 0; } .index-s5 .tab-cont .btns a { position: relative; width: max(100px, 1.8rem); height: max(36px, 0.48rem); border: 1px solid rgba(255, 255, 255, 0.3); overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .index-s5 .tab-cont .btns a span { font-size: max(12px, 0.14rem); color: #fff; transition: color .3s ease; } @media (any-hover: hover) { .index-s5 .tab-cont .btns a:hover { transform: translateY(-3px); background-color: #fff; } .index-s5 .tab-cont .btns a:hover span { color: #0071bc; } } .index-s5 .s-img { position: absolute; bottom: -0.6rem; left: 0; right: 0; display: flex; justify-content: center; gap: 0.1rem; } .index-s5 .s-img .item { width: 40px; height: 40px; padding: 4px; position: relative; cursor: pointer; } .index-s5 .s-img .item .img-box { border-radius: 50%; height: 100%; overflow: hidden; } .index-s5 .s-img .item img { display: block; width: 100%; height: 100%; object-fit: cover; } .index-s5 .s-img .item svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; fill: none; stroke: #fff; stroke-width: 1px; stroke-dasharray: 120; stroke-dashoffset: 120; transform: rotate(-90deg); z-index: 2; } .index-s5 .s-img .item.active svg { animation: oindex-1 5s linear forwards; } .index-s6 { padding: 1.2rem 0 0; } .index-s6 .left-box { width: 66%; } .index-s6 .left-box a { display: block; position: relative; aspect-ratio: 952 / 480; overflow: hidden; } .index-s6 .left-box .img-box { height: 100%; position: relative; z-index: 1; } .index-s6 .left-box img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s6 .left-box .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0.6rem; z-index: 3; } .index-s6 .left-box .label { font-size: max(24px, 0.36rem); color: #fff; } .index-s6 .left-box p { font-size: max(14px, 0.18rem); color: #fff; line-height: 1.5; opacity: 0.5; margin-top: 0.15rem; } .index-s6 .left-box .btns { margin-top: 0.8rem; display: flex; } .index-s6 .left-box .btns .inner { position: relative; width: max(100px, 1.8rem); height: max(36px, 0.48rem); border: 1px solid rgba(255, 255, 255, 0.3); overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .index-s6 .left-box .btns .inner span { font-size: max(12px, 0.14rem); color: #fff; transition: color .3s ease; } @media (any-hover: hover) { .index-s6 .left-box .btns .inner:hover { transform: translateY(-3px); background-color: #fff; } .index-s6 .left-box .btns .inner:hover span { color: #0071bc; } } @media (any-hover: hover) { .index-s6 .left-box:hover img { transform: scale(1.05); } } .index-s6 .right-box { width: calc(34% - 0.24rem); height: 100%; position: absolute; right: 0; top: 0; } .index-s6 .right-box a { display: block; height: 100%; position: relative; overflow: hidden; } .index-s6 .right-box a:before { content: ''; width: 100%; height: 50%; position: absolute; left: 0; bottom: 0; background-image: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.6)); z-index: 2; } .index-s6 .right-box .img-box { height: 100%; position: relative; z-index: 1; } .index-s6 .right-box img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s6 .right-box .txt-box { position: absolute; bottom: 0; left: 0; width: 100%; padding: 0.6rem; z-index: 3; } .index-s6 .right-box .label { font-size: max(24px, 0.36rem); color: #fff; } @media (any-hover: hover) { .index-s6 .right-box:hover img { transform: scale(1.05); } } .index-s7 { padding: 1.2rem 0 0; } .index-s7 .label { font-size: max(24px, 0.36rem); color: #181818; text-align: center; } .index-s7 .items { margin-top: 0.4rem; display: grid; grid-template-columns: repeat(7, 1fr); grid-gap: 0.12rem; } .index-s7 .item { height: max(60px, 0.8rem); display: flex; align-items: center; justify-content: center; border: 1px solid #e5e5e5; border-radius: 0.1rem; } .index-s7 .item img { max-width: 70%; max-height: 60%; } .index-s8 { padding: 1.2rem 0; } .index-s8 .top-block { display: flex; justify-content: space-between; align-items: center; } .index-s8 .label { font-size: max(24px, 0.36rem); color: #181818; text-align: center; } .index-s8 .tab-tit .sw { display: flex; justify-content: center; gap: 0.6rem; } .index-s8 .tab-tit .item { position: relative; padding: 0.1rem 0; cursor: pointer; } .index-s8 .tab-tit .item span { display: block; font-size: max(15px, 0.2rem); color: #181818; } .index-s8 .tab-tit .item:after { content: ''; width: 100%; height: 1px; background-color: #0071bc; position: absolute; bottom: 0; left: 0; opacity: 0; transform: scale(0); transition: all .3s ease; } .index-s8 .tab-tit .item.active:after { opacity: 1; transform: scale(1); } .index-s8 .tab-cont { margin-top: 0.4rem; } .index-s8 .tab-cont .child { display: none; } .index-s8 .tab-cont .child.active { display: block; } .index-s8 .tab-cont .child.active .items, .index-s8 .tab-cont .child.active .btns { animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .index-s8 .tab-cont .child.active .items { display: block; } .index-s8 .tab-cont .child.active .btns { display: flex; animation-delay: .2s; } .index-s8 .tab-cont .items { display: none; opacity: 0; } .index-s8 .tab-cont .swiperbox .sw { display: grid; grid-template-columns: repeat(3, calc((100% - 0.48rem) / 3)); grid-gap: 0.24rem; } .index-s8 .tab-cont .item { background-color: #f5f8fa; } .index-s8 .tab-cont .item a { display: block; height: 100%; position: relative; padding-bottom: 0.8rem; } .index-s8 .tab-cont .item .img-box { position: relative; padding-bottom: 56.5%; overflow: hidden; -webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(85%, transparent), to(rgba(250, 250, 250, 0.5))); } .index-s8 .tab-cont .item img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .index-s8 .tab-cont .item .txt-box { position: relative; padding: 0.4rem 0.4rem 0; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); z-index: 2; } .index-s8 .tab-cont .item .tit { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; transition: color .3s ease; } .index-s8 .tab-cont .item .info-box { position: absolute; bottom: 0.4rem; left: 0.4rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; z-index: 3; } .index-s8 .tab-cont .item .info { display: flex; align-items: center; } .index-s8 .tab-cont .item .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .index-s8 .tab-cont .item .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .index-s8 .tab-cont .item .date:before { background-image: url("../images/news/icon-2-1.svg"); } .index-s8 .tab-cont .item .view:before { background-image: url("../images/news/icon-2-2.svg"); } .index-s8 .tab-cont .item .source:before { background-image: url("../images/news/icon-2-3.svg"); } @media (any-hover: hover) { .index-s8 .tab-cont .item:hover img { transform: scale(1.1); } .index-s8 .tab-cont .item:hover .tit { color: #0071bc; } } .index-s8 .tab-cont .btns { margin-top: 0.3rem; justify-content: center; display: none; opacity: 0; } .index-s8 .tab-cont .btns a { position: relative; width: max(100px, 1.8rem); height: max(36px, 0.48rem); border: 1px solid rgba(0, 113, 188, 0.3); overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .index-s8 .tab-cont .btns a span { font-size: max(12px, 0.14rem); color: #0071bc; transition: color .3s ease; } @media (any-hover: hover) { .index-s8 .tab-cont .btns a:hover { transform: translateY(-3px); background-color: #0071bc; } .index-s8 .tab-cont .btns a:hover span { color: #fff; } } .index-s8 .pagination { margin-top: 20px; display: flex; justify-content: center; } .index-s8 .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .index-s8 .pagination span:nth-of-type(1) { margin-left: 0; } .index-s8 .pagination span.active { background-color: #0071bc; } .inner-s1 { padding: 1.2rem 0; } .inner-s1 .cont-block { margin-top: 0.4rem; position: relative; } .inner-s1 .left-box { width: 66%; } .inner-s1 .right-box { width: calc(34% - 0.2rem); position: absolute; right: 0; top: 0; height: 100%; display: flex; flex-direction: column; justify-content: space-between; } .inner-s1 .single a { display: block; position: relative; } .inner-s1 .single a:before { content: ''; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; background: url("../images/news/img-1.png") center bottom no-repeat; background-size: 100% auto; z-index: 2; } .inner-s1 .single .img-box { position: relative; padding-bottom: 56.5%; overflow: hidden; position: relative; z-index: 1; } .inner-s1 .single img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s1 .single .txt-box { position: absolute; bottom: 0; left: 0; width: 100%; padding: 0.4rem; z-index: 3; } .inner-s1 .single .tit { font-size: max(14px, 0.18rem); color: #fff; line-height: 1.5; } .inner-s1 .single .info-box { margin-top: 0.2rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; } .inner-s1 .single .info { display: flex; align-items: center; } .inner-s1 .single .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s1 .single .info span { font-size: max(12px, 0.14rem); color: #fff; margin-left: 0.1rem; } .inner-s1 .single .date:before { background-image: url("../images/news/icon-1-1.svg"); } .inner-s1 .single .view:before { background-image: url("../images/news/icon-1-2.svg"); } .inner-s1 .single .source:before { background-image: url("../images/news/icon-1-3.svg"); } @media (any-hover: hover) { .inner-s1 .single:hover img { transform: scale(1.1); } } .inner-s1 .item { height: calc((100% - 0.2rem) / 2); } .inner-s1 .item a { display: block; height: 100%; position: relative; } .inner-s1 .item .img-box { height: 100%; overflow: hidden; } .inner-s1 .item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s1 .item .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0.3rem; z-index: 3; } .inner-s1 .item .tit { font-size: max(14px, 0.18rem); color: #fff; line-height: 1.5; } @media (any-hover: hover) { .inner-s1 .item:hover img { transform: scale(1.1); } } .inner-s1 .m-items { display: none; margin-top: 20px; } .inner-s1 .m-items .m-item { background-color: #f5f5f5; height: auto; } .inner-s1 .m-items .m-item a { display: block; height: 100%; position: relative; padding-bottom: 0.8rem; } .inner-s1 .m-items .m-item .img-box { aspect-ratio: 464 / 261; overflow: hidden; } .inner-s1 .m-items .m-item img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s1 .m-items .m-item .txt-box { padding: 0.4rem 0.4rem 0; } .inner-s1 .m-items .m-item .tit { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; } .inner-s1 .m-items .m-item .info-box { position: absolute; bottom: 0.4rem; left: 0.4rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; } .inner-s1 .m-items .m-item .info { display: flex; align-items: center; } .inner-s1 .m-items .m-item .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s1 .m-items .m-item .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .inner-s1 .m-items .m-item .date:before { background-image: url("../images/news/icon-2-1.svg"); } .inner-s1 .m-items .m-item .view:before { background-image: url("../images/news/icon-2-2.svg"); } .inner-s1 .m-items .pagination { margin-top: 20px; display: flex; justify-content: center; } .inner-s1 .m-items .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s1 .m-items .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s1 .m-items .pagination span.active { background-color: #0071bc; } .inner-s2 { padding: 1.2rem 0; background-color: #f8f8f8; } .inner-s2 .items { margin-top: 0.4rem; display: grid; grid-template-columns: repeat(3, calc((100% - 0.48rem) / 3)); grid-gap: 0.24rem; } .inner-s2 .item { background-color: #fff; } .inner-s2 .item a { display: block; height: 100%; position: relative; padding-bottom: 0.8rem; } .inner-s2 .item .img-box { position: relative; padding-bottom: 56.5%; overflow: hidden; } .inner-s2 .item img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s2 .item .txt-box { padding: 0.4rem 0.4rem 0; } .inner-s2 .item .tit { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; transition: color .3s ease; } .inner-s2 .item .info-box { position: absolute; bottom: 0.4rem; left: 0.4rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; } .inner-s2 .item .info { display: flex; align-items: center; } .inner-s2 .item .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s2 .item .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .inner-s2 .item .date:before { background-image: url("../images/news/icon-2-1.svg"); } .inner-s2 .item .view:before { background-image: url("../images/news/icon-2-2.svg"); } .inner-s2 .item .source:before { background-image: url("../images/news/icon-2-3.svg"); } @media (any-hover: hover) { .inner-s2 .item:hover img { transform: scale(1.1); } .inner-s2 .item:hover .tit { color: #0071bc; } } .inner-s2 .m-items { display: none; margin-top: 20px; } .inner-s2 .m-items .m-item { background-color: #ffffff; } .inner-s2 .m-items .m-item a { display: block; height: 100%; position: relative; padding-bottom: 0.8rem; } .inner-s2 .m-items .m-item .img-box { aspect-ratio: 464 / 261; overflow: hidden; } .inner-s2 .m-items .m-item img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s2 .m-items .m-item .txt-box { padding: 0.4rem 0.4rem 0; } .inner-s2 .m-items .m-item .tit { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; } .inner-s2 .m-items .m-item .info-box { position: absolute; bottom: 0.4rem; left: 0.4rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; } .inner-s2 .m-items .m-item .info { display: flex; align-items: center; } .inner-s2 .m-items .m-item .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s2 .m-items .m-item .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .inner-s2 .m-items .m-item .date:before { background-image: url("../images/news/icon-2-1.svg"); } .inner-s2 .m-items .m-item .view:before { background-image: url("../images/news/icon-2-2.svg"); } .inner-s2 .m-items .pagination { margin-top: 20px; display: flex; justify-content: center; } .inner-s2 .m-items .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s2 .m-items .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s2 .m-items .pagination span.active { background-color: #0071bc; } .inner-s3 { padding: 1.2rem 0; } .inner-s3 .wrap-s { display: flex; justify-content: space-between; } .inner-s3 .left-block { width: 57%; } .inner-s3 .left-block .items { margin-top: 0.4rem; } .inner-s3 .left-block .item { position: relative; border-bottom: 1px solid #ededed; } .inner-s3 .left-block .item:after { content: ''; width: 100%; height: 1px; background-color: #0071bc; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: left top; transition: transform .4s ease; } .inner-s3 .left-block .item a { padding: 0.3rem 0; display: flex; align-items: center; } .inner-s3 .left-block .item .num-box { width: 0.8rem; height: 0.8rem; background-color: #f8f8f8; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .inner-s3 .left-block .item .num-box span { font-size: max(18px, 0.24rem); color: #333333; font-family: 'Arial'; font-weight: bold; transition: color .3s ease; } .inner-s3 .left-block .item .txt-box { width: calc(100% - 0.8rem); display: flex; align-items: center; justify-content: space-between; } .inner-s3 .left-block .item .tit { width: calc(100% - 1.2rem); padding: 0 0.3rem; font-size: max(14px, 0.18rem); color: #000000; line-height: 1.5; transition: color .3s ease; } .inner-s3 .left-block .item .date { width: 1.2rem; display: flex; align-items: center; } .inner-s3 .left-block .item .date:before { content: ''; width: 14px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-2-1.svg"); } .inner-s3 .left-block .item .date span { font-size: max(13px, 0.16rem); color: #808080; padding-left: 0.1rem; } .inner-s3 .left-block .item:nth-of-type(1) a { padding-top: 0; } @media (any-hover) { .inner-s3 .left-block .item:hover:after { transform: scaleX(1); } .inner-s3 .left-block .item:hover .num-box { background-color: #0071bc; } .inner-s3 .left-block .item:hover .num-box span { color: #fff; } .inner-s3 .left-block .item:hover .tit { color: #0071bc; } } .inner-s3 .right-block { width: calc(43% - 0.8rem); } .inner-s3 .right-block .items { margin-top: 0.4rem; } .inner-s3 .right-block .item { margin-top: 0.24rem; } .inner-s3 .right-block .item:nth-of-type(1) { margin-top: 0; } .inner-s3 .right-block .item:last-of-type a:before { display: none; } .inner-s3 .right-block .item a { display: block; height: 100%; position: relative; padding-left: 0.8rem; } .inner-s3 .right-block .item a:before { content: ''; width: 1px; height: calc(100% + 0.24rem); background-color: #d4d4d4; position: absolute; top: 0.4rem; left: 0; } .inner-s3 .right-block .item .year { width: 0.8rem; padding-left: 0.15rem; position: absolute; top: 0.3rem; left: 0; font-size: max(13px, 0.16rem); line-height: 1.5; color: #808080; font-weight: bold; } .inner-s3 .right-block .item .year:before { content: ''; width: 7px; height: 7px; position: absolute; left: -3px; top: calc(50% - 3px); border-radius: 50%; background-color: #888888; } .inner-s3 .right-block .item .txt-box { padding: 0.3rem; background-color: #f5f8fa; position: relative; transition: all .3s ease; } .inner-s3 .right-block .item .txt-box:before { content: ''; width: 0; height: 0; border-left: 9px solid transparent; border-right: 9px solid transparent; border-top: 9px solid #f5f8fa; position: absolute; left: -9px; top: 0; transition: all .3s ease; } .inner-s3 .right-block .item .tit { font-size: max(14px, 0.18rem); color: #000000; line-height: 1.5; transition: color .3s ease; } @media (any-hover: hover) { .inner-s3 .right-block .item:hover .txt-box { background-color: #0071bc; } .inner-s3 .right-block .item:hover .txt-box:before { border-top-color: #0071bc; } .inner-s3 .right-block .item:hover .tit { color: #fff; } } .inner-s4 { padding: 1.2rem 0; background-color: #f8f8f8; } .inner-s4.style-1 { padding: 0.4rem 0 1.2rem; } .inner-s4 .c-filter-block { margin-bottom: 0.6rem; } .inner-s4 .items { display: grid; grid-template-columns: repeat(3, calc((100% - 0.48rem) / 3)); grid-gap: 0.24rem; } .inner-s4 .item { background-color: #fff; } .inner-s4 .item a { display: block; height: 100%; position: relative; padding-bottom: 0.8rem; } .inner-s4 .item .img-box { position: relative; padding-bottom: 56.5%; overflow: hidden; } .inner-s4 .item img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s4 .item .txt-box { padding: 0.4rem 0.4rem 0; } .inner-s4 .item .tit { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; transition: color .3s ease; } .inner-s4 .item .info-box { position: absolute; bottom: 0.4rem; left: 0.4rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; } .inner-s4 .item .info { display: flex; align-items: center; } .inner-s4 .item .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s4 .item .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .inner-s4 .item .date:before { background-image: url("../images/news/icon-2-1.svg"); } .inner-s4 .item .view:before { background-image: url("../images/news/icon-2-2.svg"); } .inner-s4 .item .source:before { background-image: url("../images/news/icon-2-3.svg"); } @media (any-hover: hover) { .inner-s4 .item:hover img { transform: scale(1.1); } .inner-s4 .item:hover .tit { color: #0071bc; } } .inner-s5 { padding: 0.35rem 0; background-color: #fff; } .inner-s5 .items .sw { display: flex; } .inner-s5 .item { margin-right: 0.24rem; } .inner-s5 .item:last-of-type { margin-right: 0; } .inner-s5 .item a { display: block; padding: 0 0.24rem; font-size: max(14px, 0.18rem); line-height: max(32px, 0.46rem); color: #181818; border-radius: max(16px, 0.23rem); transition: all .3s ease; } .inner-s5 .item.active a { color: #0071bc; background-color: #f5f5f5; } @media (any-hover: hover) { .inner-s5 .item:hover a { color: #0071bc; } } .inner-s6 { padding: 0.4rem 0 1.2rem; background-color: #f5f5f5; } .inner-s6 .c-filter-block { margin-bottom: 0.6rem; } .inner-s6 .items { display: grid; grid-template-columns: repeat(2, calc((100% - 0.2rem) / 2)); grid-gap: 0.2rem; } .inner-s6 .item { background-color: #fff; border-radius: 5px; } .inner-s6 .item a { display: block; position: relative; height: 100%; padding: 0.3rem 0.24rem 0.6rem; } .inner-s6 .item .tips { display: inline-block; background-color: #0071bc; font-size: max(10px, 0.12rem); color: #fff; line-height: 20px; padding: 0 12px; border-radius: 3px; } .inner-s6 .item .tit { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; margin-top: 0.15rem; transition: color .3s ease; } .inner-s6 .item .info-box { position: absolute; bottom: 0.24rem; left: 0.24rem; display: inline-grid; grid-template-columns: auto auto auto; grid-gap: 0.24rem; } .inner-s6 .item .info { display: flex; align-items: center; } .inner-s6 .item .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s6 .item .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .inner-s6 .item .date:before { background-image: url("../images/news/icon-2-1.svg"); } .inner-s6 .item .view:before { background-image: url("../images/news/icon-2-2.svg"); } @media (any-hover: hover) { .inner-s6 .item:hover .tit { color: #0071bc; } } .inner-s7 .block { padding: 1.2rem 0; } .inner-s7 .block:nth-of-type(odd) .img-box { order: 2; } .inner-s7 .block:nth-of-type(odd) .txt-box { padding-right: 1rem; } .inner-s7 .block:nth-of-type(even) { background-color: #f5f5f5; } .inner-s7 .block:nth-of-type(even) .txt-box { padding-left: 1rem; } .inner-s7 .block .wrap-s { display: flex; align-items: center; } .inner-s7 .block .img-box { width: 50%; aspect-ratio: 720 / 420; } .inner-s7 .block img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s7 .block .txt-box { width: 50%; } .inner-s7 .block .num { font-size: 0.6rem; line-height: 1; color: #231916; mask: linear-gradient(180deg, #fff 50%, rgba(255, 255, 255, 0) 65%); } .inner-s7 .block .tit { font-size: 0.48rem; color: #231916; margin-top: -0.2rem; } .inner-s7 .block .para { font-size: max(16px, 0.22rem); color: #231916; line-height: 1.5; margin-top: 0.15rem; } .inner-s8 { padding: 1.2rem 0; } .inner-s8 .items { display: flex; justify-content: space-between; } .inner-s8 .item { width: 30%; } .inner-s8 .item .icon { width: 0.9rem; height: 0.9rem; margin: 0 auto; background-color: #f5f9fc; border-radius: 50%; position: relative; } .inner-s8 .item .icon:before { content: ''; position: absolute; top: 0.07rem; left: 0.07rem; right: 0.07rem; bottom: 0.07rem; background-color: #dcebf5; border-radius: 50%; } .inner-s8 .item i { position: absolute; top: 0.14rem; left: 0.14rem; right: 0.14rem; bottom: 0.14rem; background-color: #0071bc; border-radius: 50%; background-position: center; background-repeat: no-repeat; } .inner-s8 .item .tit { text-align: center; font-size: max(16px, 0.22rem); color: #333333; font-weight: bold; margin-top: 0.1rem; } .inner-s8 .item p { font-size: max(14px, 0.18rem); color: #808080; text-align: center; line-height: 1.5; word-break: break-all; margin-top: 0.15rem; } .inner-s8 .item:nth-of-type(1) i { background-size: auto 0.22rem; } .inner-s8 .item:nth-of-type(2) i { background-size: auto 0.2rem; } .inner-s8 .item:nth-of-type(3) i { background-size: auto 0.26rem; } .inner-s8 .map-box { margin-top: 0.7rem; aspect-ratio: 1440 / 623; overflow: hidden; } .inner-s8 .map-box a { display: block; height: 100%; } .inner-s8 .map-box img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s9 { padding: 1.2rem 0; background-color: #f5f6f8; } .inner-s9 .items { display: grid; grid-template-columns: repeat(2, calc((100% - 0.2rem) / 2)); grid-gap: 0.24rem; } .inner-s9 .item a { display: block; position: relative; height: 100%; border-radius: 5px; overflow: hidden; } .inner-s9 .item a:before { content: ''; width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; background: url("../images/case/img-1.png") center bottom no-repeat; background-size: 100% auto; z-index: 2; } .inner-s9 .item .img-box { border-radius: 5px; overflow: hidden; position: relative; padding-bottom: 56.5%; z-index: 1; } .inner-s9 .item img { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s9 .item .txt-box { position: absolute; bottom: 0; left: 0; width: 100%; padding: 0.3rem; z-index: 3; } .inner-s9 .item .tit { font-size: max(14px, 0.18rem); color: #fff; text-align: center; line-height: 1.5; } @media (any-hover: hover) { .inner-s9 .item:hover img { transform: scale(1.1); } } .inner-s10 { background-color: #f5f5f5; padding: 1.6rem 0; } .inner-s10 .wrap-s { display: flex; padding: 0 0.8rem; } .inner-s10 .left-block { width: 3.2rem; } .inner-s10 .left-block .sticky { width: max(60px, 0.8rem); position: sticky; top: 120px; background-color: #fff; border-radius: 10px; padding: 0.1rem 0; } .inner-s10 .left-block .item { display: flex; align-items: center; justify-content: center; height: max(36px, 0.44rem); position: relative; cursor: pointer; } .inner-s10 .left-block .item:before { content: ''; width: 0; height: 0; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid #0071bc; position: absolute; left: calc(100% - 1px); top: calc(50% - 6px); opacity: 0; transition: opacity .3s ease; } .inner-s10 .left-block .item span { font-size: max(13px, 0.16rem); color: #a7a7a7; transition: color .3s ease; } .inner-s10 .left-block .item.active { background-color: #0071bc; } .inner-s10 .left-block .item.active:before { opacity: 1; } .inner-s10 .left-block .item.active span { color: #fff; } .inner-s10 .right-block { width: calc(100% - 3.2rem); position: relative; padding-left: 0.4rem; } .inner-s10 .right-block:before { content: ''; width: 2px; position: absolute; top: -0.4rem; bottom: -0.4rem; left: -1px; background-color: #0071bc; } .inner-s10 .right-block:after { content: ''; width: max(12px, 0.18rem); height: max(12px, 0.18rem); border-radius: 50%; background-color: #f5f5f5; border: max(2px, 0.04rem) solid #0071bc; position: absolute; top: -0.4rem; left: 0; transform: translateX(-50%); box-sizing: border-box; } .inner-s10 .right-block .block { margin-top: 1rem; } .inner-s10 .right-block .block:nth-of-type(1) { margin-top: 0; } .inner-s10 .right-block .label { font-size: max(24px, 0.32rem); color: #333; margin-bottom: 0.2rem; } .inner-s10 .right-block .item { margin-top: 0.3rem; position: relative; } .inner-s10 .right-block .item:nth-of-type(1) { margin-top: 0; } .inner-s10 .right-block .item:before { content: ''; width: max(6px, 0.1rem); height: max(6px, 0.1rem); background-color: #0071bc; border-radius: 50%; position: absolute; top: 0.5rem; left: -0.4rem; transform: translateX(-50%); } .inner-s10 .right-block .item a { display: flex; align-items: center; padding: 0.15rem; background-color: #fff; border-radius: 5px; } .inner-s10 .right-block .item .img-box { width: 2.73rem; aspect-ratio: 273 / 167; overflow: hidden; } .inner-s10 .right-block .item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s10 .right-block .item .txt-box { width: calc(100% - 2.73rem); padding: 0 0.4rem; } .inner-s10 .right-block .item .tit { font-size: max(14px, 0.18rem); color: #000000; line-height: 1.5; transition: color .3s ease; } .inner-s10 .right-block .item .date { display: flex; align-items: center; margin-top: 0.2rem; } .inner-s10 .right-block .item .date:before { content: ''; width: 14px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/news/icon-2-1.svg"); } .inner-s10 .right-block .item .date span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } @media (any-hover: hover) { .inner-s10 .right-block .item:hover img { transform: scale(1.1); } .inner-s10 .right-block .item:hover .tit { color: #0071bc; } } .inner-s11 { padding: 1.2rem 0; background-color: #ffffff; border-top: 1px solid #e6e6e6; } .inner-s11 .top-block .tit { font-size: 0.48rem; color: #333333; font-weight: bold; text-align: center; } .inner-s11 .top-block .info-box { margin-top: 0.4rem; display: grid; justify-content: center; grid-template-columns: auto auto auto; grid-gap: 0.6rem; } .inner-s11 .top-block .info { display: flex; align-items: center; } .inner-s11 .top-block .info:before { content: ''; width: 20px; height: 14px; background-position: center; background-repeat: no-repeat; background-size: contain; } .inner-s11 .top-block .info span { font-size: max(12px, 0.14rem); color: #808080; margin-left: 0.1rem; } .inner-s11 .top-block .date:before { background-image: url("../images/news/icon-2-1.svg"); } .inner-s11 .top-block .view:before { background-image: url("../images/news/icon-2-2.svg"); } .inner-s11 .top-block .source:before { background-image: url("../images/news/icon-2-3.svg"); } .inner-s11 .top-block .share { position: relative; display: grid; justify-content: center; grid-template-columns: auto auto; margin-top: 0.5rem; } .inner-s11 .top-block .share:before { content: ''; width: 100%; height: 1px; background-color: #e6e6e6; position: absolute; top: 50%; left: 0; } .inner-s11 .top-block .share a { width: 0.7rem; height: 0.24rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-color: #ffffff; position: relative; z-index: 2; transition: all .3s ease; } .inner-s11 .top-block .share a.sina { background-image: url("../images/news/share-2-1.svg"); } @media (any-hover: hover) { .inner-s11 .top-block .share a.sina:hover { background-image: url("../images/news/share-2-2.svg"); } } .inner-s11 .top-block .share a.wechat { background-image: url("../images/news/share-1-1.svg"); } @media (any-hover: hover) { .inner-s11 .top-block .share a.wechat:hover { background-image: url("../images/news/share-1-2.svg"); } } .inner-s11 .mid-block { margin-top: 0.7rem; } .inner-s11 .mid-block .para { font-size: max(14px, 0.17rem); color: #333333; line-height: 2; } .inner-s11 .mid-block .para img { max-width: 100%; height: auto !important; } .inner-s11 .mid-block .para p { margin-bottom: 0.24rem !important; } .inner-s11 .mid-block .para p:last-of-type { margin-bottom: 0 !important; } .inner-s11 .mid-block .para span { font-size: inherit !important; } .inner-s11 .mid-block .para ul { padding-left: 0.2rem; } .inner-s11 .mid-block .para ul li { list-style: inherit; } .inner-s11 .bot-block { margin-top: 0.6rem; } .inner-s11 .bot-block .back { position: relative; display: flex; justify-content: center; } .inner-s11 .bot-block .back:before { content: ''; width: 100%; height: 1px; background-color: #e6e6e6; position: absolute; top: 0.3rem; left: 0; } .inner-s11 .bot-block .back a { display: flex; flex-direction: column; align-items: center; padding: 0 0.2rem; background-color: #ffffff; position: relative; z-index: 2; } .inner-s11 .bot-block .back a i { width: 0.6rem; height: 0.6rem; border-radius: 50%; border: 1px solid #e8e8e8; background-position: center; background-repeat: no-repeat; background-image: url("../images/news/icon-4.svg"); background-size: auto 0.24rem; background-color: #fff; } .inner-s11 .bot-block .back a span { font-size: max(12px, 0.14rem); color: #333333; margin-top: 0.1rem; transition: color .3s ease; } @media (any-hover: hover) { .inner-s11 .bot-block .back a:hover span { color: #0071bc; } } .inner-s11 .bot-block .page { display: flex; justify-content: space-between; } .inner-s11 .bot-block .page a { width: 2rem; line-height: max(40px, 0.6rem); border: 1px solid #e6e6e6; font-size: max(14px, 0.18rem); color: #333333; text-align: center; background-color: #fff; transition: all .3s ease; } @media (any-hover: hover) { .inner-s11 .bot-block .page a:hover { background-color: #0071bc; color: #fff; border-color: #0071bc; } } .inner-s12 { padding: 1.2rem 0; background-color: #f5f5f5; } .inner-s12 .item { margin-top: 0.2rem; } .inner-s12 .item:nth-of-type(1) { margin-top: 0; } .inner-s12 .item a { display: flex; align-items: center; background-color: #fff; padding: 0.3rem 0; position: relative; } .inner-s12 .item a:after { content: ''; width: 0.14rem; height: 0.24rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/statement/icon-1.svg"); position: absolute; right: 0.6rem; top: calc(50% - 0.12rem); pointer-events: none; } .inner-s12 .item .date { width: 1.8rem; border-right: 1px solid #e6e6e6; } .inner-s12 .item .date span { display: block; font-size: 0.48rem; color: #0071bc; font-weight: lighter; text-align: center; } .inner-s12 .item .date i { display: block; font-size: max(14px, 0.18rem); color: #0071bc; font-weight: lighter; font-style: normal; text-align: center; } .inner-s12 .item .tit { width: calc(100% - 1.8rem); padding: 0 1.2rem 0 0.6rem; font-size: max(18px, 0.24rem); color: #333333; line-height: 1.5; font-weight: lighter; transition: color .3s ease; } @media (any-hover: hover) { .inner-s12 .item:hover .tit { color: #0071bc; } } .inner-s13 { padding: 0.9rem 0; background-color: #f2f6fa; } .inner-s13 .top-block { display: flex; align-items: center; } .inner-s13 .top-block .img-box { width: 50%; aspect-ratio: 720 / 400; border-radius: 5px; overflow: hidden; } .inner-s13 .top-block img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s13 .top-block .txt-box { width: 50%; padding-left: 0.6rem; } .inner-s13 .top-block .tit { font-size: 0.4rem; color: #181818; font-weight: bold; } .inner-s13 .top-block .para { font-size: max(14px, 0.18rem); color: #181818; line-height: 1.5; margin-top: 0.15rem; } .inner-s13 .top-block .data-box { margin-top: 0.4rem; display: flex; flex-wrap: wrap; gap: 0.3rem 0; } .inner-s13 .top-block .data { width: 20%; padding-right: 5px; } .inner-s13 .top-block .data .num { display: flex; align-items: center; } .inner-s13 .top-block .data .num:before { content: ''; width: 0.18rem; height: 0.18rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/case/icon-1.svg"); } .inner-s13 .top-block .data .num span { font-size: max(16px, 0.26rem); color: #0069d8; font-weight: bold; padding-left: 5px; } .inner-s13 .top-block .data p { font-size: max(12px, 0.14rem); color: #333333; line-height: 1.8; margin-top: 0.15rem; } .inner-s13 .top-block .data.down .num:before { transform: rotateX(180deg); } .inner-s13 .bot-block { margin-top: 0.6rem; } .inner-s13 .bot-block .label { font-size: max(18px, 0.24rem); color: #141c3c; font-weight: bold; } .inner-s13 .bot-block .items { margin-top: 0.3rem; } .inner-s13 .bot-block .items .sw { display: flex; flex-wrap: wrap; gap: 0.15rem; } .inner-s13 .bot-block .item { width: calc((100% - 0.45rem) / 4); padding: 0.4rem 0.3rem; background-color: #fff; border-radius: 5px; } .inner-s13 .bot-block .item span { display: block; font-size: max(15px, 0.2rem); color: #808080; font-weight: bold; } .inner-s13 .bot-block .item .tit { font-size: max(16px, 0.2rem); color: #181818; margin-top: 0.15rem; } .inner-s13 .bot-block .item .para { margin-top: 0.15rem; font-size: max(13px, 0.16rem); color: #808080; line-height: 1.5; } .inner-s14 { padding: 0.9rem 0; overflow: hidden; } .inner-s14 .top-block .label { font-size: 0.4rem; color: #141c3c; font-weight: bold; text-align: center; } .inner-s14 .top-block p { font-size: max(14px, 0.18rem); color: #242f43; opacity: 0.5; margin-top: 0.1rem; text-align: center; } .inner-s14 .items { margin-top: 0.4rem; } .inner-s14 .swiper { margin: 0 calc(-50vw + 720px); padding: 0 calc(50vw - 720px); } .inner-s14 .item { width: calc((100% - 48px) / 3); height: auto; } .inner-s14 .item a { display: block; height: 100%; background-color: #f2f6fa; border-radius: 5px; overflow: hidden; } .inner-s14 .item .img-box { aspect-ratio: 464 / 261; border-radius: 5px; overflow: hidden; } .inner-s14 .item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s14 .item .txt-box { height: 1.3rem; display: flex; align-items: center; padding: 0 0.2rem; } .inner-s14 .item .tit { font-size: max(14px, 0.18rem); color: #181818; text-align: center; width: 100%; line-height: 1.5; transition: color .3s ease; } @media (any-hover: hover) { .inner-s14 .item:hover img { transform: scale(1.1); } .inner-s14 .item:hover .tit { color: #0071bc; } } .inner-s14 .pagination { margin-top: 0.6rem; display: flex; justify-content: center; } .inner-s14 .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s14 .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s14 .pagination span.active { background-color: #0071bc; } .inner-s15 { padding: 1.2rem 0 1.5rem; background: #fff url("../images/about/img-1.jpg") center bottom no-repeat; background-size: 100% auto; } .inner-s15 .top-block { display: flex; align-items: flex-start; } .inner-s15 .left-box { width: 37%; } .inner-s15 .left-box .tit { font-size: 0.44rem; color: #000000; } .inner-s15 .left-box .s-tit { font-size: max(16px, 0.22rem); color: #777777; line-height: 1.5; margin-top: 0.2rem; } .inner-s15 .right-box { width: 63%; } .inner-s15 .right-box .para { font-size: max(14px, 0.18rem); color: #555555; line-height: 1.5; } .inner-s15 .bot-block { margin-top: 2rem; display: flex; justify-content: space-between; } .inner-s15 .bot-block .data .num { position: relative; } .inner-s15 .bot-block .data .show { position: absolute; top: 0; left: 0; } .inner-s15 .bot-block .data .hide { opacity: 0; } .inner-s15 .bot-block .data span, .inner-s15 .bot-block .data i, .inner-s15 .bot-block .data em { color: #0071bc; font-weight: bold; } .inner-s15 .bot-block .data i, .inner-s15 .bot-block .data em { font-style: normal; } .inner-s15 .bot-block .data span { font-size: 0.56rem; } .inner-s15 .bot-block .data i { font-size: max(16px, 0.22rem); } .inner-s15 .bot-block .data em { font-size: max(12px, 0.14rem); } .inner-s15 .bot-block .data p { font-size: max(13px, 0.16rem); color: #0071bc; line-height: 1.5; } .inner-s16 { padding: 1.2rem 0; } .inner-s16 .label { font-size: 0.44rem; color: #000000; text-align: center; } .inner-s16 .items { margin-top: 0.5rem; border-radius: 3px; overflow: hidden; } .inner-s16 .sw { display: flex; } .inner-s16 .item { position: relative; width: calc((100% - 7.6rem) / 4); height: 5.6rem; overflow: hidden; transition: width .3s ease; } .inner-s16 .item .img-box { width: 7.7rem; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%); overflow: hidden; background-color: #0071bc; transition: all .3s ease; } .inner-s16 .item .img-box img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: 0.3; transition: opacity .3s ease; } .inner-s16 .item .show { width: 100%; position: absolute; left: 0; top: 0; padding: 2.4rem 0.2rem 0; z-index: 3; transition: opacity .3s ease; } .inner-s16 .item .show .icon { width: 0.42rem; height: 0.42rem; margin: 0 auto; display: flex; align-items: center; justify-content: center; } .inner-s16 .item .show .icon img { max-width: 100%; max-height: 100%; } .inner-s16 .item .show span { display: block; margin-top: 0.15rem; font-size: max(15px, 0.2rem); color: #fff; text-align: center; } .inner-s16 .item .hide { position: absolute; width: 7.6rem; height: 100%; top: 0; left: 0; padding: 0 0.6rem; display: flex; flex-direction: column; justify-content: center; opacity: 0; z-index: 4; transition: opacity .3s ease; } .inner-s16 .item .hide .tit { font-size: max(24px, 0.32rem); color: #fff; font-weight: bold; } .inner-s16 .item .hide .para { font-size: max(13px, 0.16rem); color: #fff; line-height: 2; font-weight: lighter; margin-top: 0.15rem; } .inner-s16 .item .hide .btns { margin-top: 0.3rem; display: flex; } .inner-s16 .item .hide .btns a { position: relative; width: max(100px, 1.2rem); height: max(32px, 0.42rem); border: 1px solid #fff; overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .inner-s16 .item .hide .btns a span { font-size: max(12px, 0.14rem); color: #fff; transition: color .3s ease; } @media (any-hover: hover) { .inner-s16 .item .hide .btns a:hover { transform: translateY(-3px); background-color: #fff; } .inner-s16 .item .hide .btns a:hover span { color: #0071bc; } } .inner-s16 .item.active { width: 7.6rem; } .inner-s16 .item.active .img-box { background-color: #000; } .inner-s16 .item.active .img-box img { opacity: 0.5; } .inner-s16 .item.active .show { opacity: 0; } .inner-s16 .item.active .hide { opacity: 1; } .inner-s17 { padding: 1.2rem 0; background-color: #f3f4f8; } .inner-s17 .label { font-size: 0.44rem; color: #000000; text-align: center; } .inner-s17 .cont-block { margin-top: 0.5rem; position: relative; } .inner-s17 .cont-block .map-box { width: 59.5138%; margin: 0 auto; position: relative; } .inner-s17 .cont-block .map-box img.bg { display: block; width: 100%; } .inner-s17 .cont-block .map-box img.m { display: none; } .inner-s17 .cont-block .map-box .dots { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .inner-s17 .cont-block .map-box .dot { position: absolute; width: 0; height: 0; cursor: pointer; } .inner-s17 .cont-block .map-box .dot .range { width: 0.2rem; height: 0.2rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; pointer-events: none; } .inner-s17 .cont-block .map-box .dot .range i { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 1px solid rgba(0, 113, 188, 0.2); border-radius: 50%; opacity: 0; animation: o-map-scale 2.1s linear infinite; } .inner-s17 .cont-block .map-box .dot .range i:nth-of-type(2) { animation-delay: .7s; } .inner-s17 .cont-block .map-box .dot .range i:nth-of-type(3) { animation-delay: 1.4s; } .inner-s17 .cont-block .map-box .dot:after { content: ''; width: 0.06rem; height: 0.06rem; border-radius: 50%; background-color: #0071bc; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; opacity: 0.6; transition: opacity .3s ease; } .inner-s17 .cont-block .map-box .dot span { font-size: max(8px, 0.1rem); color: #0071bc; position: absolute; font-weight: lighter; white-space: nowrap; z-index: 3; } .inner-s17 .cont-block .map-box .dot span.l { right: 0; top: 50%; padding-right: 0.05rem; transform: translateY(-50%); } .inner-s17 .cont-block .map-box .dot span.t { left: 0; bottom: 0; padding-bottom: 0.05rem; transform: translateX(-50%); } .inner-s17 .cont-block .map-box .dot span.b { left: 0; top: 0; padding-top: 0.05rem; transform: translateX(-50%); } .inner-s17 .cont-block .map-box .dot span.r { left: 0; top: 50%; padding-left: 0.05rem; transform: translateY(-50%); } .inner-s17 .cont-block .map-box .dot span.l-t { right: 0; bottom: 0; padding-right: 0.05rem; } .inner-s17 .cont-block .map-box .dot span.r-t { left: 0; bottom: 0; padding-left: 0.05rem; } .inner-s17 .cont-block .map-box .dot span.l-b { right: 0; top: 0; padding-right: 0.05rem; } .inner-s17 .cont-block .map-box .dot span.r-b { left: 0; top: 0; padding-left: 0.05rem; } .inner-s17 .cont-block .map-box .dot .hide { width: max(300px, 4.5rem); position: absolute; left: 50%; transform: translateX(-50%); bottom: 16px; z-index: 4; pointer-events: none; opacity: 0; transition: opacity .3s ease; } .inner-s17 .cont-block .map-box .dot .hide:after { content: ''; width: 17px; height: 7px; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/about/icon-2.png"); left: calc(50% - 9px); bottom: -6px; position: absolute; z-index: 2; } .inner-s17 .cont-block .map-box .dot .hide .box { border: 1px solid #0071bc; background-color: rgba(255, 255, 255, 0.9); padding: 0.24rem 0.3rem; border-radius: 5px; position: relative; z-index: 1; } .inner-s17 .cont-block .map-box .dot .hide .tit { font-size: max(16px, 0.22rem); color: #333333; } .inner-s17 .cont-block .map-box .dot .hide p { font-size: max(14px, 0.18rem); color: #333333; line-height: 1.5; margin-top: 0.1rem; } @media (any-hover: hover) { .inner-s17 .cont-block .map-box .dot:hover:after { opacity: 1; } .inner-s17 .cont-block .map-box .dot:hover span { font-weight: normal; } .inner-s17 .cont-block .map-box .dot:hover .hide { opacity: 1; } } .inner-s17 .cont-block .m-map-box { display: none; } .inner-s17 .cont-block .m-map-box .tab-tit { position: relative; } .inner-s17 .cont-block .m-map-box .tab-tit:after { content: ''; width: 100%; height: 1px; background-color: #e6e6e6; position: absolute; bottom: 0; left: 0; } .inner-s17 .cont-block .m-map-box .tab-tit .item { width: auto; position: relative; padding: 0 20px; } .inner-s17 .cont-block .m-map-box .tab-tit .item span { font-size: 14px; color: #333333; text-align: center; line-height: 50px; transition: color .3s ease; } .inner-s17 .cont-block .m-map-box .tab-tit .item:after { content: ''; width: 100%; height: 1px; position: absolute; bottom: 0; left: 0; background-color: #0071bc; opacity: 0; transition: all .3s ease; } .inner-s17 .cont-block .m-map-box .tab-tit .item.active span { color: #0071bc; } .inner-s17 .cont-block .m-map-box .tab-tit .item.active:after { opacity: 1; } .inner-s17 .cont-block .m-map-box .tab-cont { margin-top: 20px; } .inner-s17 .cont-block .m-map-box .tab-cont .child { position: relative; display: none; } .inner-s17 .cont-block .m-map-box .tab-cont .child.active { display: block; } .inner-s17 .cont-block .m-map-box .tab-cont .tit { font-size: 16px; color: #333333; } .inner-s17 .cont-block .m-map-box .tab-cont p { font-size: 14px; color: #808080; line-height: 1.34; margin-top: 10px; } .inner-s17 .cont-block .data-box { position: absolute; right: 0; top: 0; } .inner-s17 .cont-block .data-box .data { margin-top: 0.2rem; } .inner-s17 .cont-block .data-box .data:nth-of-type(1) { margin-top: 0; } .inner-s17 .cont-block .data-box .data .num { position: relative; } .inner-s17 .cont-block .data-box .data .show { position: absolute; top: 0; left: 0; } .inner-s17 .cont-block .data-box .data .hide { opacity: 0; } .inner-s17 .cont-block .data-box .data span, .inner-s17 .cont-block .data-box .data i { color: #0071bc; font-weight: bold; } .inner-s17 .cont-block .data-box .data i { font-style: normal; } .inner-s17 .cont-block .data-box .data span { font-size: 0.5rem; } .inner-s17 .cont-block .data-box .data i { font-size: 0.3rem; } .inner-s17 .cont-block .data-box .data p { font-size: max(13px, 0.16rem); color: #7a8799; line-height: 1.5; } .inner-s17 .cont-block .tips-box { margin-top: 0.3rem; display: flex; align-items: center; } .inner-s17 .cont-block .tips-box:before { content: ''; width: 0.1rem; height: 0.1rem; border-radius: 50%; background-color: #0071bc; } .inner-s17 .cont-block .tips-box span { font-size: max(13px, 0.16rem); color: #0071bc; margin-left: 0.1rem; } .inner-s18 { padding: 1.2rem 0 0; } .inner-s18 .tab-tit .sw { display: flex; justify-content: center; gap: 1.2rem; } .inner-s18 .tab-tit .item { position: relative; cursor: pointer; } .inner-s18 .tab-tit .item .icon { width: max(30px, 0.48rem); height: max(30px, 0.48rem); margin: 0 auto; position: relative; will-change: transform; } .inner-s18 .tab-tit .item .icon > div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: contain; transition: opacity .3s ease; } .inner-s18 .tab-tit .item .icon .hide { opacity: 0; } .inner-s18 .tab-tit .item span { display: block; font-size: max(14px, 0.18rem); color: #181818; text-align: center; margin-top: 0.15rem; transition: color .3s ease; } .inner-s18 .tab-tit .item.active .icon .show { opacity: 0; } .inner-s18 .tab-tit .item.active .icon .hide { opacity: 1; } .inner-s18 .tab-tit .item.active span { color: #0071bc; } @media (any-hover: hover) { .inner-s18 .tab-tit .item:hover .icon { transform: rotateY(360deg); transition: transform .6s ease; } .inner-s18 .tab-tit .item:hover .icon .show { opacity: 0; } .inner-s18 .tab-tit .item:hover .icon .hide { opacity: 1; } .inner-s18 .tab-tit .item:hover span { color: #0071bc; } } .inner-s18 .tab-cont { margin-top: 0.3rem; } .inner-s18 .tab-cont .child { display: none; } .inner-s18 .tab-cont .child.active { display: block; } .inner-s18 .tab-cont .child.active .tit, .inner-s18 .tab-cont .child.active .para { display: block; animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .inner-s18 .tab-cont .child.active .para { animation-delay: .1s; } .inner-s18 .tab-cont .block { position: relative; } .inner-s18 .tab-cont .img-box { border-radius: 0.1rem; overflow: hidden; aspect-ratio: 1440 / 568; } .inner-s18 .tab-cont .img-box img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s18 .tab-cont .txt-box { position: absolute; width: 50%; height: 100%; top: 0; left: 0; padding-left: 1rem; display: flex; flex-direction: column; justify-content: center; } .inner-s18 .tab-cont .tit { font-size: 0.4rem; color: #141c3c; font-weight: bold; display: none; opacity: 0; } .inner-s18 .tab-cont .para { font-size: max(15px, 0.2rem); color: #88898d; line-height: 1.5; margin-top: 0.15rem; display: none; opacity: 0; } .inner-s19 { padding: 1.2rem 0; } .inner-s19 .top-block .label { font-size: 0.4rem; color: #141c3c; font-weight: bold; text-align: center; } .inner-s19 .top-block p { font-size: max(14px, 0.18rem); color: #242f43; text-align: center; opacity: 0.5; margin-top: 0.1rem; } .inner-s19 .items { margin-top: 0.5rem; } .inner-s19 .sw { display: flex; gap: 0.1rem; } .inner-s19 .item { position: relative; width: calc((100% - 7.7rem) / 5); height: max(300px, 4rem); border-radius: 0.1rem; overflow: hidden; background-color: #d2e1f2; transition: width .3s ease; } .inner-s19 .item .img-box { width: 7.2rem; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%); overflow: hidden; background-color: #0053ac; opacity: 0; transition: opacity .3s ease; } .inner-s19 .item .img-box img { display: block; width: 100%; height: 100%; opacity: 0.8; object-fit: cover; } .inner-s19 .item .img-box:after { content: ''; width: 60%; height: 100%; position: absolute; top: 0; left: 0; background-image: linear-gradient(90deg, #0053ac, rgba(0, 0, 0, 0)); } .inner-s19 .item .show { width: 100%; position: absolute; left: 0; top: 0; padding: 1.7rem 0.1rem 0; z-index: 3; transition: opacity .3s ease; } .inner-s19 .item .show .icon { width: 0.36rem; height: 0.36rem; margin: 0 auto; display: flex; align-items: center; justify-content: center; } .inner-s19 .item .show .icon img { max-width: 100%; max-height: 100%; } .inner-s19 .item .show span { display: block; margin-top: 0.15rem; font-size: max(14px, 0.18rem); color: #0071bc; text-align: center; } .inner-s19 .item .hide { position: absolute; width: 7.2rem; height: 100%; top: 0; left: 0; padding: 0.4rem; display: flex; flex-direction: column; justify-content: flex-end; opacity: 0; z-index: 4; transition: opacity .3s ease; } .inner-s19 .item .hide .tit { font-size: max(24px, 0.3rem); color: #fff; font-weight: bold; } .inner-s19 .item .hide .para { font-size: max(14px, 0.18rem); color: #fff; line-height: 1.5; margin-top: 0.15rem; } .inner-s19 .item.active { width: 7.2rem; } .inner-s19 .item.active .img-box { opacity: 1; } .inner-s19 .item.active .show { opacity: 0; } .inner-s19 .item.active .hide { opacity: 1; } .inner-s20 { padding: 1.2rem 0; } .inner-s20.pt { padding: 1.2rem 0 0; } .inner-s20 .data-block { margin-bottom: 1.6rem; display: flex; justify-content: space-between; } .inner-s20 .data-block .data .num { position: relative; } .inner-s20 .data-block .data .show { position: absolute; top: 0; left: 0; } .inner-s20 .data-block .data .hide { opacity: 0; } .inner-s20 .data-block .data span, .inner-s20 .data-block .data i, .inner-s20 .data-block .data em { color: #0071bc; font-weight: bold; } .inner-s20 .data-block .data i, .inner-s20 .data-block .data em { font-style: normal; } .inner-s20 .data-block .data span { font-size: 0.56rem; } .inner-s20 .data-block .data i { font-size: max(16px, 0.22rem); } .inner-s20 .data-block .data em { font-size: max(12px, 0.14rem); } .inner-s20 .data-block .data p { font-size: max(13px, 0.16rem); color: #0071bc; line-height: 1.5; } .inner-s20 .item { margin-top: 1.2rem; display: flex; align-items: center; } .inner-s20 .item:nth-of-type(1) { margin-top: 0; } .inner-s20 .item:nth-of-type(even) .img-box { order: 2; } .inner-s20 .item .img-box { width: 50%; display: flex; justify-content: center; } .inner-s20 .item .img-box img { max-width: 100%; } .inner-s20 .item .txt-box { width: 50%; padding: 0 0.4rem; } .inner-s20 .item .tit { font-size: max(24px, 0.3rem); color: #141c3c; font-weight: bold; } .inner-s20 .item .stit { font-size: max(14px, 0.18rem); color: #333333; margin-top: 0.1rem; } .inner-s20 .item .para { font-size: max(14px, 0.18rem); color: #808080; line-height: 1.5; text-align: justify; margin-top: 0.15rem; } .inner-s20 .item .para strong { color: #333333; } .inner-s21 { padding: 0 0 1.2rem; background-color: #f2f6fa; position: relative; } .inner-s21:before { content: ''; width: 100%; height: 1.83rem; background-color: #fff; position: absolute; top: 0; left: 0; } .inner-s21 .sw { display: flex; } .inner-s21 .item { width: calc((100% - 0.4rem) / 5); margin-right: 0.1rem; border-radius: 0.15rem; background-color: #fff; overflow: hidden; } .inner-s21 .item:last-of-type { margin-right: 0; } .inner-s21 .item .img-box { height: 1.83rem; overflow: hidden; } .inner-s21 .item img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; } .inner-s21 .item .txt-box { padding: 0.4rem 0.2rem; } .inner-s21 .item .tit { font-size: max(16px, 0.22rem); color: #181818; text-align: center; } .inner-s21 .item .para { font-size: max(13px, 0.16rem); color: #808080; line-height: 1.5; text-align: center; margin-top: 0.15rem; } @media (any-hover: hover) { .inner-s21 .item:hover img { transform: scale(1.1); } } .inner-s22 { padding: 1.2rem 0; } .inner-s22.style-1 { background-color: #f2f6fa; } .inner-s22.style-2 { padding: 1.2rem 0 0; } .inner-s22 .top-block { display: flex; align-items: center; } .inner-s22 .top-block .img-box { width: 36.8%; aspect-ratio: 529 / 390; border-radius: 0.15rem; overflow: hidden; } .inner-s22 .top-block img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s22 .top-block .txt-box { width: 63.2%; padding-left: 1rem; } .inner-s22 .top-block .tit { font-size: 0.4rem; color: #141c3c; font-weight: bold; } .inner-s22 .top-block .para { font-size: max(15px, 0.2rem); color: #88898d; line-height: 1.5; margin-top: 0.15rem; } .inner-s22 .top-block .btns { margin-top: 0.3rem; display: flex; } .inner-s22 .top-block .btns a { position: relative; width: max(100px, 1.8rem); height: max(36px, 0.48rem); border: 1px solid rgba(0, 113, 188, 0.3); overflow: hidden; display: flex; align-items: center; justify-content: center; transition: all .3s ease; } .inner-s22 .top-block .btns a span { font-size: max(12px, 0.14rem); color: #0071bc; transition: color .3s ease; } @media (any-hover: hover) { .inner-s22 .top-block .btns a:hover { transform: translateY(-3px); background-color: #0071bc; } .inner-s22 .top-block .btns a:hover span { color: #fff; } } .inner-s22 .bot-block { margin-top: 1rem; } .inner-s22 .bot-block .sw { display: grid; grid-template-columns: repeat(2, calc((100% - 0.2rem) / 2)); grid-gap: 0.2rem; } .inner-s22 .bot-block .item { padding: 0.48rem 0.3rem; border-radius: 0.15rem; background-color: #f2f6fa; display: flex; } .inner-s22 .bot-block .item .icon { width: 1.7rem; height: 1.16rem; margin: 0 auto; display: flex; } .inner-s22 .bot-block .item .icon img { height: 100%; } .inner-s22 .bot-block .item .txt-box { width: calc(100% - 1.7rem); } .inner-s22 .bot-block .item .tit { font-size: max(18px, 0.24rem); color: #181818; margin-top: 0.2rem; } .inner-s22 .bot-block .item .para { font-size: max(14px, 0.18rem); color: #808080; line-height: 1.5; margin-top: 0.15rem; } @media (any-hover: hover) { .inner-s22 .bot-block .item:hover .icon { transform: rotateY(360deg); transition: transform .6s ease; } } .inner-s23 { padding-top: 1.2rem; } .inner-s23 .tab-wrap { margin-top: 0.4rem; background-color: #fff; border-radius: 0.15rem; overflow: hidden; display: flex; box-shadow: 0 0 0.2rem rgba(0, 0, 0, 0.05); } .inner-s23 .tab-tit { width: 2.2rem; height: 6rem; border-right: 1px solid #f4f5f6; } .inner-s23 .tab-tit .sw { height: 100%; } .inner-s23 .tab-tit .item { height: calc(100% / 6); position: relative; display: flex; align-items: center; padding-left: 0.6rem; cursor: pointer; } .inner-s23 .tab-tit .item:before { content: ''; width: 100%; height: 100%; background: url("../images/product/img-3.png") left center no-repeat; background-size: 100% 100%; position: absolute; top: 0; left: 0; z-index: 1; opacity: 0; transition: all .3s ease; } .inner-s23 .tab-tit .item span { font-size: max(14px, 0.18rem); color: #010101; position: relative; z-index: 2; transition: all .3s ease; } .inner-s23 .tab-tit .item.active:before { opacity: 1; } .inner-s23 .tab-tit .item.active span { color: #0071bc; font-weight: bold; } @media (any-hover: hover) { .inner-s23 .tab-tit .item:hover span { color: #0071bc; } } .inner-s23 .tab-cont { width: calc(100% - 2.2rem); } .inner-s23 .tab-cont .child { position: relative; display: none; } .inner-s23 .tab-cont .child.active { display: block; } .inner-s23 .tab-cont .child.active .tit, .inner-s23 .tab-cont .child.active .para, .inner-s23 .tab-cont .child.active .tips { animation: o-upfade-top 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards; } .inner-s23 .tab-cont .child.active .tit, .inner-s23 .tab-cont .child.active .para { display: block; } .inner-s23 .tab-cont .child.active .para { animation-delay: .1s; } .inner-s23 .tab-cont .child.active .tips { display: flex; animation-delay: 0.2s; } .inner-s23 .tab-cont .img-box { height: 6rem; overflow: hidden; position: relative; } .inner-s23 .tab-cont .img-box img { display: block; width: 100%; height: 100%; object-fit: cover; } .inner-s23 .tab-cont .img-box:after { content: ''; width: 80%; height: 100%; position: absolute; top: 0; left: 0; background-image: linear-gradient(90deg, #fff, 70%, rgba(255, 255, 255, 0)); z-index: 1; } .inner-s23 .tab-cont .txt-box { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0 0.8rem; display: flex; flex-direction: column; justify-content: center; z-index: 2; } .inner-s23 .tab-cont .tit { font-size: max(24px, 0.32rem); color: #010101; font-weight: bold; display: none; opacity: 0; } .inner-s23 .tab-cont .para { max-width: 5rem; font-size: max(13px, 0.17rem); color: #000000; margin-top: 0.15rem; line-height: 1.5; display: none; opacity: 0; } .inner-s23 .tab-cont .tips { margin-top: 0.4rem; flex-wrap: wrap; gap: 0.1rem; display: none; opacity: 0; } .inner-s23 .tab-cont .tips span { font-size: max(14px, 0.18rem); color: #000000; border-radius: 0.1rem; background-color: #fff; padding: 0 0.2rem; min-width: 1.2rem; text-align: center; line-height: 0.6rem; box-shadow: 0 0.1rem 0.3rem rgba(51, 112, 255, 0.1); } .inner-s24 { padding-top: 1.2rem; } .inner-s24 .img-box { margin-top: 0.5rem; } .inner-s24 .img-box img { display: block; width: 100%; } .inner-s25 { padding-top: 1.2rem; } .inner-s25 .items { margin-top: 0.4rem; } .inner-s25 .sw { display: grid; grid-template-columns: repeat(3, calc((100% - 0.4rem) / 3)); grid-gap: 0.2rem; } .inner-s25 .item { padding: 0.48rem 0.3rem; border-radius: 0.15rem; background-color: #fff; box-shadow: 0 0.1rem 0.3rem rgba(0, 0, 0, 0.02); } .inner-s25 .item .icon { width: 1.7rem; height: 1.16rem; margin: 0 auto; display: flex; } .inner-s25 .item .icon img { height: 100%; } .inner-s25 .item .tit { font-size: max(24px, 0.3rem); color: #181818; text-align: center; margin-top: 0.2rem; } .inner-s25 .item .para { font-size: max(14px, 0.18rem); color: #808080; line-height: 1.5; text-align: center; margin-top: 0.2rem; } @media (any-hover: hover) { .inner-s25 .item:hover .icon { transform: rotateY(360deg); transition: transform .6s ease; } } .inner-s26 { padding: 1.2rem 0; background-color: #f2f6fa; } .inner-s26 .items { margin-top: 0.4rem; } .inner-s26 .item { width: calc((100% - 0.4rem) / 3); height: auto; padding: 0.48rem 0.3rem; border-radius: 0.15rem; background-color: #fff; margin-right: 0.2rem; } .inner-s26 .item:last-of-type { margin-right: 0; } .inner-s26 .item .icon { width: 1.7rem; height: 1.16rem; margin: 0 auto; display: flex; } .inner-s26 .item .icon img { height: 100%; } .inner-s26 .item .tit { font-size: max(24px, 0.3rem); color: #181818; text-align: center; margin-top: 0.2rem; } .inner-s26 .item .para { font-size: max(14px, 0.18rem); color: #808080; line-height: 1.5; text-align: center; margin-top: 0.2rem; } @media (any-hover: hover) { .inner-s26 .item:hover .icon { transform: rotateY(360deg); transition: transform .6s ease; } } .inner-s26 .pagination { margin-top: 0.4rem; display: flex; justify-content: center; } .inner-s26 .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s26 .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s26 .pagination span.active { background-color: #0071bc; } .inner-s27 { padding: 1.2rem 0; background-color: #f2f6fa; } .inner-s27 .img-box { margin-top: 0.4rem; } .inner-s27 .img-box img { display: block; width: 100%; } .inner-s28 { padding-top: 1.2rem; } .inner-s28 .img-box img { display: block; width: 100%; } .other-s1 { padding: 1.2rem 0; margin-top: -0.8rem; } .other-s1 .item { padding: 0.6rem 0; border-bottom: 1px solid #e6e6e6; display: flex; align-items: flex-start; } .other-s1 .item i { width: 3.2rem; font-size: 0.36rem; color: #333333; font-style: normal; } .other-s1 .item i:after { content: ''; width: 0.24rem; height: 4px; background-color: #0071bc; display: block; margin-top: 0.2rem; } .other-s1 .item .link { width: calc(100% - 3.2rem); } .other-s1 .item .link, .other-s1 .item .s-link { display: flex; flex-wrap: wrap; grid-gap: 0.24rem; } .other-s1 .item .link a, .other-s1 .item .s-link a { position: relative; min-width: max(120px, 1.8rem); height: max(40px, 0.48rem); border: 1px solid #e6e6e6; display: flex; align-items: center; padding: 0 0.2rem; } .other-s1 .item .link a:before, .other-s1 .item .s-link a:before { content: ''; width: 100%; height: 100%; background-color: #0071bc; position: absolute; top: 0; left: 0; z-index: 1; opacity: 0; transition: opacity .3s ease; } .other-s1 .item .link a:after, .other-s1 .item .s-link a:after { content: ''; width: 0.09rem; height: 0.14rem; background-position: center; background-repeat: no-repeat; background-size: contain; background-image: url("../images/crumbs-2-1.svg"); position: absolute; right: 0.2rem; top: 50%; margin-top: -0.07rem; z-index: 2; transition: all .3s ease; } .other-s1 .item .link a span, .other-s1 .item .s-link a span { font-size: max(14px, 0.18rem); color: #333; position: relative; z-index: 2; padding-right: 0.4rem; transition: all .3s ease; } @media (any-hover: hover) { .other-s1 .item .link a:hover, .other-s1 .item .s-link a:hover { border-color: transparent; } .other-s1 .item .link a:hover:before, .other-s1 .item .s-link a:hover:before { opacity: 1; } .other-s1 .item .link a:hover:after, .other-s1 .item .s-link a:hover:after { background-image: url("../images/crumbs-2-2.svg"); } .other-s1 .item .link a:hover span, .other-s1 .item .s-link a:hover span { color: #fff; } } .other-s1 .item .box { width: 100%; margin-top: 0.3rem; } .other-s1 .item .box:nth-of-type(1) { margin-top: 0; } .other-s1 .item .box .stit { font-size: max(16px, 0.2rem); color: #181818; font-weight: bold; margin-bottom: 0.2rem; } .other-s1 .item:nth-of-type(1) { padding-top: 0; } .other-s2 { background-image: linear-gradient(180deg, #fff, #f8f8f8); } .other-s2 .flex { display: flex; } .other-s2 .left-box { width: 3.7rem; padding: 1.2rem 0.3rem 1.2rem 0; } .other-s2 .sticky { position: sticky; top: calc(1rem + 20px); } .other-s2 .position span { display: block; font-size: max(14px, 0.16rem); color: #333; border-radius: 5px; padding: 0.16rem 0.2rem; position: relative; cursor: pointer; transition: all .3s ease; } .other-s2 .position span.active { background-color: #eeeeee; } .other-s2 .right-box { width: calc(100% - 3.7rem); padding: 1.2rem 0; border-left: 1px solid #eeeeee; padding-left: 0.6rem; } .other-s2 .right-box .block { margin-top: 0.6rem; } .other-s2 .right-box .block:nth-of-type(1) { margin-top: 0; } .other-s2 .right-box .tit { font-size: 0.32rem; color: #333; padding-left: 0.3rem; position: relative; } .other-s2 .right-box .tit:before { content: ''; width: 4px; height: 100%; position: absolute; left: 0; top: 0; background-color: #0071bc; } .other-s2 .right-box .para { margin-top: 0.3rem; padding-top: 0.3rem; border-top: 1px solid #eeeeee; font-size: max(14px, 0.18rem); color: #333; line-height: 2; } .other-s2 .right-box .para span { display: block; color: #0071bc; } .other-s2 .right-box .para.nomt { margin-top: 0; padding-top: 0; border: none; } .other-s2 .right-box .para.mb { margin-bottom: 0.6rem; } .other-s2 .right-box .para.gray { color: #333; } .other-s2 .right-box.style .tit { padding-left: 0; } .other-s2 .right-box.style .tit:before { display: none; } .other-s2 .right-box.style .tit:after { content: ''; width: 1.2rem; height: 1px; position: absolute; bottom: calc(-0.3rem - 1px); left: 0; background-color: #0071bc; } .search-s1 { padding: 1.2rem 0; background-color: #f2f2f2; } .search-s1 .form { position: relative; width: 100%; max-width: 7.2rem; margin: 0 auto; background-color: #fff; height: 0.8rem; border-radius: 10px; overflow: hidden; } .search-s1 .form input { display: block; width: 100%; height: 100%; padding: 0 0.3rem; font-size: max(14px, 0.18rem); color: #3e4247; } .search-s1 .form button { position: absolute; right: 0; top: 0; width: 0.8rem; height: 0.8rem; background-position: center; background-repeat: no-repeat; background-image: url("../images/search-2.svg"); background-size: auto 0.24rem; background-color: transparent; cursor: pointer; } .search-s2 { padding: 1.2rem 0; background-image: linear-gradient(180deg, #fff, #f8f8f8); } .search-s2 .tips { text-align: center; font-size: 0.4rem; font-weight: 600; color: #353844; } .search-s2 .tips span { color: #0071bc; } .search-s2 .items { margin-top: 0.3rem; } .search-s2 .item { position: relative; } .search-s2 .item:before, .search-s2 .item:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 8px; } .search-s2 .item:before { background-color: #f2f2f2; } .search-s2 .item:after { background-color: #0071bc; transform: scaleX(0); transform-origin: left top; } .search-s2 .item a { position: relative; display: block; padding: 0.4rem 0; } .search-s2 .item .tit { font-size: max(14px, 0.18rem); color: #1a1a1a; } .search-s2 .item .tit b { display: inline-block; font-weight: normal; font-size: max(14px, 0.18rem); color: #0071bc; padding: 5px 10px; margin-right: 5px; border-radius: 3px; background-color: #eaf4f5; } .search-s2 .item .date { font-size: max(13px, 0.16rem); color: #808080; margin-top: 0.2rem; } .search-s2 .item .date:before { content: ''; width: max(12px, 0.18rem); height: max(12px, 0.18rem); background-position: center; background-repeat: no-repeat; background-image: url("../images/news/icon-2-1.svg"); background-size: auto 99%; display: inline-block; vertical-align: middle; margin: -2px 0.1rem 0 0; } @media (any-hover: hover) { .search-s2 .item:hover:after { transform: scaleX(1); transition: transform .5s linear; } } @media only screen and (max-width: 1900px) { html { font-size: 99px; } } @media only screen and (max-width: 1880px) { html { font-size: 98px; } } @media only screen and (max-width: 1860px) { html { font-size: 97px; } } @media only screen and (max-width: 1840px) { html { font-size: 96px; } } @media only screen and (max-width: 1820px) { html { font-size: 95px; } } @media only screen and (max-width: 1800px) { html { font-size: 94px; } } @media only screen and (max-width: 1780px) { html { font-size: 93px; } } @media only screen and (max-width: 1760px) { html { font-size: 92px; } } @media only screen and (max-width: 1740px) { html { font-size: 91px; } } @media only screen and (max-width: 1720px) { html { font-size: 90px; } } @media only screen and (max-width: 1700px) { html { font-size: 89px; } } @media only screen and (max-width: 1681px) { html { font-size: 88px; } } @media only screen and (max-width: 1660px) { html { font-size: 87px; } } @media only screen and (max-width: 1640px) { html { font-size: 86px; } } @media only screen and (max-width: 1620px) { html { font-size: 85px; } } @media only screen and (max-width: 1600px) { html { font-size: 84px; } } @media only screen and (max-width: 1580px) { html { font-size: 83px; } } @media only screen and (max-width: 1560px) { html { font-size: 82px; } } @media only screen and (max-width: 1540px) { html { font-size: 81px; } } @media only screen and (max-width: 1520px) { html { font-size: 80px; } } @media only screen and (max-width: 1500px) { html { font-size: 79px; } } @media only screen and (max-width: 1480px) { html { font-size: 78px; } } @media only screen and (max-width: 1460px) { html { font-size: 77px; } } @media only screen and (max-width: 1440px) { html { font-size: 76px; } } @media only screen and (max-width: 1420px) { html { font-size: 75px; } } @media only screen and (max-width: 1400px) { html { font-size: 74px; } } @media only screen and (max-width: 1380px) { html { font-size: 73px; } } @media only screen and (max-width: 1361px) { html { font-size: 72px; } } @media only screen and (max-width: 1340px) { html { font-size: 71px; } } @media only screen and (max-width: 1320px) { html { font-size: 70px; } } @media only screen and (max-width: 1300px) { html { font-size: 69px; } } @media only screen and (max-width: 1281px) { html { font-size: 68px; } } @media only screen and (max-width: 1260px) { html { font-size: 67px; } } @media only screen and (max-width: 1240px) { html { font-size: 66px; } } @media only screen and (max-width: 1220px) { html { font-size: 65px; } } @media only screen and (max-width: 1200px) { html { font-size: 64px; } } @media only screen and (max-width: 1180px) { html { font-size: 62px; } } @media only screen and (max-width: 1160px) { html { font-size: 61px; } } @media only screen and (max-width: 1140px) { html { font-size: 60px; } } @media screen and (max-width: 1681px) { .inner-s14 .swiper { margin: 0 -7vw; padding: 0 7vw; } .index-s1 .next { right: 0.3rem; } .index-s1 .prev { left: 0.3rem; } } @media screen and (max-width: 1200px) { .inner-s4 .item .source { display: none; } .index-s8 .tab-cont .item .source { display: none; } } @media screen and (max-width: 1025px) { .header { height: 60px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); } .header .flex { height: 100%; } .header .ope { margin-right: 40px; } .header ul { position: fixed; top: 0; left: 100%; width: 100%; height: 100%; background-color: #fff; display: block; padding: 70px 30px; text-align: left; z-index: 3; opacity: 1; pointer-events: auto; transition: left 0.6s cubic-bezier(0.19, 1, 0.22, 1); overflow: auto; } .header ul.active { left: 0; } .header li { margin: 0; position: relative; border-bottom: 1px solid #e6e6e6; } .header li a.single { position: relative; display: inline-block; line-height: 50px; color: #000; z-index: 2; } .header li a.single:after { display: none; } .header li i { width: 100%; height: 50px; position: absolute; right: 0; top: 0; background-position: center; background-repeat: no-repeat; background-position: calc(100% - 20px) center; background-image: url("../images/icon-1-1.svg"); background-size: auto 10px; z-index: 1; } .header li .subnav-1 { opacity: 1; visibility: visible; position: static; display: none; background: none; padding: 20px 0; } .header li .subnav-1 .wrap-s { width: 100%; } .header li .subnav-1 .left-box { display: none; } .header li .subnav-1 .right-box .link { margin-left: 20px; } .header li .subnav-1 .right-box .link a { font-size: 13px; color: #333; } .header .search-btn { width: 20px; height: 20px; margin-left: 0; } .header .mNavBtn { display: block; width: 20px; height: 16px; right: 7%; top: 22px; position: fixed; cursor: pointer; z-index: 4; } .header .mNavBtn span { position: absolute; left: 0; width: 20px; height: 2px; background-color: #000; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .header .mNavBtn span.line1 { top: 0; } .header .mNavBtn span.line2 { top: 7px; } .header .mNavBtn span.line3 { bottom: 0; } .header .mNavBtn.active .line2 { display: none; } .header .mNavBtn.active .line1 { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); top: 7px; } .header .mNavBtn.active .line3 { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); bottom: 7px; } .head-null { height: 60px; } .fixed-search .top-box .close { right: 4vw; } .footer .center-box { display: none; } .footer .bot-block { display: block; } .footer .bot-block .copyright { text-align: center; } .footer .bot-block .link { justify-content: center; margin-top: 10px; } .fixed-right { display: none; } .c-banner .img-box { height: 60vw; } .c-banner .txt-box { background-color: rgba(0, 0, 0, 0.3); } .c-crumbs { display: none; } .index-s1 .item .img-box { height: 60vw; } .index-s1 .button { display: none; } .index-s1 .pagination { bottom: 10px; } .index-s1 .item .txt-box { background-color: rgba(0, 0, 0, 0.5); align-items: center; } .index-s1 .item .box { width: 100%; background: none; backdrop-filter: none; padding: 0; height: auto; } .index-s2 .top-block .item { width: auto; padding: 0 15px 0.3rem; } .index-s4 .top-block { padding-top: 0; } .index-s4 .top-block .txt-box { width: 100%; } .index-s4 .top-block .img-box { position: static; width: 100%; } .index-s4 .bot-block { margin-top: 0.4rem; } .index-s4 .items { grid-template-columns: repeat(2, 1fr); } .index-s5 .s-img { display: none; } .index-s6 .left-box .btns { margin-top: 0.4rem; } .index-s8 .top-block { display: block; } .index-s8 .tab-tit { margin-top: 0.2rem; } .index-s8 .tab-cont .swiperbox .sw { display: flex; grid-gap: 0; } .index-s8 .tab-cont .item { width: calc((100% - 40px) / 3); margin-right: 20px; } .index-s8 .tab-cont .item:last-of-type { margin-right: 0; } .inner-s1 .cont-block { display: none; } .inner-s1 .m-items { display: block; } .inner-s2 .items { display: none; } .inner-s2 .m-items { display: block; } .inner-s3 .wrap-s { display: block; } .inner-s3 .left-block { width: 100%; } .inner-s3 .right-block { width: 100%; margin-top: 1.2rem; } .inner-s5 .item { width: auto; margin-right: 0; white-space: nowrap; } .inner-s10 .wrap-s { display: block; padding: 0; } .inner-s10 .left-block { width: 100%; display: none; } .inner-s10 .left-block .sticky { width: 100%; position: relative; top: auto; padding: 0; } .inner-s10 .right-block { width: 100%; } .inner-s10 .right-block .label { font-size: 20px; margin-bottom: 10px; } .inner-s13 .top-block { display: block; } .inner-s13 .top-block .img-box { width: 100%; } .inner-s13 .top-block .txt-box { width: 100%; padding: 0.4rem 0 0; } .inner-s13 .bot-block .item { width: calc((100% - 0.15rem) / 2); } .inner-s15 .top-block { display: block; } .inner-s15 .left-box { width: 100%; } .inner-s15 .right-box { width: 100%; margin-top: 0.4rem; } .inner-s15 .bot-block { margin-top: 30px; justify-content: flex-start; flex-wrap: wrap; gap: 20px 0; } .inner-s15 .bot-block .data { width: 33.33%; } .inner-s15 .bot-block .data span { font-size: 24px; } .inner-s15 .bot-block .data p { font-size: 12px; padding-right: 20px; } .inner-s15 .bot-block .data p br { display: none; } .inner-s16 .item { height: auto; transition: none; } .inner-s16 .item .img-box { position: static; width: 100%; height: auto; aspect-ratio: 1 / 1; transform: none; background-color: #000; } .inner-s16 .item .img-box img { opacity: 0.5; transition: none; } .inner-s16 .item .show { display: none; } .inner-s16 .item .hide { width: 100%; opacity: 1; transition: none; } .inner-s16 .pagination { margin-top: 20px; display: flex; justify-content: center; } .inner-s16 .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s16 .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s16 .pagination span.active { background-color: #0071bc; } .inner-s17 .cont-block .map-box { width: 100%; } .inner-s17 .cont-block .data-box { position: static; display: flex; justify-content: space-between; margin-top: 0.3rem; } .inner-s17 .cont-block .data-box .data { margin: 0; } .inner-s17 .cont-block .map-box img.bg { display: none; } .inner-s17 .cont-block .map-box img.m { display: block; width: 100%; } .inner-s17 .cont-block .map-box .dots { display: none; } .inner-s17 .cont-block .m-map-box { display: block; } .inner-s18 .tab-tit .sw { gap: 0; justify-content: space-between; } .inner-s18 .tab-tit .item { width: auto; margin-right: 20px; } .inner-s18 .tab-tit .item:last-of-type { margin-right: 0; } .inner-s18 .tab-cont .img-box { aspect-ratio: 4 / 3; } .inner-s18 .tab-cont .img-box img { object-position: center right; } .inner-s18 .tab-cont .txt-box { position: static; width: 100%; padding: 30px 0 0; } .inner-s19 .item { height: auto; transition: none; } .inner-s19 .item .img-box { position: static; width: 100%; height: auto; aspect-ratio: 1 / 1; opacity: 1; transform: none; background-color: #000; } .inner-s19 .item .img-box img { opacity: 0.5; transition: none; } .inner-s19 .item .img-box:after { display: none; } .inner-s19 .item .show { display: none; } .inner-s19 .item .hide { width: 100%; opacity: 1; transition: none; } .inner-s19 .pagination { display: flex; justify-content: center; } .inner-s19 .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s19 .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s19 .pagination span.active { background-color: #0071bc; } .inner-s20 .data-block { justify-content: flex-start; flex-wrap: wrap; gap: 20px 0; } .inner-s20 .data-block .data { width: 33.33%; } .inner-s20 .data-block .data span { font-size: 24px; } .inner-s20 .data-block .data p { font-size: 12px; padding-right: 20px; } .inner-s20 .data-block .data p br { display: none; } .inner-s21:before { height: 18vw; } .inner-s21 .item { width: calc((100% - 0.2rem) / 3); } .inner-s21 .item .img-box { height: 18vw; } .inner-s21 .pagination { margin-top: 20px; display: flex; justify-content: center; } .inner-s21 .pagination span { width: 0.12rem; height: 0.12rem; border-radius: 50%; background-color: #d4dfff; transition: all .3s ease; cursor: pointer; margin-left: 0.1rem; } .inner-s21 .pagination span:nth-of-type(1) { margin-left: 0; } .inner-s21 .pagination span.active { background-color: #0071bc; } .inner-s23 .tab-wrap { display: block; } .inner-s23 .tab-tit { width: 100%; height: auto; } .inner-s23 .tab-tit .item { width: auto; padding: 15px; } .inner-s23 .tab-cont { width: 100%; } .inner-s23 .tab-cont .img-box { height: auto; aspect-ratio: 1220 / 604; } .inner-s23 .tab-cont .txt-box { position: static; padding: 0.4rem; } .other-s1 { margin-top: 0; } .other-s2 .flex { display: block; } .other-s2 .left-box { display: none; } .other-s2 .right-box { width: 100%; padding-left: 0; border: none; } } @media screen and (max-width: 900px) { .index-s8 .tab-cont .item { width: calc((100% - 20px) / 2); } .inner-s4 .items { grid-template-columns: repeat(2, calc((100% - 0.24rem) / 2)); } .inner-s14 .item { width: calc((100% - 20px) / 2); } .inner-s25 .sw { grid-template-columns: repeat(2, calc((100% - 0.2rem) / 2)); } .inner-s26 .item { width: calc((100% - 0.2rem) / 2); } } @media screen and (max-width: 769px) { .c-filter-block { display: block; } .c-filter-block .data-box { width: 100%; } .c-filter-block .form-box { width: 100%; margin: 10px 0 0; } .inner-s7 .block .wrap-s { display: block; } .inner-s7 .block .img-box { width: 100%; } .inner-s7 .block .txt-box { width: 100%; padding: 20px 0 0 !important; } .inner-s20 .item { display: block; } .inner-s20 .item .img-box { width: 100%; } .inner-s20 .item .txt-box { width: 100%; padding: 10px 0 0; } .inner-s22 .top-block { display: block; } .inner-s22 .top-block .img-box { width: 100%; } .inner-s22 .top-block .txt-box { width: 100%; padding: 30px 0 0; } .inner-s22 .bot-block .sw { grid-template-columns: 100%; } .other-s1 .item { display: block; } .other-s1 .item i { display: block; width: 100%; } .other-s1 .item .link { width: 100%; margin-top: 10px; } } @media screen and (max-width: 640px) { .footer { overflow: hidden; } .footer .top-block { padding: 30px 0; } .footer .right-box .tit { display: none; } .footer .share { margin-top: 0; } .c-banner .tit { font-size: 20px; } .c-banner p { font-size: 14px; } .c-pd-label.mb { margin-bottom: 30px; } .c-pd-label .label { font-size: 20px; } .pd-main { padding-bottom: 50px; } .pd-main1 { padding-bottom: 50px; } .index-s1 .item .tit { font-size: 20px; } .index-s2 .top-block { padding-top: 30px; } .index-s2 .bot-block { padding-top: 30px; } .index-s2 .bot-block .flex { display: block; } .index-s2 .bot-block .img-box { width: 100%; } .index-s2 .bot-block .txt-box { width: 100%; padding: 20px 0 0; } .index-s2 .bot-block .tit { font-size: 20px; } .index-s3 { padding: 50px 0; } .index-s3 .item { width: calc((100% - 0.24rem) / 2); } .index-s3 .item:nth-of-type(3), .index-s3 .item:nth-of-type(4), .index-s3 .item:nth-of-type(5) { width: 100%; } .index-s3 .item:nth-of-type(3) .img-box, .index-s3 .item:nth-of-type(4) .img-box, .index-s3 .item:nth-of-type(5) .img-box { aspect-ratio: 708 / 320; } .index-s3 .item .txt-box { padding: 20px; } .index-s3 .item .tit { font-size: 16px; } .index-s4 { padding: 50px 0; } .index-s4 .top-block .label { font-size: 20px; } .index-s4 .item a { padding: 20px; } .index-s4 .item .icon { width: 30px; height: 30px; } .index-s4 .item .tit { font-size: 16px; } .index-s5:before { background-color: rgba(0, 0, 0, 0.5); } .index-s5 .cont-block { padding: 50px 0; } .index-s5 .label { font-size: 20px; } .index-s5 .tab-tit .sw { gap: 10px; } .index-s5 .tab-tit .item span { font-size: 12px; } .index-s5 .tab-cont { margin-top: 50px; } .index-s5 .tab-cont .tit { font-size: 16px; } .index-s5 .tab-cont .btns { margin-top: 20px; } .index-s6 { padding: 50px 0 0; } .index-s6 .left-box { width: 100%; } .index-s6 .left-box a { aspect-ratio: 16 / 9; } .index-s6 .left-box .txt-box { padding: 20px; background-color: rgba(0, 0, 0, 0.3); } .index-s6 .left-box .label { font-size: 20px; } .index-s6 .left-box .btns { margin-top: 20px; } .index-s6 .right-box { width: 100%; position: relative; margin-top: 20px; aspect-ratio: 16 / 9; } .index-s6 .right-box .txt-box { padding: 20px; } .index-s6 .right-box .label { font-size: 20px; } .index-s7 { padding: 50px 0 0; } .index-s7 .label { font-size: 20px; } .index-s7 .items { grid-template-columns: repeat(4, 1fr); } .index-s7 .item { height: 50px; } .index-s8 { padding: 50px 0; } .index-s8 .label { font-size: 20px; } .index-s8 .tab-tit .sw { gap: 10px; } .index-s8 .tab-tit .item span { font-size: 14px; } .index-s8 .tab-cont .item { width: 100%; } .index-s8 .tab-cont .item .txt-box { padding: 20px 20px 0; } .index-s8 .tab-cont .item .info-box { left: 20px; bottom: 20px; grid-gap: 15px; } .index-s8 .tab-cont .item .tit { font-size: 16px; } .inner-s1 { padding: 50px 0; } .inner-s1 .m-items .m-item .txt-box { padding: 20px 20px 0; } .inner-s1 .m-items .m-item .tit { font-size: 16px; } .inner-s1 .m-items .m-item .info-box { left: 20px; bottom: 20px; grid-gap: 15px; } .inner-s2 { padding: 50px 0; } .inner-s2 .m-items .m-item .txt-box { padding: 20px 20px 0; } .inner-s2 .m-items .m-item .tit { font-size: 16px; } .inner-s2 .m-items .m-item .info-box { left: 20px; bottom: 20px; grid-gap: 15px; } .inner-s3 { padding: 50px 0; } .c-label span { font-size: 20px; } .inner-s3 .left-block .item .txt-box { display: block; padding-left: 15px; } .inner-s3 .left-block .item .tit { padding: 0; width: 100%; } .inner-s3 .left-block .item .date { width: 100%; margin-top: 10px; } .inner-s3 .left-block .item a { align-items: flex-start; } .inner-s3 .left-block .item .tit { font-size: 16px; } .inner-s3 .right-block { margin-top: 50px; } .inner-s3 .right-block .item .tit { font-size: 16px; } .inner-s3 .right-block .item a { padding-left: 60px; } .inner-s3 .right-block .item .year { width: 60px; } .inner-s4 { padding: 50px 0; } .inner-s4.style-1 { padding: 50px 0; } .inner-s4 .items { grid-template-columns: 100%; grid-gap: 20px; } .inner-s4 .item .txt-box { padding: 20px 20px 0; } .inner-s4 .item .tit { font-size: 16px; } .inner-s4 .item .info-box { left: 20px; bottom: 20px; grid-gap: 15px; } .inner-s5 { padding: 20px 0; } .inner-s6 { padding: 50px 0; } .inner-s6 .items { grid-template-columns: 100%; grid-gap: 20px; } .inner-s6 .item .tips { font-size: 12px; } .inner-s6 .item .tit { font-size: 16px; } .inner-s7 .block { padding: 50px 0; } .inner-s7 .block .num { font-size: 30px; } .inner-s7 .block .tit { font-size: 20px; } .inner-s7 .block .para { font-size: 14px; } .inner-s8 { padding: 50px 0; } .inner-s8 .items { display: block; } .inner-s8 .item { width: 100%; margin-top: 30px; } .inner-s8 .item:nth-of-type(1) { margin-top: 0; } .inner-s8 .map-box { margin-top: 30px; aspect-ratio: 16 / 9; } .inner-s8 .map-box img { transform: scale(2); } .inner-s9 { padding: 50px 0; } .inner-s9 .items { grid-template-columns: auto; grid-gap: 20px; } .inner-s9 .item .tit { font-size: 16px; } .inner-s10 { padding: 50px 0; } .inner-s10 .right-block .item a { padding: 15px; display: block; } .inner-s10 .right-block .item .img-box { width: 100%; } .inner-s10 .right-block .item .txt-box { width: 100%; padding: 0; margin-top: 15px; } .inner-s10 .right-block .item .tit { font-size: 16px; } .inner-s11 { padding: 50px 0; } .inner-s11 .top-block .tit { font-size: 20px; } .inner-s11 .top-block .info-box { grid-gap: 20px; } .inner-s11 .bot-block { margin-top: 50px; } .inner-s11 .bot-block .page a { width: 100px; line-height: 30px; } .inner-s12 { padding: 50px 0; } .inner-s12 .item a { padding: 15px 0; } .inner-s12 .item .date { width: 70px; } .inner-s12 .item .date span { font-size: 20px; } .inner-s12 .item .date i { font-size: 12px; } .inner-s12 .item .tit { width: calc(100% - 70px); padding: 0 30px 0 15px; font-size: 16px; } .inner-s12 .item a:after { right: 15px; } .inner-s13 { padding: 50px 0; } .inner-s13 .top-block .tit { font-size: 20px; } .inner-s13 .top-block .data { width: 33.33%; } .inner-s13 .bot-block .item { width: 100%; padding: 15px; } .inner-s14 { padding: 50px 0; } .inner-s14 .item { width: 100%; } .inner-s14 .top-block .label { font-size: 20px; } .inner-s14 .item .tit { font-size: 16px; } .inner-s14 .pagination { margin-top: 20px; } .inner-s15 { padding: 50px 0; } .inner-s15 .left-box .tit { font-size: 20px; } .inner-s15 .right-box { margin-top: 15px; } .inner-s16 { padding: 50px 0; } .inner-s16 .label { font-size: 20px; } .inner-s16 .items { margin-top: 20px; } .inner-s16 .item .hide { padding: 0 20px; } .inner-s16 .item .hide .tit { font-size: 18px; } .inner-s17 { padding: 50px 0; } .inner-s17 .label { font-size: 20px; } .inner-s17 .cont-block .data-box .data span { font-size: 24px; } .inner-s17 .cont-block .data-box .data p { font-size: 12px; } .inner-s18 { padding: 50px 0 0; } .inner-s18 .tab-cont .txt-box { padding: 20px 0 0; } .inner-s18 .tab-cont .tit { font-size: 18px; } .inner-s18 .tab-cont .para { font-size: 14px; } .inner-s19 { padding: 50px 0; } .inner-s19 .top-block .label { font-size: 20px; } .inner-s19 .item .hide { padding: 20px; } .inner-s19 .item .hide .tit { font-size: 18px; } .inner-s20 { padding: 50px 0; } .inner-s20.pt { padding: 50px 0 0; } .inner-s20 .data-block { margin-bottom: 50px; } .inner-s20 .item { margin-top: 50px; } .inner-s20 .item .tit { font-size: 18px; } .inner-s21 { padding: 0 0 50px; } .inner-s21:before { height: 55vw; } .inner-s21 .item { width: 100%; } .inner-s21 .item .img-box { height: 55vw; } .inner-s21 .item .tit { font-size: 18px; } .inner-s22 { padding: 50px 0; } .inner-s22.style-2 { padding: 50px 0 0; } .inner-s22 .top-block .tit { font-size: 20px; } .inner-s22 .top-block .para { font-size: 14px; } .inner-s22 .bot-block { margin-top: 30px; } .inner-s22 .bot-block .item { padding: 20px; } .inner-s23 { padding-top: 50px; } .inner-s23 .tab-cont .txt-box { padding: 20px; } .inner-s23 .tab-cont .tit { font-size: 18px; } .inner-s24 { padding-top: 50px; } .inner-s25 { padding-top: 50px; } .inner-s25 .sw { grid-template-columns: 100%; } .inner-s25 .item { padding: 20px; } .inner-s25 .item .tit { font-size: 18px; } .inner-s26 { padding: 50px 0; } .inner-s26 .item { width: 100%; } .inner-s26 .item { padding: 20px; } .inner-s26 .item .tit { font-size: 18px; } .inner-s27 { padding: 50px 0; } .inner-s28 { padding-top: 50px; } .other-s1 { padding: 50px 0; } .other-s1 .item i { font-size: 20px; } .other-s1 .item .link a, .other-s1 .item .s-link a { width: calc(50% - 0.12rem); min-width: auto; } .other-s1 .item .link a span, .other-s1 .item .s-link a span { padding-right: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .other-s2 .right-box { padding: 50px 0; } .other-s2 .right-box .tit { font-size: 18px; } .search-s1 { padding: 50px 0; } .search-s2 { padding: 50px 0; } .search-s2 .tips { font-size: 20px; } .search-s2 .item:before, .search-s2 .item:after { height: 4px; } } /*# sourceMappingURL=bundle.css.map */