@charset "utf-8"; /* CSS Document */ *{margin:0px;padding:0px} body{font-size:12px; font-family:"寰蒋闆呴粦";color:#000;} img{border: 0;} li{ list-style:none;} .fl{float:left;} .fr{float:right} .cl{clear:both;} a{ text-decoration: none; } a:hover{ text-decoration:none; } cite{ font-style:normal; float:right} cite a{ color:#333} /***************閫氱敤閮ㄥ垎***************/ .page{ width:1400px; margin:0 auto} .header{ height:790px; position:relative;} /***************绗竴閮ㄥ垎***************/ .picScroll-left .prev,.picScroll-left .next{ position:absolute; top:50%; margin-top:-25px; display:block; width:50px; height:50px; filter:alpha(opacity=50);opacity:0.5;transform: translate(-30%,-50%) rotate(45deg);border-color: #f25a21;border-style: solid ;transition: background-color .2s; z-index:10; border-radius:10px} .picScroll-left .prev{border-width: 0 0 10px 10px; left:60px} .picScroll-left .next{ border-width: 10px 10px 0 0;transform: translate(-70%,-50%) rotate(45deg); right:0 } .picScroll-left .prev:hover, .picScroll-left .next:hover{ filter:alpha(opacity=100);opacity:1;background-color: rgba(255,255,255,.1) } .picScroll-left{ width:100%} .picScroll-left .hd ul{ overflow:hidden; zoom:1; zoom:1; position:absolute; width:100%; height:30px; left:0; bottom:20px; z-index:9;display: flex;justify-content:center;flex-wrap:wrap;} .picScroll-left .hd ul li{ float:left; width:15px; height:15px; overflow:hidden; margin-right:5px; text-indent:-999px; cursor:pointer; background:#fff; border-radius:50% } .picScroll-left .hd ul li.on{ background:#f00 } .picScroll-left .bd ul{ overflow:hidden; zoom:1; } .picScroll-left .bd ul li{text-align: center;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center; height:790px} .picScroll-left .bd ul li img{max-width:100%; max-height:790px;} .min_top{ background:url(top.png) repeat-x center top; height:336px; position:absolute; width:100%; top:0; left:0; z-index:9} .g_width{ width:1200px; height:500px; position:absolute; left:50%; margin-left:-600px; top:50px; z-index:10} .zt{ margin-left:180px; margin-top:220px} /***************绗?閮ㄥ垎***************/ .navBar{ height:80px; background:url(nav.jpg) repeat-y center top; line-height:80px;background-size: 100% 100%;} .nav {position: relative;width: 1400px;margin: 0 auto;font-size: 20px; height:80px; z-index:999} .nav a {color: #fff} .nav .m {float: left;position: relative;z-index: 1} .nav .s {float: left;width: 3px;text-align: center;color: #d4d4d4;font-size: 12px} .nav h3 a {display: block;width: 230px;text-align: center; font-weight:normal} .nav .sub {display: none;position: absolute;top: 80px;z-index: 1;width: 230px;background: rgb(240,76,75,.8);border-bottom: 5px #d42c2b solid;; z-index:99} .nav .sub li {text-align: center;padding: 0 8px;margin-bottom: -1px} .nav .sub li a {display: block;padding: 8px 0;height: 32px;line-height: 32px;color: #fff;font-size: 16px;font-weight: 700} .nav .sub li a:hover {color: #000; background:#fff} .wrap{ background:url(bg2.jpg) no-repeat center top; height:900px; padding-top:58px} .wrap1{ background:url(bg1.jpg) no-repeat center top; height:911px; padding-top:58px; margin-bottom:60px} /***************绗?閮ㄥ垎***************/ .min_title{ height:124px; line-height:104px; text-align:center; font-size:52px; color:#000; font-weight:bold} .min_title a{ color:#000;} .min_title a:after{ width:97px; height:10px; border-radius:5px; background:#e8b3a3; display:block; content:""; margin:0 auto} .min_video video{ width:1050px; height:600px; box-shadow:0 0 8px rgb(0,0,0,0.5); margin-bottom:20px} .min_video{ text-align:center; line-height:60px; font-size:30px; margin-top:60px} .min_video a{ color:#000} .min_pix{ width:445px; height:365px; position:relative; float:left; margin-right:20px; margin-bottom:40px} .min_pix img{ width:445px; height:365px;} .min_pix .min_hover{ background:url(pix.png) repeat-x center bottom; bottom:0; left:0; width:100%; height:140px; position:absolute} .min_ce{ width:87px; position:absolute; right:0; top:0; height:365px; background:url(red.png) repeat-y center top;writing-mode:vertical-rl; text-align:center; line-height:88px; font-size:24px; letter-spacing:10px} .min_ce a{ color:#fff} .min_pix .min_ce img{ width:auto; height:auto} .blue{ background:url(blue.png) repeat-y center top} .min_right{ width:415px; height:325px;box-shadow:0 0 15px rgb(0,0,0,0.5); float:right; border-bottom-right-radius:50px; padding:20px} .min_title1{line-height:30px; font-size:22px;} .min_title1 img{ margin-top:5px; margin-right:10px; float:left} .min_title1 a{ color:#000} ul.f68d16 li{ border-bottom:1px #ddd solid;height:62px; line-height:62px;color:#999} ul.f68d16 li a{ font-size:16px; color:#000; float:left; width:320px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} ul.f68d16 li a:hover{ color:#cd0000} ul.f68d16 li span{ float:right} ul.f68d16 li:last-child{ border-bottom:none} .swiper {width: 100%;height: 781px;} .swiper1 {width: 100%;height: 790px;} .swiper-slide {} .min_ywly{ position:relative} .min_ywly img{width: 100%;height: 640px; border-top-left-radius:260px} .min_t{ position:absolute; left:20%; top:0; z-index:9;opacity:0;animation:danrurz 1s;-moz-animation:danrurz 1s; -webkit-animation:danrurz 1s; -o-animation:danrurz 1s;transition: all 1s;} .min_ywly .min_t img{ width:auto; height:auto; border-radius:0} .min_text{ background:url(pic.png) no-repeat center top; width:558px; height:295px; right:50%; top:0; position:absolute; padding:25px 60px 24px 60px; margin-right:-678px;animation:danrurzz 1s;-moz-animation:danrurzz 1s; -webkit-animation:danrurzz 1s; -o-animation:danrurzz 1s;transition: all 1s;transition: all 1s;opacity:0;display: flex;align-items: center;} .min_text p{ line-height:30px; font-size:18px; color:#21518f} .swiper-slide-active .min_t{top:160px;opacity:1;} .swiper-slide-active .min_text{top:200px;opacity:1;} .swiper-pagination{ background: url(box.png) no-repeat center top; height:110px; width:100%;display: flex;justify-content:center;flex-wrap:wrap; padding-top:80px} .swiper-pagination span{ display:block; width:130px; height:75px; float:left; border-radius:0} .swiper-pagination span:nth-child(1){ background:url(s1.png) no-repeat center center} .swiper-pagination span:nth-child(2){ background:url(s2.png) no-repeat center center} .swiper-pagination span:nth-child(3){ background:url(s3.png) no-repeat center center} .swiper-pagination span:nth-child(4){ background:url(s4.png) no-repeat center center} .swiper-pagination span:nth-child(5){ background:url(s5.png) no-repeat center center} .swiper-pagination span:nth-child(6){ background:url(s6.png) no-repeat center center} .swiper-pagination span:nth-child(7){ background:url(11.png) no-repeat center center} .swiper-pagination-bullet{opacity: var(--swiper-pagination-bullet-inactive-opacity, 1);} .swiper-pagination span:nth-child(1).swiper-pagination-bullet-active{ background:url(s11.png) no-repeat center center!important} .swiper-pagination span:nth-child(2).swiper-pagination-bullet-active{ background:url(s22.png) no-repeat center center!important} .swiper-pagination span:nth-child(3).swiper-pagination-bullet-active{ background:url(s33.png) no-repeat center center!important} .swiper-pagination span:nth-child(4).swiper-pagination-bullet-active{ background:url(s44.png) no-repeat center center!important} .swiper-pagination span:nth-child(5).swiper-pagination-bullet-active{ background:url(s55.png) no-repeat center center!important} .swiper-pagination span:nth-child(6).swiper-pagination-bullet-active{ background:url(s66.png) no-repeat center center!important} .swiper-pagination span:nth-child(7).swiper-pagination-bullet-active{ background:url(22.png) no-repeat center center!important} /***************绗?閮ㄥ垎***************/ @keyframes danrurzz{from { opacity:0;top:0;}to {top:200px;opacity:1;}} @-webkit-keyframes danrurzz {from { opacity:0;top:0;}to {top:200px;opacity:1;}} @keyframes danrurz{from { opacity:0;top:0;}to {top:160px;opacity:1;}} @-webkit-keyframes danrurz {from { opacity:0;top:0;}to {top:160px;opacity:1;}} /***************绗?閮ㄥ垎***************/ .footer{ height:270px; background:url(footer.jpg) no-repeat center top; padding-top:74px} .footer_left{ width:1220px; float:left; text-align:center} .footer_right{ width:180px; float:right; text-align:center} .footer_left p{ line-height:48px; font-size:20px; color:#d4edcf;} .footer_left p span:nth-child(2){ padding:0 160px} .footer_left p:nth-child(1){ border-bottom:1px #7cbc80 solid; color:#fff; line-height:66px} .footer_left p a{color:#d4edcf;} @media screen and (max-width: 640px) { .swiper {width: 100%;height:auto;} .zj_page, .h2017_footer{ display:none} .g_width{ height:auto; width:calc(100% - 20px); left:0; margin-left:20px; top:20px} .logo{ width:50%} .page{ width:96%;} .header{ height:auto; width:100%} .picScroll-left .bd ul li img, .min_ywly img{ height:auto} .zt, .min_nav, .min_text{ display:none} .min_video video{ width:100%; height:auto; display:block} .wrap{ background:url(bg2.jpg) no-repeat center top; height:auto; padding-top:58px; background-size:100% 100%} .wrap1{ background:url(bg1.jpg) no-repeat center top; height:auto; padding-top:58px; margin-bottom:60px; background-size:100% 100%} .min_title{ font-size:28px; height:60px; line-height:50px} .min_video{ font-size:20px; padding-bottom:20px} .min_pix, .min_pix img, .swipe, .swiper1 { width:100%; height:auto} .min_ce{ height:100%} .min_right{ width:calc(100% - 40px); height:auto} .footer_left, .footer_right{ width:100%; float:none} .footer_left p span{ display:block} .footer_left p span:nth-child(2){ padding:0 0} .navBar{width: 100%;overflow-x: scroll;height: 60px;line-height: 60px;font-size: 16px;} .nav h3 a {display: block; width: auto; text-align: center;font-weight: normal;padding: 0 20px;} .nav{width: 850px;} .footer{ height:auto; background:url(footer.jpg) no-repeat center top; padding:34px 0; background-size:100% 100%; margin-top:30px} .footer_left p:nth-child(1){ line-height:48px} .swiper-pagination{ height:60px;background-size:100% 100%; padding-top:10px; background:url(bg.png) repeat; background-size:100% 100%} .swiper-slide-active .min_t{top:20px;opacity:1;} @keyframes danrurz{from { opacity:0;top:0;}to {top:20px;opacity:1;}} @-webkit-keyframes danrurz {from { opacity:0;top:0;}to {top:20px;opacity:1;}} .min_ywly .min_t img{ width:100px} .min_ywly{ padding-bottom:60px} .min_ywly img{border-top-left-radius:90px} .swiper-pagination span {display: block;width: 12%;height: 45px;float: left;border-radius: 0;} .swiper-pagination span:nth-child(1){ background:url(11.png) no-repeat center center; background-size:100% auto} .swiper-pagination span:nth-child(2){ background:url(s2.png) no-repeat center center; background-size:100% auto} .swiper-pagination span:nth-child(3){ background:url(s3.png) no-repeat center center; background-size:100% auto} .swiper-pagination span:nth-child(4){ background:url(s4.png) no-repeat center center; background-size:100% auto} .swiper-pagination span:nth-child(5){ background:url(s5.png) no-repeat center center; background-size:100% auto} .swiper-pagination span:nth-child(6){ background:url(s6.png) no-repeat center center; background-size:100% auto} .swiper-pagination span:nth-child(7){ background:url(s7.png) no-repeat center center; background-size:100% auto} .swiper-pagination-bullet{opacity: var(--swiper-pagination-bullet-inactive-opacity, 1);} .swiper-pagination span:nth-child(1).swiper-pagination-bullet-active{ background:url(s11.png) no-repeat center center!important; background-size:100% auto!important} .swiper-pagination span:nth-child(2).swiper-pagination-bullet-active{ background:url(s22.png) no-repeat center center!important; background-size:100% auto!important} .swiper-pagination span:nth-child(3).swiper-pagination-bullet-active{ background:url(s33.png) no-repeat center center!important; background-size:100% auto!important} .swiper-pagination span:nth-child(4).swiper-pagination-bullet-active{ background:url(s44.png) no-repeat center center!important; background-size:100% auto!important} .swiper-pagination span:nth-child(5).swiper-pagination-bullet-active{ background:url(s55.png) no-repeat center center!important; background-size:100% auto!important} .swiper-pagination span:nth-child(6).swiper-pagination-bullet-active{ background:url(s66.png) no-repeat center center!important; background-size:100% auto!important} .swiper-pagination span:nth-child(7).swiper-pagination-bullet-active{ background:url(22.png) no-repeat center center!important; background-size:100% auto!important} .swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction{ bottom:0!important} }