@font-face { font-family: "GOTHICB-Font"; src: url('../font/GOTHICB_0.ttf') format('truetype'); } @font-face { font-family: "FRIZON-Font"; src: url('../font/FRIZON-2.ttf') format('truetype'); } * { margin: 0px; padding: 0px; box-sizing: border-box; } * { -webkit-tap-highlight-color: rgba(0, 0, 0, 0) } body, button, input, select, textarea { font: 12px/1.5tahoma, arial, \5b8b\4f53; } h1, h2, h3, h4, h5, h6 { font-size: 100%; } address, cite, dfn, em, var { font-style: normal; } code, kbd, pre, samp { font-family: couriernew, courier, monospace; } small { font-size: 12px; } ul, ol { list-style: none; } a { text-decoration: none; } a:hover { text-decoration: none; } sup { vertical-align: text-top; } sub { vertical-align: text-bottom; } legend { color: #000; } fieldset, img { border: 0; } button, input, select, textarea { font-size: 100%; } table { border-collapse: collapse; border-spacing: 0; } html, body { font-family: "微软雅黑"; font-size: 14px; color: #3e3e3e; } /* 清除浮动,并且禁止margin重叠 */ .clearfix:after, .clearfix:before { content: ""; display: table; } .clearfix:after { clear: both; } /*让文字隐藏 */ .text-hide { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } /* 让文字不可换行,超越边界的文字显示为省略号 */ .text-nowrap { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } /* 将元素设置为block并且水平居中 */ .center-block { display: block; margin-right: auto; margin-left: auto; } /*文本居中*/ .text-center { text-align: center; } .text-muted { font-size: 18px; line-height: 36px; text-align: justify; } /*PC端显示与隐藏*/ .pc-show { display: block; } .pc-hide { display: none; } /*文本长度截取*/ .text-nowrap-ellipsis, .text-nowrap-ellipsis-2, .text-nowrap-ellipsis-3, .text-nowrap-ellipsis-4, .text-nowrap-ellipsis-5 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; } .text-nowrap-ellipsis { -webkit-line-clamp: 1; } .text-nowrap-ellipsis-2 { -webkit-line-clamp: 2; } .text-nowrap-ellipsis-3 { -webkit-line-clamp: 3; } .text-nowrap-ellipsis-4 { -webkit-line-clamp: 4; } .text-nowrap-ellipsis-5 { -webkit-line-clamp: 5; } /*flex布局*/ .flex { display: flex; } .basis-xs { flex-basis: 20%; } .basis-sm { flex-basis: 40%; } .basis-df { flex-basis: 50%; } .basis-lg { flex-basis: 60%; } .basis-xl { flex-basis: 80%; } .flex-sub { flex: 1; } .flex-twice { flex: 2; } .flex-treble { flex: 3; } .flex-direction { flex-direction: column; } .flex-wrap { flex-wrap: wrap; } .align-start { align-items: flex-start; } .align-end { align-items: flex-end; } .align-center { align-items: center; } .align-stretch { align-items: stretch; } .self-start { align-self: flex-start; } .self-center { align-self: flex-center; } .self-end { align-self: flex-end; } .self-stretch { align-self: stretch; } .align-stretch { align-items: stretch; } .justify-start { justify-content: flex-start; } .justify-end { justify-content: flex-end; } .justify-center { justify-content: center; } .justify-between { justify-content: space-between; } .justify-around { justify-content: space-around; } /*logo*/ .logo { width: 170px; position: relative; top: -25px; } .logo>img { position: absolute; width: 100%; -webkit-transition: all .35s; opacity: 0; top: 0px; } .logo>img:nth-child(1) { opacity: 1; /*position: relative;*/ } .logo>img:nth-child(2) { opacity: 0; } /*站点头部*/ .topInfo { z-index: 200; width: 100%; padding: 10px 2%; display: flex; /*position: fixed;*/ position: absolute; -webkit-transition: all .5s; font-size: 15px; } .topInfo.active { z-index: 510; } .topInfo a { /*display: inline-block;*/ color: #fff; /* display: flex; align-items: center; justify-content: center;*/ } .topInfo a .iconfont { font-size: 20px; } .topInfo a .icon-youjiantou { font-size: 15px; margin-left: 5px; } .topInfo a:nth-child(1) { margin-right: 20px; } .topInfo a .iconfont:nth-child(1) { margin-right: 3px; } .topInfo.active a { color: #333; } .topInfo.active a .iconfont { color: #0043b6; } .topInfo.close { display: none; } .mask { height: 130px; position: absolute; left: 0%; top: 0%; background: linear-gradient(180deg, rgba(4, 36, 94, 0.86) 0%, rgba(4, 34, 77, 0.54) 50%, rgba(3, 43, 103, 0) 100%); right: 0%; z-index: 2; } .header { position: fixed; display: flex; justify-content: space-between; padding: 20px 2%; width: 100%; z-index: 300; height: 60px; margin-top: 30px; align-items: center; -webkit-transition: all .5s; } .header::before { width: 100%; height: 0px; position: absolute; left: 0px; /*top: 0px;*/ top: -40px; background-color: #fff; content: ''; -webkit-transition: all 0.5s cubic-bezier(.23, 1, .32, 1); visibility: hidden; } .header.active::before { /*height: 540px;*/ height: 120px; visibility: visible; } .header.active .nav ul li a, .header.open .nav ul li a, .header.active .nav .search, .header.open .nav .search { color: #3e3e3e; } .header.open { background-color: #fff; box-shadow: 0px 0px 15px rgba(0, 0, 0, .1); /*padding: 10px 2%;*/ height: 80px; margin-top: 0px; } .header.active .logo>img:nth-child(1), .header.open .logo>img:nth-child(1) { opacity: 0; } .header.active .logo>img:nth-child(2), .header.open .logo>img:nth-child(2) { opacity: 1; } .header.active .nav ul li.active a, .header.active .nav ul li:hover a, .header.open .nav ul li.active a, .header.open .nav ul li:hover a { color: #0043b6; } .header.active .nav ul li::after { background: #0043b6; } /* 导航 */ .nav { width: auto; display: flex; justify-content: space-between; position: relative; align-items: center; /*padding-right: 30px;*/ } .nav ul { display: flex; justify-content: space-between; margin-right: 20px; } .nav ul li { width: auto; position: relative; } .nav ul li::after { width: 0%; height: 3px; position: absolute; left: 50%; bottom: -20px; border-radius: 50px; background: #fff; content: ''; -webkit-transition: all .35s; z-index: 510; } .nav ul li.active::after, .nav ul li:hover::after { width: 20%; left: 40%; } .header.open .nav ul li.active::after, .header.open .nav ul li:hover::after { background: #0067cc; } .nav ul li a { color: #fff; display: block; text-align: center; font-size: 18px; line-height: 40px; padding: 0px 33px; } /* 二级导航 */ /*.navBar { width: 1000px; height: auto; position: absolute; top: 90px; right: calc(0% + 80px); padding: 20px 0px; opacity: 0; visibility: hidden; }*/ .navBar { /*width: 100%;*/ height: auto; position: absolute; top: 100px; /* padding-top: 20px; */ /*opacity: 0;*/ visibility: hidden; /*right: calc(0% - 25px);*/ left: 0px; right: 0px; } .header.active .navBar { /*opacity: 1;*/ top: 80px; -webkit-transition: all .3s cubic-bezier(.23, 1, .32, 1) .2s; visibility: visible; left: 0px; background: #f5f5f5; } .navBar ul { display: flex; justify-content: center; width: 100%; } .navBar ul li { display: none; justify-content: center; width: 100%; position: relative; } /*.navBar ul li .subNav { width: 30%; text-align: center; margin-right: 3%; margin: 0px 20px; }*/ .navBar ul li.active { display: flex; width: 100%; } .navBar ul li .subNav .sn { width: 100%; height: auto; position: relative; line-height: 50px; display: flex; font-size: 16px; /*font-weight: bold;*/ /*border-bottom: 1px solid rgba(0, 0, 0, .05);*/ margin: 15px 0px; color: #666; padding: 0px 20px; } .navBar ul li .subNav .sn:hover, .navBar ul li .list a:hover { color: #0043b6; } /*.navBar ul li .list a:hover .icon { background-color: #20a03f; color: #fff; border: 1px solid #20a03f; }*/ .navBar ul li .list { width: 100%; display: flex; flex-wrap: wrap; } .navBar ul li .list a { display: flex; width: 100%; align-items: center; margin-bottom: 15px; } .navBar ul li .list a:last-child { margin-bottom: 0px; } .navBar ul li .list a .icon { width: 48px; height: 48px; line-height: 46px; border: 1px solid rgba(0, 0, 0, .05); border-radius: 50%; content: ''; text-align: center; font-size: 28px; } .navBar ul li .list a .txt { margin-left: 15px; font-size: 16px; } .navBar ul li .list { width: 100%; display: flex; flex-wrap: wrap; } .navBar ul li .list a { display: flex; width: 100%; align-items: center; margin-bottom: 15px; } .navBar ul li .list a:last-child { margin-bottom: 0px; } .navBar ul li .list a .icon { width: 48px; height: 48px; line-height: 46px; border: 1px solid rgba(0, 0, 0, .05); border-radius: 50%; content: ''; text-align: center; font-size: 28px; } .navBar ul li .list a .txt { margin-left: 15px; font-size: 16px; } /*二级导航 解决方案子菜单*/ .navBar .productMenu { display: flex; width: 100%; } .navBar .productMenu .menuTabs { display: flex; flex-direction: column; flex: 1; } .navBar .productMenu .menuTabs a { line-height: 100px; background: #f6f6f6; font-size: 18px; color: #333; display: flex; align-items: center; justify-content: center; margin-top: 10px; flex: 1; } .navBar .productMenu .menuTabs a:nth-child(1) { margin-top: 0px; } .navBar .productMenu .menuTabs a .iconfont { font-size: 45px; margin-right: 10px; color: #999; } .navBar .productMenu .menuTabs a .icon-peixun { font-size: 35px; } .navBar .productMenu .menuTabs a:hover, .navBar .productMenu .menuTabs a.active { background: #e5f0fa; } .navBar .productMenu .menuTabs a:hover .iconfont, .navBar .productMenu .menuTabs a.active .iconfont { background-image: -webkit-linear-gradient(90deg, #0b70cf, #0043b6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .navBar .productMenu .menuTabs-container { flex: 5; overflow: hidden; padding: 20px; } .menuTabs-container .swiper-slide .menu-item { margin: 0px 20px; display: flex; flex-direction: column; flex: 1; } .menuTabs-container .swiper-slide .menu-item .menu-list { /*display: flex;*/ /*flex-direction: column;*/ max-height: 270px; overflow-y: auto; } .menuTabs-container .swiper-slide .menu-item .menu-list::-webkit-scrollbar { width: 6px; } .menuTabs-container .swiper-slide .menu-item .menu-list::-webkit-scrollbar-track { background-color: #fff; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } .menuTabs-container .swiper-slide .menu-item .menu-list::-webkit-scrollbar-thumb { background-color: #ebebeb; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; } .menuTabs-container .swiper-slide .menu-item .menu-title { font-weight: bold; color: #000; font-size: 16px; margin-bottom: 20px; } .menuTabs-container .swiper-slide .menu-item .menu-list a { font-size: 15px; color: #333; margin: 15px 0px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .menuTabs-container .swiper-slide .menu-item .menu-list a:hover { color: #0043b6; } /*股票代码*/ .nav .gpdm { position: relative; width: 160px; text-align: center; height: auto; line-height: 35px; /*background: #103784;*/ background: linear-gradient(90deg, #0b70cf, #0043b6) center center no-repeat; color: #fff; border-radius: 45px; } /*电话*/ .hotTel { width: 35px; height: 35px; position: relative; margin-left: 15px; color: #fff; text-align: center; line-height: 35px; border-radius: 50px; cursor: pointer; -webkit-transition: all .35s; background: linear-gradient(90deg, #0b70cf, #0043b6) center center no-repeat; } .hotTel .icon { width: 35px; height: 35px; position: absolute; right: 0%; border-radius: 50%; z-index: 5; } .hotTel .icon .iconfont { font-size: 20px; } .hotTel .txt { width: 0px; height: 35px; position: absolute; right: 10px; top: 0px; border-radius: 35px 0px 0px 35px; -webkit-transition: all .35s; overflow: hidden; } .hotTel .txt span { display: block; position: absolute; width: 140px; left: 0px; top: 0px; opacity: 0; -webkit-transition: all .8s; } /*搜索*/ .nav .search { width: 35px; height: 35px; position: relative; margin-left: 15px; color: #fff; text-align: center; line-height: 35px; border-radius: 50px; cursor: pointer; -webkit-transition: all .35s; /*background: linear-gradient( 90deg, #0b70cf, #0043b6) center center no-repeat;*/ } .nav .search .iconfont { font-size: 26px; } /*首页全屏滚动*/ .swiperFullPage { height: 100vh; } .swiperFullPage>.swiper-wrapper>.swiper-slide { display: block; height: 100vh; /*background: center center no-repeat;*/ background-size: contain; overflow: hidden; } .swiper-container.swiperFullPage .swiper-slide.auto { height: auto; } /*.swiper-container.swiperFullPage .swiper-wrapper .footer { height: 200px; }*/ /*分页器样式*/ .swiperFullPage>.swiper-pagination { width: 25px; height: auto; position: absolute; right: 30px; top: auto; left: auto; top: 50%; -webkit-transform: translateY(-50%); } .swiperFullPage>.swiper-pagination .swiper-pagination-bullet { width: 25px; height: 25px; opacity: 1; background: none; margin: 5px 0px; position: relative; cursor: pointer; display: block; text-indent: 100px; overflow: hidden; } .swiperFullPage>.swiper-pagination .swiper-pagination-bullet::before { content: ""; width: 10px; height: 10px; background: #fff; position: absolute; top: 50%; left: 50%; margin-top: -5px; margin-left: -5px; border-radius: 50%; transition: all .5s; } .swiperFullPage>.swiper-pagination .swiper-pagination-bullet::after { content: ""; background-size: cover; position: absolute; transition: all .3s; top: 50%; left: 50%; width: 0; height: 0; } .swiperFullPage>.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { border: 1px solid #fff; } .swiperFullPage>.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::before { transform: scale(.4); opacity: 1; } .swiperFullPage>.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after { width: 25px; height: 25px; left: 0; top: 0; animation: rotate0 2s ease infinite; } .fade-up { opacity: 0; -webkit-transition: all 1s; -webkit-transform: translateY(25px); } .saceIn { opacity: 0; -webkit-transition: all 1s; -webkit-transform: scale(2); } .delay-1 { -webkit-transition-delay: .2s; } .delay-2 { -webkit-transition-delay: .4s; } .delay-3 { -webkit-transition-delay: .6s; } .delay-4 { -webkit-transition-delay: .8s; } .delay-5 { -webkit-transition-delay: 1s; } .delay-6 { -webkit-transition-delay: 1.2s; } .delay-7 { -webkit-transition-delay: 1.4s; } .delay-8 { -webkit-transition-delay: .1.6s; } .swiper-slide-active .fade-up { opacity: 1; -webkit-transform: translateY(0px); } .swiper-slide-active .saceIn { opacity: 1; -webkit-transform: scale(1); } /* 移动端导航按钮 */ .mNav-toggle-btn { position: fixed; width: 60px; height: 60px; top: 0px; right: 0%; z-index: 50; background: linear-gradient(90deg, #0b70cf, #0043b6) center center no-repeat; } .mNav-toggle-btn span { top: 29px; left: 20px; width: 20px; } .mNav-toggle-btn span, .mNav-toggle-btn span:after, .mNav-toggle-btn span:before { position: absolute; height: 2px; background-color: #fff; border-radius: 1px; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .mNav-toggle-btn span:after, .mNav-toggle-btn span:before { content: ""; left: 0; -webkit-transform: translateY(0px) rotate(0deg); } .mNav-toggle-btn span:before { top: -6px; width: 14px; } .mNav-toggle-btn span:after { top: 6px; width: 14px; } .mNav-toggle-btn.active span { background-color: transparent; } .mNav-toggle-btn.active span:before { -webkit-transform: translateY(6px) rotate(-45deg); } .mNav-toggle-btn.active span:after { -webkit-transform: translateY(-6px) rotate(45deg); } .mNav-toggle-btn.active span:after, .mNav-toggle-btn.active span:before { width: 20px; } .mNav-toggle-btn { display: none } .mNav { display: none; } /*搜索*/ .searchBox { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 600; background: rgba(0, 0, 0, .8); display: none; } .searchBox.active { display: block; } .searchBox .searchInput { width: 600px; margin: 0 auto; height: 50px; line-height: 50px; position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -300px; } .searchBox .searchInput .int1 { width: 540px; height: 50px; line-height: 50px; background: none; border: none; border-bottom: 1px solid #fff; font-size: 18px; color: #fff; padding: 0 10px; padding-right: 60px; } .searchBox .searchInput .int2 { width: 50px; height: 50px; border: none; background: no-repeat center; background-image: url(../images/searchIcon.svg); background-size: 70%; background-position: center; position: absolute; top: 0; right: 60px; cursor: pointer; } .searchBox .searchClose { width: 50px; height: 50px; background: url(../images/arrow-close.svg) no-repeat; background-size: 70%; background-position: center; position: absolute; top: 0; right: 0; cursor: pointer; } .slide-inner { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center center; } .my-inner { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-size: cover; background-position: center center; } /* 通用宽度 */ .w1400 { width: 90%; max-width: 1400px; margin: 0px auto; position: relative; } .w1550 { width: 90%; max-width: 1550px; margin: 0px auto; position: relative; } .w100Vw { width: 100%; margin: 0px auto; position: relative; } .slideBox .w1400, .slideBox .w1550, .slideBox .w100Vw { position: absolute; top: 53%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); } .channelTitle2 { display: flex; align-items: center; justify-content: space-between; } .channelTitle2 .title { font-size: 16px; color: #999; } .channelTitle2 .title h1 { font-size: 40px; color: #fff; margin-bottom: 15px; } .channelTitle2 .title h1 em { font-style: normal; color: #1666E7; } .channelTitle2 .title p .iconfont { margin-left: 100px; font-size: 30px; color: #fff; } .channelTitle2 .more { font-size: 16px; color: #fff; display: flex; align-items: center; } .channelTitle2 .more span { width: 34px; height: 34px; color: #fff; background: #1666E7; border-radius: 50%; display: flex; justify-content: center; align-items: center; margin-left: 15px; } .sub-banner { width: 100%; height: 54vh; overflow: hidden; position: relative; } .sub-banner img { position: relative; } .sub-banner .mask { position: absolute; left: 0%; top: 0%; background: linear-gradient(180deg, rgba(4, 36, 94, 0.86) 0%, rgba(4, 34, 77, 0.54) 50%, rgba(3, 43, 103, 0) 100%); bottom: 50%; right: 0%; z-index: 1; } .sub-banner .img { width: 100vw; height: 100%; position: absolute; left: 0%; top: 0%; background: center center no-repeat; background-size: cover; /*opacity: .7;*/ /*-webkit-animation: subs 6s linear 1;*/ -webkit-animation-fill-mode: forwards; /*-webkit-transform: translateX(-5%);*/ } /*@-webkit-keyframes subs { 0% { -webkit-transform: translateX(-5%) } 100% { -webkit-transform: translateX(0) } }*/ .sub-banner .channel-title { width: auto; position: absolute; left: 13%; top: 50%; -webkit-transform: translateY(-50%); color: #fff; z-index: 2; width: 300px; height: 80px; background: linear-gradient(93deg, rgba(0, 105, 205, .7) 0%, rgba(0, 72, 196, .7) 100%); border-radius: 12px; display: flex; align-items: center; justify-content: center; } .sub-banner .channel-title span { font-size: 32px; position: relative; } .sub-banner .channel-title span:after, .sub-banner .channel-title span:before { position: absolute; content: ''; width: 10px; height: 10px; background: #fff; border-radius: 50%; top: 50%; -webkit-transform: translateY(-50%); } .sub-banner .channel-title span:after { right: -25px; } .sub-banner .channel-title span:before { left: -25px; } .sub-banner .sub-channel { width: auto; position: absolute; left: 13%; top: 77%; -webkit-transform: translateY(-77%); color: #fff; z-index: 2; display: flex; align-items: center; } .sub-banner .sub-channel a { width: 165px; height: 50px; border-radius: 6px; color: #fff; border: 1px solid rgba(255, 255, 255, .5); display: flex; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, .15); font-size: 16px; margin-right: 15px; } .sub-banner .sub-channel a:last-child { margin-right: 0px; } .sub-banner .sub-channel a:hover,.sub-banner .sub-channel a.active { background-color: #1252D4; border: 1px solid #1252D4; } .bread-crumb { height: 70px; background: #F6F6F6; } .bread-crumb .w1400 { display: flex; justify-content: space-between; align-items: center; } .crumb-list { line-height: 70px; color: #1252D4; } .crumb-list a { padding: 0px 5px; color: #666; } .crumb-list .iconfont { color: #999; } .crumb-list a:last-child { color: #1252D4; } .sub-menu a { padding: 0px 20px; position: relative; color: #333; font-size: 16px; } .sub-menu a:after { width: 0%; height: 3px; position: absolute; left: 50%; bottom: -25px; border-radius: 50px; background: #1252D4; content: ''; -webkit-transition: all .35s; } .sub-menu a:hover, .sub-menu a.active { color: #1252D4; } .sub-menu a:hover::after, .sub-menu a.active::after { width: 20%; left: 40%; } /*底部页脚*/ .footer { background: #0C2575; clear: both; padding: 20px 0px; } .footer .footer-top, .footer .footer-body { border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding-bottom: 30px; margin-bottom: 30px; r } .footer .footer-top .w1400, .footer .footer-body .w1400 { display: flex; align-items: center; justify-content: space-between; } .footer .footer-top .logo-img img { width: 200px; height: 55px; } .footer .footer-top .logo-img p { background: rgba(255, 255, 255, .2); color: #fff; padding: 2px 5px; width: 150px; transform: skewX(-20deg); -moz-transform: skewX(-20deg); -webkit-transform: skewX(-20deg); margin: 0px auto; } .footer .footer-top .logo-img p span { display: flex; transform: skewX(20deg); -moz-transform: skewX(20deg); -webkit-transform: skewX(20deg); justify-content: center; } .footer .footer-top .siteLink a { color: rgba(255, 255, 255, 1); border: 1px solid rgba(255, 255, 255, .3); padding: 5px 10px; margin-left: 20px; } .footer .footer-body .w1400 { color: rgba(255, 255, 255, .4); } .footer .footer-body .left { flex: 3; } .footer .footer-body .right { flex: 1; } .footer .footer-body .site-channel { margin: 40px 0px; } .footer .footer-body .site-channel a { font-size: 16px; font-weight: bold; color: #fff; padding-right: 40px; } .footer .footer-body .site-info span { display: block; float: left; margin-bottom: 10px; } .footer .footer-body .site-info span:nth-child(1), .footer .footer-body .site-info span:nth-child(3) { width: 30%; } .footer .footer-body .site-info span:nth-child(2), .footer .footer-body .site-info span:nth-child(4) { width: 60%; } /*.footer .footer-body .site-info p{ margin: 15px 0px; }*/ .footer .footer-body .right p { margin-top: 10px; } .footer .footer-bottom, .footer .footer-bottom a { font-size: 14px; color: rgba(255, 255, 255, .4); } .body-box .title { font-size: 38px; color: #333; display: flex; justify-content: center; padding: 90px 0px 60px 0px; } .body-box .title span { color: #1252d4; position: relative; } .body-box .title span:after { position: absolute; content: ''; width: 10px; height: 10px; border-radius: 50%; border: 3px solid #1252d4; right: -25px; top: 5px; } /*翻页样式*/ /*.Pages { margin: 20px 0px; } .Pages .p_page, .Pages .num { display: flex; align-items: center; justify-content: center; } .Pages a { height: 45px; border: 1px solid #E5E5E5; align-items: center; justify-content: center; display: flex; margin: 0px 5px; padding: 5px; color: #333; } .Pages .num a { width: 45px; } .Pages .num a.a_cur { background: #1252D4; color: #fff; }*/ .page_wrap { clear: both; margin: 20px 0px; overflow: hidden; zoom: 1; display: flex; justify-content: center; align-items: center; } .paginator { height: 45px; line-height: 45px; overflow: hidden; display: flex; justify-content: center; align-items: center; } .paginator a, .paginator span { float: left; height: 45px; margin: 0 5px 0 0; text-align: center; white-space: nowrap; vertical-align: middle; line-height: 45px; background: #fff; min-width: 45px; } .paginator a { color: #333; } .paginator b { font-family: "宋体"; margin: 3px; font-weight: 300; } .paginator a:link, .paginator a:visited, .paginator a:hover, .paginator a:active { text-decoration: none; } .paginator .page-start, .paginator a, .paginator .page-end { padding: 0 8px; border: 1px solid #e5e5e5; background: #ffffff; } .paginator .page-start { border-color: #d9d9d9; color: #d9d9d9; } .paginator .page-end { border-color: #d9d9d9; color: #d9d9d9; } .paginator .page-this, .paginator .page-break { padding: 0 3px; } .paginator .page-break { border: 1px solid #fff; } .paginator .page-this { border: 1px solid #1252D4; background-color: #1252D4; color: #fff; font-weight: bold; } .paginator .page-skip { height: 22px; line-height: 22px; padding: 0 3px; margin: 0; background: none; } .paginator .page-skip input { width: 26px; *width: 23px; height: 19px; line-height: 19px; border: 1px #D3D3D3 solid; font-size: 12px; margin: -1px 6px 0px 6px; #margin-top: 1px; _margin-top: 0px; padding: 0px 0px 0px 2px; vertical-align: middle; padding-top: 0px; padding-bottom: 0px; } .paginator .page-skip button { font-size: 12px; padding: 0 5px 5px 5px; _padding: 0 5px 0 5px; width: auto; _width: 0; height: 22px; *height: 23px; *line-height: 20px; _height: 16px; _line-height: 16px; margin-left: 10px; *margin-top: -1px; overflow: visible; vertical-align: top; } .paginator a:hover { border: 1px solid #1252D4; background-color: #1252D4; color: #fff; } .detail-box { margin: 50px auto; } .detail-box .detail-title { font-size: 28px; line-height: 38px; font-weight: bold; text-align: center; } .detail-box .detail-title .detail-date { font-size: 14px; color: #999; font-weight: normal; margin-top: 10px; } .detail-box .detail-conter p{ margin-top: 20px; line-height: 32px; font-size: 16px; } .detail-box .detail-conter img, .detail-box .detail-conter video{ max-width: 100%; margin: 20px auto; display: block; } .detail-box .detail-conter table { margin: 20px auto; } .detail-box .detail-pageItem { display: flex; align-items: center; justify-content: space-between; margin-top: 50px; } .detail-box .detail-pageItem .left { display: flex; flex-direction: column; line-height: 32px; flex: 1; margin-right: 30px; } .detail-box .detail-pageItem .left a { color: #333; font-size: 16px; } .detail-box .detail-pageItem .right a{ color: #333; border: 1px solid #e1e1e1; display: flex; align-items: center; justify-content: center; width: 150px; height: 50px; } .detail-box .detail-pageItem .right a:hover { background: #1252D4; color: #fff; } .video-js { margin: 0px auto; } .contest { position: relative; } .contest .contest-list { position: absolute; visibility: hidden; top: 30px; opacity: 0; /*-webkit-transition: all .3s cubic-bezier(.23, 1, .32, 1) .1s;*/ } .contest .contest-list ul { background: rgba(255, 255, 255, 1); padding: 5px; width: 200px; border-radius: 5px; margin-top: 12px; } .contest .contest-list li { line-height: 32px; border-bottom: 1px solid #ededed; } .contest .contest-list li:last-child { border-bottom: 0px; } .contest .contest-list li a { color: #333; margin-right: 0px; justify-content: flex-start; } .contest:hover .contest-list{ top: 20px; visibility: visible; -webkit-transition: all .4s cubic-bezier(.23, 1, .32, 1) .2s; opacity: 1; } .contest .icon-youjiantou{ -webkit-transition: all .5s; } .contest:hover>a .icon-youjiantou{ -ms-transform:rotate(90deg); /* IE 9 */ -webkit-transform:rotate(90deg); /* Safari and Chrome */ transform:rotate(90deg); } .alert { padding: 20px; font-size: 16px; border-radius: 6px; border: 1px solid #ddd; margin: 30px auto; background: #eee; text-align: center; } .alert-danger { border: 1px solid #f5c2c7; background: #f8d7da; color: #842029; } /*发展历程*/ .progress { margin-top: 50px; padding-top: 50PX; } .progress:before { position: absolute; content: ''; width: 100%; height: 1px; background-color: #fff; top: 108px; } .progress .swiper-slide { display: flex; justify-content: center; flex-direction: column; align-items: center; } .progress .swiper-slide .dot { width: 20px; height: 20px; background: #fff; border-radius: 50%; /*-webkit-animation-name: scaleDraw2;*/ /*关键帧名称*/ /*-webkit-animation-timing-function: ease-in;*/ /*动画的速度曲线*/ /*-webkit-animation-iteration-count: 1;*/ /*动画播放的次数*/ /*-webkit-animation-duration: 0.3s;*/ /*动画所花费的时间*/ } .progress .swiper-slide .year { font-size: 32px; font-family: GOTHICB-Font; color: #fff; margin-bottom: 10px; } .progress .swiper-slide .info { color: #fff; line-height: 32px; font-size: 16px; text-align: justify; -webkit-transition: all .35s .5s; display: none; margin-top: 20px; text-align: center; height: 138px; } .progress .swiper-slide .info p { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .progress .swiper-slide .info a.moreTxt { display: block; text-align: center; color: #fff; margin-top: 10px; } .progress .swiper-slide.swiper-slide-active { position: relative; top: -30px; } .progress .swiper-slide.swiper-slide-active .dot { width: 172px; height: 172px; -webkit-animation-name: scaleDraw; /*关键帧名称*/ -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/ -webkit-animation-iteration-count: 1; /*动画播放的次数*/ -webkit-animation-duration: 0.3s; /*动画所花费的时间*/ } .progress .swiper-slide.swiper-slide-active .year { font-size: 54px; position: absolute; color: #1252D4; z-index: 1; top: 55px; -webkit-animation-name: scaleDraw; /*关键帧名称*/ -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/ -webkit-animation-iteration-count: 1; /*动画播放的次数*/ -webkit-animation-duration: 0.3s; /*动画所花费的时间*/ } .progress .swiper-slide.swiper-slide-active .info { display: block; } .progress-prev-next-btn { position: relative; top: -285px; z-index: 2; } .progress-prev-next-btn .swiper-button-prev { left: 0px; } .progress-prev-next-btn .swiper-button-next { right: 0px; } .progress-prev-next-btn .swiper-button-next, .progress-prev-next-btn .swiper-button-prev, .partner-prev-next-btn .swiper-button-next, .partner-prev-next-btn .swiper-button-prev { width: 70px; height: 70px; background: linear-gradient(90deg, #0b70cf, #0043b6) center center no-repeat; display: flex; justify-content: center; align-items: center; border-radius: 50%; color: #fff; } .progress-prev-next-btn .swiper-button-next:hover, .progress-prev-next-btn .swiper-button-prev:hover, .partner-prev-next-btn .swiper-button-next:hover, .partner-prev-next-btn .swiper-button-prev:hover { background: #fff; color: #333; } .progress-prev-next-btn .swiper-button-prev.swiper-button-disabled, .progress-prev-next-btn .swiper-button-next.swiper-button-disabled, .partner-prev-next-btn .swiper-button-prev.swiper-button-disabled, .partner-prev-next-btn .swiper-button-next.swiper-button-disabled { background: #dcdcdc; color: #b0b0b0; opacity: 1; } .progress-prev-next-btn .iconfont, .partner-prev-next-btn .iconfont { font-size: 25px; } /*放大*/ @keyframes scaleDraw { 0% { transform: scale(0); } 100% { transform: scale(1); } } /*缩小*/ @keyframes scaleDraw2 { 0% { transform: scale(10); } 100% { transform: scale(1); } } .textmore { padding: 10px 20px; background: #F1F1F1; border-radius: 45px; margin:0px auto; cursor: pointer; display: flex; align-items: center; margin-bottom: 20px; } .textmore i { width: 25px; height: 25px; background: #1666E7; border-radius: 50%; color: #fff; margin-left: 5px; line-height: 23px; text-align: center; -ms-transform:rotate(90deg); /* IE 9 */ -webkit-transform:rotate(90deg); /* Safari and Chrome */ transform:rotate(90deg); display: block; } @media screen and (max-width: 1750px) { .nav ul li a { padding: 0px 20px; } } @media screen and (max-width: 1500px) { .nav ul li a { padding: 0px 15px; } } @media screen and (max-width: 1365px) { .logo { width: 130px; top: -15px; } .nav ul li a { padding: 0px 15px; font-size: 16px; } .nav .gpdm { width: 140px; } /*.navBar { width: 870px; right: calc(0% + 40px); }*/ .navBar ul li .subNav .sn { font-size: 15px; } } @media screen and (max-width: 1200px) { .nav ul li a { padding: 0px 10px; font-size: 15px; } .topInfo { font-size: 14px; } .topInfo a .iconfont { font-size: 17px; } .sub-banner .channel-title { left: 20%; -webkit-transform: translateX(-50%); top: 50%; width: 250px; height: 80px; } .sub-banner .channel-title span { font-size: 25px; } .sub-banner .channel-title span:after, .sub-banner .channel-title span:before { width: 7px; height: 7px; } .footer .footer-body .left { flex: 2; } .footer .footer-body .site-channel a { padding-right: 20px; } } @media screen and (max-width: 1024px) { .topInfo { font-size: 13px; padding: 10px 2%; } .topInfo a .iconfont { font-size: 18px; } .logo { width: 115px; top: -15px; } .nav ul li a { padding: 0px 5px; font-size: 14px; } .nav .gpdm { width: 120px; font-size: 12px; } .nav { padding-right: 0px; } .header { padding: 20px 2%; } .header::after { right: 50px; } /*.navBar { width: 730px; }*/ .header.active .navBar { top: 50px; right: calc(0% + 10px); } .navBar ul li .subNav .sn { font-size: 14px; font-weight: normal; line-height: 40px; } .hotTle { margin-left: 5px; } .nav ul li a { font-size: 14px; } .swiperFullPage>.swiper-pagination { right: 12.5px; } } @media screen and (max-width: 768px) { .topInfo { display: none; } .logo { margin-left: 2%; } .logo>img:nth-child(1) { opacity: 0; } .logo>img:nth-child(2) { opacity: 1; } .header::after { display: none; } .header { height: 60px; padding: 0px; position: fixed; background: #fff; z-index: 500; box-shadow: 0px 0px 15px rgb(0 0 0 / 10%); top: 0px; margin-top: 0px; } .header.open { padding: 10px 0%; height: 60px; } .nav { opacity: 0; visibility: hidden; height: calc(100vh - 60px); position: fixed; left: 0; top: 60px; display: block; width: 100%; background: #202679; display: none; } .navBar { display: none; } .swiperFullPage { height: calc(100vh - 60px); top: 60px; } .swiperFullPage>.swiper-wrapper>.swiper-slide { height: calc(100vh - 60px); } .mNav-toggle-btn { display: block; } .mNav { display: block; width: 100%; height: calc(100vh - 60px); position: fixed; left: 0%; z-index: 20; top: 60px; overflow-y: auto; /*background: linear-gradient(90deg, #0b70cf, #0043b6) center center no-repeat;*/ background: #fff; -webkit-transition: all 0.5s; visibility: hidden; opacity: 0; } .mNav.active { opacity: 1; visibility: visible; } .mNav ul { padding: 0%; color: #000; } .mNav a { color: #333; } .mNav .mTopInfo { padding: 15px 0px; } .mNav .mTopInfo a { flex: 1; margin: 10px 25px; height: auto; line-height: 35px; /* background: #103784; */ background: linear-gradient(90deg, #0b70cf, #0043b6) center center no-repeat; color: #fff; border-radius: 45px; font-size: 16px; padding: 5px; } .mNav .mTopInfo a .iconfont { font-size: 20px; margin: 0px 5px; } .first-li { font-size: 20px; font-weight: bold; position: relative; padding: 10px 5%; } .mNav ul li { line-height: 40px; position: relative; padding-bottom: 3px; } .mNav ul li::after { width: 100%; height: 3px; position: absolute; left: 0%; bottom: 0%; content: ''; background: linear-gradient(90deg, #efefef, #dfdfdf) center center no-repeat; } .second-li { display: flex; flex-wrap: wrap; display: none; } .three-li { width: 90%; display: flex; padding: 10px 0%; flex-wrap: wrap; border-bottom: 1px solid rgba(255, 255, 255, .5); margin-left: 5%; } .three-li:first-child { padding-top: 0%; } .three-li:last-child { border-bottom: none; } .three-li .name { font-size: 16px; font-weight: bold; line-height: 20px; width: 100%; margin-bottom: 5px; } .four-li { display: flex; flex-wrap: wrap; width: 100%; } .four-li a { display: flex; margin-right: 15px; line-height: 30px; } .four-li a .icon { font-size: 16px; } .four-li a .txt { margin-left: 2px; } .first-li.has::after { width: 20px; height: 20px; position: absolute; right: 5%; top: 50%; margin-top: -10px; background: url(../images/arrow-open.svg) no-repeat; background-size: cover; content: ''; -webkit-transition: all .35s; } .first-li.active::after { -webkit-transform: rotate(45deg); } .second-li.active { display: block; } .three-li .name.mb0 { margin-bottom: 0px; } .hotTel { position: absolute; right: calc(5% + 50px); margin-left: 0%; top: 50%; line-height: 33px; -webkit-transform: translateY(-50%); background: transparent; border: 1px solid #0054a3; color: #0054a3; } .header .outlink, .header .search { width: 35px; height: 35px; border-radius: 50%; font-size: 20px; position: absolute; margin-left: 0%; top: 50%; line-height: 33px; -webkit-transform: translateY(-50%); background: transparent; border: 1px solid #0054a3; color: #0054a3; justify-content: center; } .header .outlink.link1 { right: calc(5% + 150px); } .header .outlink.link2 { right: calc(5% + 100px); } .header .search { right: calc(5% + 100px); } .header .outlink .icon, .header .search .icon { font-size: 20px; } .btmBox { width: 100%; margin-top: 25px; padding: 0px 5%; display: flex; justify-content: center; } .nav .gpdm, .btmBox .gpdm { width: 200px; height: auto; line-height: 45px; background-color: #fff; color: #0054a3; font-size: 16px; border-radius: 50px; } .btmBox .gpdm { border: 1px solid #0054a3; text-align: center; margin-bottom: 25px; } .hotTle:hover { width: 35px; } .searchBox .searchInput { width: 90%; margin-left: -45%; } .searchBox .searchInput .int1 { width: 90%; } .pc-show { display: none; } .pc-hide { display: flex; } .swiperFullPage>.swiper-pagination { display: none; } .channelTitle2 .title h1 { font-size: 30px; margin-bottom: 0px; } .channelTitle2 .title p { display: none; } .channelTitle2 .title h1 em { font-style: normal; color: #1666E7; } .channelTitle2 .more em { display: none; } .channelTitle2 .more span { width: 34px; height: 34px; color: #fff; background: #1666E7; border-radius: 50%; display: flex; justify-content: center; align-items: center; margin-left: 15px; } .sub-banner { margin-top: 60px; height: 35vh; } .sub-banner .channel-title { left: 50%; -webkit-transform: translateX(-50%); top: 35%; width: 250px; height: 80px; } .sub-banner .channel-title span { font-size: 25px; } .sub-banner .channel-title span:after, .sub-banner .channel-title span:before { width: 7px; height: 7px; } .sub-banner .sub-channel { left: 50%; top: 70%; -webkit-transform: translate(-50%,-70%); } .sub-banner .sub-channel a { width: 105px; height: 40px; } .bread-crumb { height: 50px; } .bread-crumb .w1400 { flex-direction: column; } .bread-crumb .w1400 .crumb-list { display: none; } .sub-menu { white-space: nowrap; overflow-x: scroll; text-align: center; position: static; width: 100%; } .sub-menu a { padding: 0px 10px; line-height: 50px; } .sub-menu a:after { bottom: -15px; } .footer .footer-top { display: none; } .footer .footer-body .w1400 { flex-direction: column; } .footer .footer-body .site-channel { display: none; } .footer .footer-body .left { flex: 1; } .footer .footer-body .right { width: 100%; margin-top: 20px; } .footer .footer-body .site-info span:nth-child(1), .footer .footer-body .site-info span:nth-child(2) { display: block; width: 50%; } .footer .footer-body .site-info span:nth-child(3), .footer .footer-body .site-info span:nth-child(4) { display: block; width: 50%; } .body-box .title { font-size: 28px; padding: 50px 0px 30px 0px; } .body-box .title span { color: #1252d4; position: relative; } .body-box .title span:after { width: 8px; height: 8px; right: -25px; top: 5px; } .detail-box .detail-pageItem { flex-direction: column; align-items: flex-start; } .detail-box .detail-pageItem .right { margin-top: 20px; } .detail-box .detail-pageItem .right a { width: 100px; height: 40px; } .video-js { width: 100%!important; } .text-muted { font-size: 16px; line-height: 32px; } .progress { margin-top: 20px; } .progress:before { top: 88px; } .progress .swiper-slide .info { line-height: 28px; height: 93px; } .progress .swiper-slide .info p { -webkit-line-clamp: 2; } .progress .swiper-slide .info a.moreTxt { text-align: center; color: #fff; width: 100%; display: block; margin-top: 10px; } .progress .swiper-slide.swiper-slide-active .dot { width: 122px; height: 122px; -webkit-animation-name: scaleDraw; /*关键帧名称*/ -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/ -webkit-animation-iteration-count: 1; /*动画播放的次数*/ -webkit-animation-duration: 0.3s; /*动画所花费的时间*/ } .progress .swiper-slide.swiper-slide-active .year { font-size: 40px; top: 38px; } .progress-prev-next-btn { top: -195px; } .progress-prev-next-btn .swiper-button-next, .progress-prev-next-btn .swiper-button-prev, .partner-prev-next-btn .swiper-button-next, .partner-prev-next-btn .swiper-button-prev { width: 40px; height: 40px; } .progress-prev-next-btn .iconfont, .partner-prev-next-btn .iconfont { font-size: 18px; } } @media screen and (max-width: 500px) { .footer .footer-body .site-info span { text-align: center; } .footer .footer-body .site-info span:nth-child(1), .footer .footer-body .site-info span:nth-child(2) { display: block; width: 100%; } .footer .footer-body .site-info span:nth-child(3), .footer .footer-body .site-info span:nth-child(4) { display: block; width: 100%; } } @media (any-hover: hover) { .hotTel:hover { width: 140px; } .hotTel:hover .txt { width: 140px; } .hotTel:hover .txt span { opacity: 1; } }