.bx-wrapper { background: none; border: none; margin: 0; -webkit-box-shadow: none; box-shadow: none; } .banner li div h3, .culture .list .line-box { position: relative; } .banner li div h3::before, .culture .list .line-box::before, .banner li div h3::after, .culture .list .line-box::after { display: block; content: ''; position: absolute; } .index-tab .tab-box ul li:first-child, .p-banner, .honor .pic-box, .job-list li p ins + ins, .news-details .title, .event .year-box, .event .year-box .year ul li span { position: relative; } .index-tab .tab-box ul li:first-child::before, .p-banner::before, .honor .pic-box::before, .job-list li p ins + ins::before, .news-details .title::before, .event .year-box::before, .event .year-box .year ul li span::before { display: block; content: ''; position: absolute; } html { max-width: 1920px; margin: 0 auto; } body { padding-top: 54px;width: 100%; overflow-x: hidden; background: url("../../images/about/about-bg.jpg") right bottom no-repeat; } body.index { background: #e8eaeb; } body.event { background: #fff; } .fixed-head { position: fixed; right: 0; left: 0; top: 0; z-index: 999; } .fixed-head .nav { height: 40px; line-height: 40px; color: #fff; font-size: 15px; background-color: rgba(0, 0, 0, 0.5); text-align: center; } .fixed-head .nav li { display: inline-block; padding: 0 35px; } .fixed-head .nav li.current { color: #9bbde0; } .fixed-head .nav.active { background-color: #3d464c; } .top { height: 54px; line-height: 54px; overflow: hidden; } .top .logo-box { margin-right: 18.75%; height: 100%; background: #6694b7; background: -webkit-gradient(linear, right top, left top, from(#fff), to(#6694b7)); background: -webkit-linear-gradient(right, #fff, #6694b7); background: -o-linear-gradient(right, #fff, #6694b7); background: linear-gradient(to left, #fff, #6694b7); } .top .logo-box .language { float: right; margin-right: 25px; color: #fff; font-size: 12px; } .top .logo-box .language span { padding-right: 10px; font-size: 14px; } .top .logo-box .logo { float: left; margin-left: 18.75%; width: 50%; } .top .logo-box .logo img { vertical-align: middle; } .top .input-box { background-color: #135091; position: relative; float: right; width: 18.75%; height: 100%; } .top .input-box input { border: 0; background: none; color: #fff; width: 280px; height: 100%; } .top .input-box input::-webkit-input-placeholder { color: #78baff; } .top .input-box input::-moz-placeholder { color: #78baff; } .top .input-box input::-moz-placeholder { color: #78baff; } .top .input-box input:-ms-input-placeholder { color: #78baff; } .top .input-box .search-btn { display: block; position: absolute; right: 20px; top: 50%; width: 20px; height: 20px; margin-top: -10px; color: #fff; font-size: 24px; cursor: pointer; background: url("../../images/search-btn.png") center center no-repeat; } .banner li { height: 588px; padding-top: 290px; background-image: url("../../images/index-banner.jpg"); } .banner li div { width: 1100px; margin: 0 auto; text-align: center; color: #fff; } .banner li div h3 { font-size: 52px; overflow: hidden; height: 98px; } .banner li div h3 span { display: block; width: 0; height: 80px; position: absolute; right: 0; top: 0; -webkit-transition: width .4s; -o-transition: width .4s; transition: width .4s; white-space: nowrap; } .banner li div h3::before { right: 0; top: 0; bottom: 0; width: 8px; background-color: #fff; -webkit-transition: right .5s; -o-transition: right .5s; transition: right .5s; } .banner li div h3::after { right: 0; top: 0; bottom: 0; background-color: #fff; width: 8px; } .banner li div p { font-size: 14px; } .banner li.on div h3::before { right: 1090px; } .banner li.on div h3 span { width: 100%; } .index-tab { margin-top: -56px; position: relative; } .index-tab .tab-title { height: 56px; } .index-tab .tab-title .tab-tt { width: 599px; float: left; height: 100%; line-height: 56px; text-align: center; font-size: 15px; background-color: rgba(0, 0, 0, 0.4); color: #fff; position: relative; cursor: pointer; } .index-tab .tab-title .tab-tt i { display: block; position: absolute; right: 40px; top: 50%; margin-top: -28px; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; } .index-tab .tab-title .tab-tt i:hover { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .index-tab .tab-title .tab-tt:last-child { float: right; } .index-tab .tab-title .tab-tt.on { background-color: #135091; } .index-tab .tab-box { height: 200px; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); overflow: hidden; position: relative; background-color: #fff; } .index-tab .tab-box ul { width: 100%; height: 400px; position: absolute; left: 0; right: 0; top: 0; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; } .index-tab .tab-box ul li { height: 200px; } .index-tab .tab-box ul li:first-child::before { width: 1px; height: 160px; background-color: #ccc; left: 50%; top: 20px; } .index-tab .tab-box ul li:first-child .left { width: 50%; float: left; height: 100%; text-align: center; } .index-tab .tab-box ul li:first-child .right { width: 50%; float: right; height: 100%; text-align: center; } .index-tab .tab-box ul li:first-child .right .txt { display: inline-block; font-size: 12px; color: #8c8c8c; width: 80%; text-align: left; } .index-tab .tab-box ul li:first-child .right .txt a { display: inline-block; color: red; margin-left: 20px; } .index-tab .tab-box ul li:last-child a { display: block; float: left; width: 400px; padding: 50px 30px 0; color: #5a5a5a; } .index-tab .tab-box ul li:last-child a h3 { font-size: 18px; height: 24px; line-height: 24px; margin-bottom: 26px; } .index-tab .tab-box ul li:last-child a h3 i { font-size: 22px; margin-right: 15px; } .index-tab .tab-box ul li:last-child a span { font-size: 22px; font-weight: lighter; } .index-tab .tab-box ul li:last-child a .icon-htbarrowright { display: block; float: right; margin-top: 10px; width: 60px; height: 26px; line-height: 26px; text-align: center; } .index-tab .tab-box ul li:last-child a:hover .icon-htbarrowright { background-color: #1a6ec7; color: #fff; } .index-tab .tab-box ul.on { -webkit-transform: translateY(-200px); -ms-transform: translateY(-200px); transform: translateY(-200px); } .logo-list { position: relative; margin-top: 70px; margin-bottom: 60px; } .logo-list .btn { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); cursor: pointer; } .logo-list .btn.prev { left: 0; } .logo-list .btn.next { right: 0; } .logo-list .slide-box { width: 1100px; margin: 0 auto; } .logo-list .slide-box li { text-align: center; } .logo-list .slide-box li img { display: inline-block; -webkit-filter: grayscale(100%); filter: grayscale(100%); border: 1px solid #ccc; } .logo-list .slide-box li:hover img { -webkit-filter: grayscale(0); filter: grayscale(0); } .copyright { text-align: center; font-size: 12px; color: #3e454a; margin-top: 40px; } .foot { line-height: 30px; padding: 15px 0; background-color: #3d464c; margin-top: 40px; color: #7c7e80; font-size: 12px; text-align: center; } .foot li { display: inline-block; } .foot .line { padding: 0 10px; } .scroll-parallax { -webkit-transition: -webkit-transform .2s ease-out; transition: -webkit-transform .2s ease-out; -o-transition: transform .2s ease-out; transition: transform .2s ease-out; transition: transform .2s ease-out, -webkit-transform .2s ease-out; } .test { height: 5000px; background: #333; padding-top: 200px; font-size: 30px; line-height: 400px; text-align: center; color: blue; } .test div { width: 100px; height: 400px; margin: 100px 0 40px 90px; background-color: #fff; float: left; } .p-banner { height: 445px; overflow: hidden; } @media screen and (max-width: 1440px) { .p-banner { height: 380px; } } .p-banner .picture { width: 100%; height: 100%; left: 0; top: 0; background: url("../../images/about/banner.jpg") 0 0 no-repeat; background-position: center!important; background-size: cover; -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); -webkit-transition: -webkit-transform 2.5s ease-out; transition: -webkit-transform 2.5s ease-out; -o-transition: transform 2.5s ease-out; transition: transform 2.5s ease-out; transition: transform 2.5s ease-out, -webkit-transform 2.5s ease-out; } .p-banner.on .picture { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .p-banner > div { padding-top: 300px; position: relative; } .p-banner > div h3 { color: #fff; font-size: 30px; } .p-banner > div h3 span { font-size: 24px; } .m-nav { height: 60px; line-height: 60px; border-bottom: 1px solid #f0f3fa; } .m-nav ul { width: 1200px; margin-right: auto; margin-left: auto; text-align: center; letter-spacing: 0; font-size: 0; } .m-nav ul li { width: 20%; height: 60px; display: inline-block; margin: 0; font-size: 16px; color: #666666; } .m-nav ul li.on { background-color: #135091; color: #fff; -webkit-box-shadow: 0 0 30px rgba(19, 80, 145, 0.1); box-shadow: 0 0 30px rgba(19, 80, 145, 0.1); } .m-nav ul li a { display: block; height: 100%; width: 100%; } .about-content { padding: 70px 0; margin-bottom: 70px; text-align: center; } @media screen and (max-width: 1440px) { .about-content { padding: 30px 0; } } .about-content h4 { font-size: 20px; color: #cccccc; margin-bottom: 40px; text-transform: uppercase; } .about-content h3 { font-size: 30px; color: #333333; margin-bottom: 10px; } .about-content .article { line-height: 2; font-size: 14px; } .about-content .article img { max-width: 100%; height: auto !important; display: block; margin: 50px auto; } .culture .list { height: 325px; padding-top: 1px; } .culture .list .line-box { width: 100%; height: 1px; background-color: #e6edfa; top: 60px; position: relative; } .culture .list .line-box::before { width: 270px; height: 44px; right: -webkit-calc(50% + 50px); right: calc(50% + 50px); top: -22px; background: url("../../images/about/line-l.png"); } .culture .list .line-box::after { width: 270px; height: 44px; left: -webkit-calc(50% + 50px); left: calc(50% + 50px); top: -22px; background: url("../../images/about/line-r.png"); } .culture .list ul { width: 1200px; margin-right: auto; margin-left: auto; } .culture .list ul li { text-align: center; width: 20%; float: left; } .culture .list ul li .pic-box { width: 120px; margin: 0 auto 40px; height: 120px; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; overflow: hidden; border-radius: 20px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .culture .list ul li .pic-box img { position: relative; -webkit-transform: rotate(-45deg) scale(1.42); -ms-transform: rotate(-45deg) scale(1.42); transform: rotate(-45deg) scale(1.42); max-width: 100%; } .culture .list ul li .pic-box div { position: absolute; width: 60%; height: 60%; left: 20%; top: 20%; background-color: rgba(0, 0, 0, 0.5); border-radius: 20px; } .culture .list ul li .pic-box div span { display: block; width: 100%; height: 100%; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); position: relative; } .culture .list ul li .pic-box div span i { display: block; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); position: absolute; left: 50%; top: 50%; color: #fff; font-size: 24px; } .culture .list ul li h5 { font-size: 14px; -webkit-transition: font-size .4s; -o-transition: font-size .4s; transition: font-size .4s; margin-bottom: 10px; } .culture .list ul li p { display: none; } .culture .list ul li.on .pic-box { -webkit-transform: scale(1.2) rotate(45deg); -ms-transform: scale(1.2) rotate(45deg); transform: scale(1.2) rotate(45deg); margin-bottom: 70px; } .culture .list ul li.on .pic-box div { background-color: #fff; } .culture .list ul li.on .pic-box div span i { color: #135091; } .culture .list ul li.on h5 { color: #135091; font-size: 18px; } .culture .list ul li.on p { display: block;font-size: 14px; } .honor .bx-viewport { padding: 20px; } .honor .about-content > h3 { margin-bottom: 20px; } .honor .year-box { width: 1200px; margin-left: auto; margin-right: auto; margin-bottom: 60px; position: relative; } .honor .year-box .bx-wrapper { margin-right: auto; margin-left: auto; } .honor .year-box li { height: 60px; padding-top: 15px; width: 80px; display: inline-block; } .honor .year-box li a { display: block; width: 100%; height: 30px; line-height: 30px; } .honor .year-box li a:hover, .honor .year-box li a.on { -webkit-box-shadow: 0 0 30px rgba(59, 82, 107, 0.24); box-shadow: 0 0 30px rgba(59, 82, 107, 0.24); } .honor .year-box .btn { position: absolute; top: 50%; } .honor .year-box .btn i { font-size: 20px; font-weight: bold; } .honor .year-box .btn.prev { left: 130px; -webkit-transform: translate(-100%, -50%); -ms-transform: translate(-100%, -50%); transform: translate(-100%, -50%); } .honor .year-box .btn.next { right: 130px; -webkit-transform: translate(100%, -50%); -ms-transform: translate(100%, -50%); transform: translate(100%, -50%); } .honor .year-box .btn:hover { color: #135091; } .honor .big-img { max-width: 100%; display: block; margin: 0 auto; } .honor .pic-box::before { width: 100%; height: 1px; top: 50%; background-color: #e6edfa; } .honor .pic-box .bx-wrapper { margin-left: auto; margin-right: auto; } .honor .pic-box li { height: 240px; position: relative; } .honor .pic-box li .pic { width: 100%; height: 190px; position: relative; -webkit-box-shadow: 0 0 30px rgba(59, 82, 107, 0.24); box-shadow: 0 0 30px rgba(59, 82, 107, 0.24); margin-bottom: 30px; padding: 10px; background-color: #fff; } .honor .pic-box li .pic .img { background-size: cover; width: 100%; height: 100%; } .honor .pic-box li .pic .layout-table { width: 100%; height: 100%; opacity: 0; } .honor .pic-box li .pic .layout-table i { font-size: 30px; } .honor .pic-box li h3 { font-size: 14px; color: #999999; opacity: 0; } .honor .pic-box li:hover .layout-table { opacity: 1; color: #fff; } .honor .pic-box li:hover h3 { opacity: 1; } .honor .pic-box > div { width: 1200px; margin-left: auto; margin-right: auto; position: relative; } .honor .pic-box .btn { position: absolute; top: 50%; color: #135091; opacity: .3; } .honor .pic-box .btn i { font-size: 30px; font-weight: bold; } .honor .pic-box .btn.prev { left: 0; -webkit-transform: translate(-100%, -50%); -ms-transform: translate(-100%, -50%); transform: translate(-100%, -50%); } .honor .pic-box .btn.next { right: 0; -webkit-transform: translate(100%, -50%); -ms-transform: translate(100%, -50%); transform: translate(100%, -50%); } .honor .pic-box .btn:hover { opacity: 1; } .partner-list ul { width: 1200px; margin-right: auto; margin-left: auto; } .partner-list li { width: 20%; float: left; height: 80px; margin-bottom: 48px; } .partner-list li div { width: 80%; margin: 0 auto; border: 1px solid #ccc; text-align: center; } .job-list { width: 900px; margin-left: auto; margin-right: auto; } .job-list li { text-align: left; position: relative; height: 100px; border-bottom: 1px solid #eee; padding: 0 20px; } .job-list li:hover { background-color: #eee; } .job-list li h3 { font-size: 16px; color: #333333; margin-bottom: 10px; } .job-list li p { font-size: 12px; color: #666666; } .job-list li p ins { display: block; float: left; } .job-list li p ins + ins { margin-left: 60px; font-size: 14px; } .job-list li p ins + ins::before { width: 6px; height: 6px; border-radius: 50%; background-color: #666666; left: -30px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .job-list li a { cursor: pointer; position: absolute; display: block; right: 20px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-color: #236fd5; width: 100px; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 14px; -webkit-transition: border-radius .2s; -o-transition: border-radius .2s; transition: border-radius .2s; } .job-list li a:hover { border-radius: 8px; background-color: red; } .job-list li:first-child { border-top: 1px solid #eee; } .job-list .page { text-align: center; letter-spacing: 20px; margin-top: 30px; } .job-list .page .btn { display: inline-block; cursor: pointer; } .job-list .page .btn.current i{ color: #236fd5; } .job-list .page i { font-size: 18px; } .job-list .page i:hover { color: #236fd5; } .job .alert-box { width: 50vw; position: fixed; left: 25vw; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-color: #fff; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); padding: 30px; display: none; } .job .alert-box h3 { height: 50px; line-height: 50px; font-size: 18px; text-align: center; } .job .alert-box dt { font-size: 14px; font-weight: bold; margin-bottom: 20px; } .job .alert-box dd { font-size: 12px; margin-bottom: 10px; padding-left: 20px; } .job .alert-box .close { display: block; position: absolute; right: 0; bottom: 100%; font-size: 30px; color: #fff; cursor: pointer; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; } .job .alert-box .close:hover { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .job .alert-cover { width: 100vw; left: 0; right: 0; top: 0; bottom: 0; display: none; height: 100vh; background-color: rgba(0, 0, 0, 0.3); position: fixed; } .job-detail { padding-top: 80px; width: 900px; margin: 20px auto 80px; } .job-detail h2 { font-size: 18px; text-align: center; color: #333; } .job-detail ul { margin: 30px auto; border-bottom: 1px solid #eee; height: 60px; line-height: 60px; } .job-detail li { float: left; width: 33.33%; text-align: center; } .job-detail li span { color: #ddd; } .job-detail .info dl { margin-bottom: 30px; } .job-detail .info dt { font-size: 14px; font-weight: bold; margin-bottom: 20px; } .job-detail .info dd { font-size: 12px; margin-bottom: 10px; padding-left: 20px; } .job-detail label { cursor: pointer; margin: 20px auto; display: block; background-color: #236fd5; width: 100px; height: 40px; line-height: 40px; text-align: center; color: #fff; font-size: 14px; border-radius: 6px; } .news-list { width: 1200px; margin-left: auto; margin-right: auto; } .news-list .news-type { text-align: center; margin-bottom: 60px; } .news-list .news-type a { display: inline-block; width: 80px; height: 30px; line-height: 30px; font-size: 14px; color: #999999; } .news-list .news-type a + a { margin-left: 20px; } .news-list .news-type a.on { color: #236fd5; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); } .news-list .news-type a:hover { -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); } .news-list li { border-bottom: 1px solid #eee; height: 200px; } .news-list li .time { width: 170px; float: left; } .news-list li .time .day { font-size: 30px; color: #666666; } .news-list li .pic { width: 160px; float: left; } .news-list li .pic img { width: 160px; } .news-list li .info { width: 790px; float: left; text-align: left; padding-left: 65px; } .news-list li .info h3 { font-size: 17px; color: #333333; margin-bottom: 25px; } .news-list li .info p { font-size: 14px; color: #666666; } .news-list li:hover .info h3 { color: #135091; } .news-list li:hover .time .day { color: #135091; } .news-list .page { text-align: center; letter-spacing: 2px; margin-top: 30px; } .news-list .page .loadMore { width: 80px; height: 30px; line-height: 30px; border: 1px solid #eee; margin: 0 auto; cursor: pointer;border-radius: 5px; } .news-list .page .loadMore:hover { background-color: #003686; color: #fff; } .news-details { padding-top: 70px; } .news-details .title { min-height: 30px; margin-bottom: 20px; line-height: 30px; } .news-details .title::before { width: 100%; height: 1px; background-color: #ccc; top: 14px; left: 0; z-index: -1; } .news-details .title h3 { width: 500px; margin: 0 auto; text-align: center; background-color: #fff; font-size: 24px; } .news-details .time { font-size: 12px; color: #999999; text-align: center; } .news-details .article { width: 900px; margin: 0 auto; padding-top: 60px; font-size: 14px; line-height: 2; } .news-details .article img { max-width: 100% !important;margin: 20px 0; height: auto !important; } .go-back { position: fixed; right: 20px; bottom: 100px; background-color: #235ca4; border-radius: 50%; color: #fff; width: 60px; height: 60px; text-align: center; line-height: 60px; } .go-back i { font-size: 24px; } .contact { padding-top: 54px; } .contact .title { width: 1200px; height: 80px; line-height: 80px; -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); margin: 30px auto 50px; } .contact .title p { color: #666666; font-size: 14px; width: 33.333%; float: left; height: 100%; } .contact .title p i { color: #235ca4; font-size: 24px; margin-right: 10px; } .contact .map-box { height: 620px; width: 1200px; margin: 0 auto; } .contact .map-box .map-txt { width: 440px; float: right; height: 100%; } .contact .map-box .map-txt .tt { text-align: center; margin-bottom: 28px; } .contact .map-box .map-txt .tt > span { width: 90px; height: 30px; line-height: 30px; display: inline-block; color: #333333; font-size: 12px; background-color: #f7f7f7; } .contact .map-box .map-txt .tt > span + span { margin-left: 30px; } .contact .map-box .map-txt .tt > span.on { -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); background-color: #fff; } .contact .map-box .map-txt .input-box { height: 44px; line-height: 44px; background-color: #f7f7f7; position: relative; margin-bottom: 30px; } .contact .map-box .map-txt .input-box input { border: none; background: none; height: 100%; text-indent: 20px; width: 80%; position: absolute; left: 0; top: 0; } .contact .map-box .map-txt .input-box .icon-search { position: absolute; right: 20px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 24px; cursor: pointer; } .contact .map-box .map-txt ul:not(.down) li { text-align: left; height: 86px; margin-bottom: 30px; padding-left: 24px; border-bottom: 1px solid #eee; position: relative; } .contact .map-box .map-txt ul:not(.down) li i { position: absolute; display: block; left: 0; top: 0; color: #235ca4; } .contact .map-box .map-txt ul:not(.down) li h3 { font-size: 14px; color: #333333; margin-bottom: 10px; } .contact .map-box .map-txt ul:not(.down) li p { font-size: 12px; color: #666666; } .contact .map-box .map { margin-right: 500px; position: relative; height: 100%; } .contact .map-box .map svg { width: 100%; height: 100%; } .contact .map-box .map svg circle { fill: #fff; pointer-events: none; opacity: 0; } .contact .map-box .map svg circle.on { opacity: 1; } .contact .map-box .map svg polygon { cursor: pointer; fill: #eee; stroke: #fff; stroke-width: 0.5; opacity: 1; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .contact .map-box .map svg polygon:hover, .contact .map-box .map svg polygon.active { opacity: 0.8; } .map-province { white-space: nowrap; position: absolute; margin: -2px 0 0 -20px; width: 40px; pointer-events: none; color: #235ca4; text-align: center; } .map-province i { font-size: 18px; } .map-province.Tdot,.map-province.Tdot i{ color: #e83921; } .event .year-box { height: 400px; overflow: hidden; } .event .year-box::before { width: 100%; height: 2px; background: url("../../images/line.png") center center no-repeat; top: 50%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; } .event .year-box .bg-slide { width: 640px; margin: 0 auto; height: 400px; z-index: 0; position: relative; } .event .year-box .bg-slide .aaa { position: absolute; right: 0; top: 0; bottom: 0; left: 0; background: url("../../images/mask.png") 0 0 no-repeat; width: 100%; height: 100%;z-index: 1000; } .event .year-box .bg-slide li { width: 640px; height: 400px; } .event .year-box .year { width: 1120px; position: absolute; left: 50%; margin-left: -560px; height: 60px; top: 50%; margin-top: -50px; z-index: 2; overflow: hidden; } .event .year-box .year ul { position: absolute; left: 0; top: 0; height: 100%; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; } .event .year-box .year ul li { width: 160px; float: left; position: relative; height: 100%; text-align: center; } .event .year-box .year ul li span { width: 10px; height: 10px; border-radius: 50%; position: absolute; cursor: pointer; background-color: #2a619b; left: 50%; display: block; bottom: 5px; margin-left: -5px; } .event .year-box .year ul li span::before { width: 16px; height: 16px; position: absolute; border-radius: inherit; background-color: inherit; opacity: .6; left: -3px; top: -3px; } .event .year-box .year ul li ins { display: block; position: absolute; top: 0; left: 50%; width: 40px; margin-left: -20px; font-size: 14px; cursor: pointer; } .event .year-box .img-slide { width: 228px; position: absolute; z-index: 3; left: 50%; margin-left: -114px; top: 55px; } .event .year-box .img-slide ul li { width: 228px; height: 290px; } .event .event-list { width: 700px; margin: 0 auto; height: 220px; text-align: center; position: relative; } .event .event-list .btn { position: absolute; width: 125px; height: 14px; top: 50px; cursor: pointer; } .event .event-list .btn.prev { background: url("../../images/left.png") 0 0 no-repeat; left: 0; } .event .event-list .btn.prev:hover { background-image: url("../../images/hover-left.jpg"); } .event .event-list .btn.next { background: url("../../images/right.png") 0 0 no-repeat; right: 0; } .event .event-list .btn.next:hover { background-image: url("../../images/hover-right.jpg"); } .event .event-list .list-slide { margin: 0 auto; width: 420px; } .event .event-list .list-slide li { color: #666666; width: 420px; min-height: 220px; font-size: 14px; } .event .event-list .list-slide li h3 { font-size: 24px; color: #135091; margin-bottom: 20px; } .event .event-list .list-slide li p { font-size: 15px; line-height: 1.5; } #container { padding: 0; height: 100%; } .amap-toolbar { left: auto !important; right: 10px !important; } #chose { width: 140px; float: left; } /*# sourceMappingURL=../maps/style.css.map */ /*11.23*/ .layout-down { display: inline-block; padding-right: 40px; position: relative; background-color: #fff; height: 40px; line-height: 40px; float: left;cursor: pointer; border: 1px solid #eeeeee; box-shadow: 0 0 20px -5px rgba(0, 0, 0, 0.3); } .layout-down span.downTxt { display: inline-block; width: 100px; display: flex; align-items: center; position: relative; border: none; background-color: transparent; box-sizing: border-box; padding: 4px 8px; height: 100%; vertical-align: top; } .layout-down span.downTxt:after { content: ''; width: 1px; height: 50%; top: 0; bottom: 0; background-color: #ddd; right: 0; position: absolute; margin: auto; display: none; } .layout-down span.downIcon { position: absolute; right: 0; width: 40px; top: 0; height: 100%; text-align: center; box-sizing: border-box; transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; height: 40px; line-height: 40px; } .layout-down ul.down { position: absolute; top: 100%; left: 0%; width: 100%; z-index: 100; display: none; } .layout-down ul.down > li { display: inline-block; width: 100%; box-sizing: border-box; padding: 0 8px; background-color: #ececec; float: left; text-align: left; transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; } .layout-down ul.down > li > span { transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; } .layout-down ul.down > li:hover { background-color: rgb(35, 92, 164); } .layout-down ul.down > li:hover > span { color: #fff; } .layout-down.active span.downIcon { transform: scale(-1); -webkit-transform: scale(-1); -moz-transform: scale(-1); -o-transform: scale(-1); }