* { margin:0; padding:0; list-style:none; text-decoration:none; box-sizing:border-box; } .layout { max-width:1600px; margin:0 auto; padding:0 10px } .header_pack { display:flex; justify-content:space-between; align-items:center; } header { width:100%; position:absolute; top:0; left:0; z-index:290; } .logo { height:150px; padding:35px 0; } .logo a { display:block; height:100%; } .logo img { max-height:100%; display:block; } .header_right { display:flex; align-items:center; } .header_search { display:flex; align-items:center; border-bottom:1px solid #fff; padding-bottom:10px; width:150px; } .header_search i { width:18px; height:18px; background:url(../images/search.png) no-repeat center/100% 100%; } .header_search input { width: calc(100% - 18px); padding-left: 10px; font-size: 18px; line-height: 24px; color: #FFFFFF; border:none; background:transparent; } .header_search input::-webkit-input-placeholder { color:#fff; } .nav_btn { width:90px; position:relative; margin-left:30px; cursor:pointer; } .nav_btn img { width:100%; display:block; } .nav_btn::after { content: ""; width: 90px; height: 90px; border: 5px solid #eee; position: absolute; top: 0; left: 0; animation: btn 1s linear infinite; border-radius: 50%; } @keyframes btn { 0%{ opacity:1; transform:scale(1); } 50% { opacity:.5; transform:scale(1.4); } 100% { opacity:0; transform:scale(1.4); } } .banner { position:relative; } .banner img { width:100%; display:block; } .banner_title { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:90%; color:#fff; font-size:60px; line-height:80px; text-align:center; } .news { padding:30px 0 80px; background:url(../images/news_bg.png) no-repeat -260px center/cover; } .public_nav { font-size:16px; line-height:24px; } .public_nav a { color: #333333; } .news_list{ margin:60px -25px 0; display:flex; flex-wrap:wrap; } .news_list li { width:33.3333%; padding:0 25px; margin-bottom:50px; } .news_list li a { display:block; } .news_list_img { overflow:hidden; } .news_list_img img { width: 100%; display: block; transition:all .5s; } .yih { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .erh { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; } .news_list_cont h4 { margin-top: 30px; font-size: 24px; line-height: 32px; color: #000000; } .news_list_cont span { font-size: 16px; line-height: 21px; color: #626262; margin-top:15px; display:block; } .news_list li a:hover img { transform:scale(1.1); } .news_list li a:hover .news_list_cont h4, .news_list li a:hover .news_list_cont span { color: #1686CF; } .newsDetail { padding:30px 0 0; } .newsdetail_pack { display: flex; margin-top: 60px; } .NewsDetail001 { width:calc(100% - 390px); padding-right:60px; margin:0; } .tit_bar { padding-bottom: 20px; border-bottom: 1px solid #E6EDF5; } .newsDetail_right_cont { width:390px; } .newsDetail_right_title h3 { font-size: 36px; line-height: 48px; color: #000000; font-weight:bold; } .newsDetail_right_title p { font-size: 20px; line-height: 23px; color: #F5A100; margin-top:10px; font-style:italic; } .newsDetail_list li { padding:40px 0; position:relative; } .newsDetail_list li::after { content: ""; width: 25%; height: 1px; background: #E6EDF5; position:absolute; bottom:0; left:0; transition:all .5s; } .newsDetail_list li a { display:block; } .newsDetail_list li a h4 { font-size: 24px; line-height: 32px; color: #000000; } .newsDetail_list li a span { font-size: 16px; line-height: 21px; color: #626262; margin-top:15px; display:block; } .NewsDetail001-title h3 { font-size:36px; line-height:46px; } .tit_bar { margin-top:25px; } .newsDetail_list li:hover a h4, .newsDetail_list li:hover a span { color: #1686CF; } .newsDetail_list li:hover::after { width: 100%; background: #005CA6; } .aboutUs { position:relative; } .about_nav { position: absolute; top: -120px; left: 0; width: 100%; z-index: 200; } .about_nav_list { border-radius:30px 30px 0 0; background:#fff; height:120px; display:flex; justify-content:center; align-items:center; border-bottom:solid 1px #eee } .about_nav_list li { margin:0 70px; } .about_nav_list li a { padding-left: 23px; position: relative; font-size: 24px; line-height: 34px; color: #000000; } .about_nav_list li a:hover, .about_nav_list li .active { color: #1686CF; } .about_nav_list li a::before { content: ""; width: 3px; height: 100%; background: #1686CF; position: absolute; left: 0; top: 0; } .aboutUs { padding:99px 0 120px; height:1300px; background:url(../images/aboutbg.png) no-repeat center 426px/100%; } .about_title h3 { font-size: 36px; line-height: 48px; color: #000000; } .about_title p { font-size: 20px; line-height: 23px; color: #F5A100; font-style:italic; } .about_cont { margin-top:60px; margin-left:calc(100% - 1150px); width:1150px; } .about_cont_list { display:flex; justify-content:space-between; } .about_cont_list li h3 { font-size: 28px; line-height: 37px; color: #333333; } .about_cont_list li h3 span { font-size:72px; line-height:82px; font-weight:bold; } .about_cont_list li p { font-size: 20px; line-height: 27px; color: #626262; margin-top:20px; } .about_desc { margin-top: 60px; font-size: 14px; line-height: 24px; color: #333333; } .culture { position:relative; } .culture_plate1 { padding:110px 0 120px; background:url(../images/culturebg.png) no-repeat center/cover; } .culture_title { text-align:center; } .culture_list { display:flex; flex-wrap:wrap; margin:50px -25px 0; } .culture_list li { width:33.333%; padding:0 25px; transition:all 0.5s; } .culture_list li:hover{ -webkit-transform: scale(1.1); -webkit-transition-timing-function: ease-out; -webkit-transition-duration: 750ms; -moz-transform: scale(1.1); -moz-transition-timing-function: ease-out; -moz-transition-duration: 750ms; overflow: hidden; } .culture_list_pack { background:#fff; padding:60px 70px; border-radius:20px; box-shadow:0 0 20px rgba(137,145,154,20%); text-align:center; height:100%; } .culture_list_img { width:72px; height:72px; margin:0 auto; } .culture_list_img img { max-height:100%; display:block; } .culture_list_cont h4 { font-size: 28px; line-height: 37px; color: #2E2E2E; font-weight:bold; margin-top:25px; } .culture_list_cont p { font-size: 20px; line-height: 28px; color: #6F7886; margin-top:30px; } .culture_plate2 { padding:120px 0; } .culture_plate2_pack { margin-top:50px; position:relative; } .arrow { width: 70px; height: 70px; background: #F6F6F6; border-radius: 50%; text-align: center; line-height: 70px; font-size: 24px; color: #000000; position: absolute; top: 50%; transform: translateY(-50%); z-index: 101; cursor:pointer; } .arrow:hover { background:#1686CF; color:#fff; } .arrow_left { left: 50px; padding-left: 5px; } .arrow_right { right: 50px; padding-right: 5px; } .culture_plate2swiper { overflow: hidden; padding-bottom:60px; position:relative; } .culture_plate2swiper .swiper-scrollbar { background: #E6EDF5; width:80%; left:50%; transform:translateX(-50%); opacity:1 !important; height:10px; } .culture_plate2swiper .swiper-scrollbar-drag { background: #1686CF; } .relation_list { margin-top:60px; } .relation_list li { margin-bottom:30px; } .relation_list_pack { padding:38px 53px; border-radius:10px; background:#fff; display:flex; align-items:center; box-shadow:5px 5px 10px rgba(0,75,147,5%); } .relation_list_title { width:calc(100% - 108px); padding-right:60px; display:flex; align-items:center; justify-content:space-between; } .relation_list_title p { font-size: 24px; line-height: 31px; color: #000; width:70%; padding-left:40px; position:relative; } .relation_list_title span { font-size: 16px; line-height: 21px; color: #AEAEAE; } .relation_list_title p::before { content: ""; width: 21px; height: 24px; background: url(../images/file.png) no-repeat center/100% 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .relation_list_btn { display:flex; justify-content:space-between; width:108px; } .relation_list_btn a { display:block; width:44px; } .relation_list_btn a img { width:100%; display:block; } .relation_list_btn a img:last-child { display:none; } .relation_list_pack:hover { background: linear-gradient(to right,#30B9FA , #005BAC); } .relation_list_pack:hover .relation_list_title p, .relation_list_pack:hover .relation_list_title span { color: #fff; } .relation_list_pack:hover .relation_list_btn a img:first-child { display:none; } .relation_list_pack:hover .relation_list_btn a img:last-child { display:block; } .relation_list_pack:hover .relation_list_title p::before { background: url(../images/file2.png) no-repeat center/100% 100%; } .relation_title { margin-top:60px; } .relation_plate2 { margin-top: 100px; padding: 50px 80px; background: #fff url(../images/notic2.png) no-repeat 140px center; display: flex; box-shadow: 5px 5px 10px rgba(0,75,147,5%); border-radius: 10px; border: 1px solid #F6F7F8; } .relation_left_cont { width:460px; } .relation_left_cont h3 { font-size: 100px; line-height: 115px; color: #F5A100; font-weight:bold; } .relation_left_cont h3 span { font-size: 24px; line-height: 31px; color: #000000; } .relation_left_cont p { font-size: 20px; line-height: 26px; color: #000000; } .relation_left_cont p span { color: #F5A100; } .relation_left_cont em { font-size: 18px; line-height: 24px; margin-top: 25px; display: block; color: #999999; } .relation_right_cont { width:calc(100% - 460px); padding-left:145px; display:flex; align-items:center; } .relation_right_cont li { width:25%; text-align:center; position:relative; } .relation_right_cont li::after { content: ""; width: 1px; height: 80px; background: #DDDDDD; position:absolute; top:50%; right:0; transform:translateY(-50%); } .relation_right_cont li:last-child { text-align: right; } .relation_right_cont li:last-child::after { display:none; } .relation_right_cont li:first-child { text-align: left; } .relation_right_cont_pack p { font-size: 18px; line-height: 24px; color: #000000; } .relation_right_cont_pack h3 { font-size: 48px; line-height: 55px; margin-top: 10px; color: #000000; font-weight:bold; } .duty{ padding-bottom:110px; } .duty_list>li { padding-top:109px; } .duty_list_title { font-size: 36px; line-height: 48px; text-align: center; color: #000000; } .duty_list_pack { margin-top:75px; display:flex; position:relative; } .duty_list_img { width:1200px; } .duty_list_img img { width:100%; display:block; } .duty_list_right_cont { width:calc(100% - 1200px); height:100%; text-align:right; } .duty_list_right_cont .active, .duty_list_right_list li:hover h4 { font-size: 34px; line-height: 45px; position: relative; font-weight: bold; color: #000000; } .duty_list_right_cont .active::after, .duty_list_right_list li:hover h4::after{ content: ""; width: 45px; height: 11px; background: url(../images/dian.png) no-repeat center/100% 100%; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } .duty_list_right_list li { position: relative; margin-bottom: 56px; cursor: pointer; } .duty_list_right_list li h4 { font-size: 28px; line-height: 37px; color: #565F6A; padding: 0 60px; transition:all .5s; position:relative; } .duty_list_right_list_cont { position:absolute; bottom:30px; right:0; width:640px; padding:60px; background:#fff; border-radius:6px; box-shadow:0 2px 15px rgba(0,0,0,8%); z-index:5; } .duty_list_right_list_icon { position:absolute; top:-21px; right:60px; width:43px; } .duty_list_right_list_icon img { width:100%; display:block; } .duty_list_right_list_cont h4 { font-size: 30px; line-height: 40px; color: #000000; font-weight:bold; display:flex; align-items:center; justify-content:flex-end; } .culture_plate2swiper_img img { width:100%; height:100%; object-fit:cover; display:block; border-radius:20px; } .duty_list_right_list_cont h4 img { max-width: 35px; display: block; margin-right: 15px; } .duty_list_right_list_cont p { font-size: 18px; line-height: 33px; color: #8B8B8B; margin-top:25px; } .duty_list > li:nth-child(2n) .duty_list_pack { flex-direction: row-reverse; } .duty_list > li:nth-child(2n) .duty_list_right_cont { text-align:left; } .duty_list > li:nth-child(2n) .duty_list_right_list li h4::after { transform: rotate(180deg) translateY(50%); } .duty_list > li:nth-child(2n) .duty_list_right_cont .active::after, .duty_list > li:nth-child(2n) .duty_list_right_list li:hover h4::after { right: auto; left: 0; } .duty_list > li:nth-child(2n) .duty_list_right_list_cont { right:auto; left:0; } .duty_list > li:nth-child(2n) .duty_list_right_list_icon { right:auto; left:60px; } .duty_list > li:nth-child(2n) .duty_list_right_list_cont p { text-align:right; } .products { position:relative; } .products_cont { background:url(../images/probg.png) no-repeat center/cover; } .products_pack { padding:100px 0 130px; text-align:center; } .products_pack h4 { font-size: 40px; line-height: 53px; color: #000000; } .products_pack p { margin-top: 25px; font-size: 18px; line-height: 28px; color: #626262; } .products_plate2_title { display: flex; justify-content: center; background: #F6F9FC; } .products_plate2_title li { padding: 0 50px; font-size: 24px; line-height: 80px; color: #000000; position:relative; cursor:pointer; } .products_plate2_title li::after { content: ""; width: 100%; height: 3px; background: #1686CF; position: absolute; bottom: 0; left: 0; opacity: 0; } .products_plate2_title .active a, .products_plate2_title li:hover a { color: #1686CF; } .products_plate2_title .active::after, .products_plate2_title li:hover::after { opacity: 1; } .pro_contswiper img { width:100%; display:block; } .pro_swiper_cont { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:90%; } .pro_swiper_cont h4 { font-size: 48px; line-height: 64px; color: #000000; } .pro_swiper_cont p { font-size: 18px; line-height: 28px; color: #626262; margin-top:50px; max-width:560px; } .pro_contswiper { overflow:hidden; } .products { padding-bottom:120px; } footer { padding:100px 0 20px; background:url(../images/footer_bg.png) no-repeat center/100% 100%; } .footer_pack { display: flex; border-top: 1px solid #E6EDF5; margin-top:30px; padding:45px 0 50px; justify-content:space-between; align-items:center; } .footer_pack_fl{ display:flex; justify-content:space-between; width:calc(100% - 455px) } .footer_map { position:relative; width: 455px; } .footer_map .dh { position: absolute; width: 7px; height: 7px; background-color: #1686CF; border-radius: 50%; box-shadow: 0 2px 8px 2px rgba(22, 134, 207, 0.5); animation: asd 1s linear infinite alternate } .footer_map .dh1{ top: 41px; left: 62px; } .footer_map .dh2{ top: 144px; left: 112px; } .footer_map .dh3{ top: 69px; left: 237px; } .footer_map .dh4{ top: 124px; left: 258px; } .footer_map .dh5{ top: 87px; right: 94px; } .footer_map .dh6{ top: 84px; right: 49px; } .footer_map .dh7{ top: 167px; right: 65px; } @keyframes asd{ 0% { box-shadow: 0 0px 0px 0px rgba(22, 134, 207, 0.5); } 100% { box-shadow: 0 2px 20px 8px rgba(22, 134, 207, 0.8); } } .footer_map img { width: 100%; display: block; } .footer_navlist { width: 60%; padding: 20px 50px 20px 50px; border-left: 1px solid #E6EDF5; display:flex; justify-content:space-between; } .footer_nav h3 { font-size: 20px; line-height: 27px; color: #626262; font-weight:600; margin-bottom:10px; } .footer_nav a { font-size: 16px; line-height: 48px; color: #999999; display:block; } .footer_code { width:100px; } .footer_code img { width:100%; margin:10px 0; display:block; } .footer_phone_cont { display:flex; align-items:center; padding:25px 0; } .footer_phone_cont i { width: 44px; height: 44px; display: block; background: url(../images/phone.png) no-repeat center/100% 100%; margin-right:15px; } .footer_phone_cont p { font-size: 20px; line-height: 27px; color: #F39839; } .footer_phone_cont p span { display: block; font-size: 16px; line-height: 21px; color: #626262; } .copyright { border-top: 1px solid #E6EDF5; } .copyright a { display: block; text-align: center; font-size: 16px; line-height: 48px; color: #999999; } .bannerswiper { overflow:hidden; position:relative; height:100vh; } .bannerswiper a { display:block; position:relative; height:100%; } .bannerswiper img { width:100%; display:block; height:100%; object-fit:cover; } .bannerswiper .data-div{ height:100% } .home_banner_title { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 9; width:100%; } .home_banner_title h4 { font-size: 60px; line-height: 80px; color: #FFFFFF; text-shadow:0 0 10px rgba(0,0,0,.5); } .home_banner_title p { font-size: 24px; line-height: 28px; color: #FFFFFF; margin-top: 20px; text-shadow: 0 0 10px rgba(0,0,0,.4); } .home_banner_title span { display: block; width: 155px; line-height: 56px; border-radius: 10px; text-align: center; margin-top: 50px; background: linear-gradient(to right, #21F6FE,#004DA6); color: #fff; font-size: 16px; } .bannerswiper .swiper-pagination { width:auto; bottom:120px; right:10%; left:auto; } .bannerswiper .swiper-pagination-bullet { width: 110px; text-align: center; border-radius: 0; position: relative; background: transparent; height: auto; padding-bottom: 10px; font-size: 16px; line-height: 21px; color: #FFFFFF; opacity:1; } .bannerswiper .swiper-pagination-bullet::after { width:100%; height:2px; opacity:.3; background:#fff; position:absolute; bottom:0; left:0; content:""; } .bannerswiper .swiper-pagination-bullet-active::after { opacity:1; } .home_plate1 { background:url(../images/homebg.png) no-repeat center/cover; } .home_plate1_list { display:flex; } .home_plate1_list li { transition:all 0.5s; height:100vh; width:25%; position:relative; } .home_plate1_img { opacity: 0; height: 100%; transition: all .5s; } .home_plate1_img img, .home_plate1_img video{ width: 100%; height:100% !important; object-fit:cover; display: block; } .home_plate1_cont { padding:0 100px 48px; width:100%; position:absolute; top:50%; left:0; transform:translateY(-50%); } .home_plate1_cont h3 { font-size: 54px; line-height: 72px; color: #000000; } .home_plate1_cont h4 { font-size: 20px; line-height: 27px; color: #626262; margin-top:5px; text-transform:uppercase; } .home_plate1_cont::after { content: ""; width: calc(100% - 200px); height: 2px; background: #E6E6E6; position:absolute; bottom:0; left:100px; transition:all .5s; } .home_plate1_list .active { transition: all 0.5s; width: 50%; } .home_plate1_list .active .home_plate1_img { opacity: 1; } .home_plate1_list .active .home_plate1_cont h3, .home_plate1_list .active .home_plate1_cont h4 { color: #fff; } .home_plate1_list .active .home_plate1_cont::after { background:#fff; } .home_plate2 { padding:117px 0; background:url(../images/homebg2.png) no-repeat 50px center/40%; transition:all 1s; } .home_plate2.active { background: url(../images/homebg2.png) no-repeat 160px center/40%; } .home_plate2_pack { display: flex; } .home_plate2_pack>div { width:50%; } .home_plate2_left { position:relative; height:100%; } .home_plate2_video { position: absolute; top: 0; right: -58px; } .home_plate2_right .home_plate2_cont { padding:0 75px 0 120px; } .home_plate2_title h4 { font-size: 36px; line-height: 48px; color: #000000; } .home_plate2_title p { font-size: 20px; line-height: 23px; color: #F5A100; font-style:italic; } .home_plate2_desc { font-size: 14px; line-height: 24px; color: #333333; margin-top:30px; } .home_plate2_cont a { font-size: 16px; line-height: 21px; color: #1686CF; display:flex; margin-top:20px; align-items:center; justify-content:flex-end; } .home_plate2_cont a i { width:24px; height:24px; background:url(../images/arr.png) no-repeat center/100% 100%; margin-left:10px; display:block; } .home_plate2_img { margin-top:16px; } .home_plate2_img img { width: 100%; display: block; } .home_plate3 { background:url(../images/prob.png) no-repeat center/cover; } .home_plate3_table { display:flex; } .home_plate3_table div { width: 50%; font-size: 36px; color: #000000; line-height: 150px; position:relative; text-align:center; } .home_plate3_table .active { color:#1686CF; } .home_plate3_table .active::after { width: 100%; height: 3px; background: #1686CF; content: ""; position: absolute; bottom: 0; left: 0; } .home_plate3_cont{ padding:125px 0 215px; } .home_plate3_pack { display:flex; justify-content:space-between; } .home_plate3_left_cont { display:flex; width:50% } .home_plate3_img{ width:50%; padding-left:100px } .home_plate3_left_table li { width: 100px; height: 100px; display: flex; justify-content: center; align-items: center; border-radius: 50%; border: 3px solid transparent; background: transparent; margin-bottom: 50px; cursor: pointer; } .home_plate3_left_table li:last-child { margin-bottom:0; } .home_plate3_left_table li img { width:35px; height:35px; display:block; } .home_plate3_left_table .active { background:#fff; border-color:#1686CF; } .home_plate3_left_text { width:calc(100% - 100px); padding-left:60px } .home_plate3_left_texts h4 { font-size: 28px; line-height: 37px; color: #1686CF; } .home_plate3_left_texts h3 { font-size: 48px; line-height: 64px; color: #000000; margin-top:15px; } .home_plate3_left_texts p { font-size: 18px; line-height: 28px; color: #626262; margin-top:25px; text-align: justify; } .home_plate3_left_text_table { display:flex; justify-content:space-between; margin-top:75px; } .home_plate3_left_text_table li { width: 32%; font-size: 16px; line-height: 24px; padding-bottom: 16px; text-align: center; position: relative; border-bottom: 2px solid #FFFFFF; cursor:pointer; } .home_plate3_left_text_table .active { color:#1686CF; border-bottom-color:#1686CF; } .home_plate3_left_text_table .active a { color: #1686CF; } .home_plate3_left_text_table a:hover { color: #1686CF; } .home_plate3_pack { display: none; } .home_plate4 { padding-top:119px; } .aboutUs2 { position: relative } .culture { background: url(../images/ab.png) no-repeat center/cover; margin-top: 60px; display: flex; } .culture li { width:33.333%; transition:all 0.5s; border-left:solid 2px #fff } .culture li:first-child{ border:none } .culture_pack { padding:185px 70px; } .culture_icon { width: 100px; height: 100px; margin: 0 auto; transition: all 0.5s } .culture_icon img { max-height:100%; display:block; } .culture_cont { text-align: center; transition: all 0.5s } .culture_cont h4 { font-size: 28px; line-height: 37px; color: #FFFFFF; margin-top: 35px; } .culture_cont p { font-size:18px; line-height:24px; color:#FFFFFF; margin-top:35px; opacity:0; } .culture li.cur .culture_pack { background-color:rgba(22,134,207,70%); transition:all 0.5s; height:100% } .culture li.cur .culture_cont p { opacity: 1; } .culture li.cur .culture_icon { margin-top: -20px; transition: all 0.5s } .culture li.cur .culture_cont { margin-top: -20px; transition: all 0.5s } .home_news { padding: 119px 0 100px; } .home_newsswiper { position:relative; margin-top:50px; overflow:hidden; padding:0 220px } .home_newsswiper a { display:block; } .home_newsswiper .swiper-button-next, .home_newsswiper .swiper-button-prev { top: 0; width: 200px; height: 100%; } .home_newsswiper .swiper-button-next { right: 0; } .home_newsswiper .swiper-button-next:before{ content:''; position:absolute; width:100%; height:100%; z-index:-1; background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, .5) 30%, rgba(255, 255, 255, .8) 100%); } .home_newsswiper .swiper-button-prev { left: 0; } .home_newsswiper .swiper-button-prev:before { content: ''; position: absolute; width: 100%; height: 100%; z-index: -1; background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, .5) 30%, rgba(255, 255, 255, .8) 100%); } .home_newsswiper_img img { width: 100%; display: block; } .home_newsswiper_cont h4 { font-size:24px; line-height:32px; color:#000; margin-top:30px; } .home_newsswiper_cont span { font-size: 16px; line-height: 21px; color: #626262; display:block; margin-top:15px; } .home_newsbtn { width: 155px; line-height: 56px; text-align: center; margin: 50px auto 0; box-shadow: 0 5px 10px rgba(0,75,147,40%); background: linear-gradient(to right, #21F6FE,#004DA6); border-radius:10px; color:#fff; font-size:16px; } .home_newsbtn a { color:#fff; } .video_shadow { width:100%; height:100vh; position:fixed; top:0; left:0; background:rgba(0,0,0,.5); display:none; z-index:300; } .video_cont{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:100%; height:100%; } .video_cont video { width:100%; height:100%; object-fit:cover; } .video_cont .video_cha { font-size:50px; transform:rotate(45deg); color:#fff; font-weight:300; position:absolute; top:0px; line-height:60px; right:10px; cursor:pointer; z-index:20; } .header2_pack { position:fixed; width:100%; top:20px; left:50%; transform:translateX(-50%); background:rgba(255,255,255,.9); border-radius:20px; display:flex; align-items:center; justify-content:space-between; padding:0 50px; box-shadow:0 0 15px rgba(0,0,0,.1); transition:all 0.5s } .w_nav { display:flex; } .w_nav>li{ padding:0 30px; position:relative; } .w_nav > li>a { display:block; font-size:18px; line-height:100px; } .w_nav > li > a:hover, .w_nav > li > a.active { color: #1686CF; } .er_nav { position: absolute; top: 100%; left: 0; width: 200px; background: #fff; box-shadow: 0 10px 15px rgba(0,0,0,.1); display: none; text-align: center; padding: 10px 0; width: 200px; text-align: center; left: -30%; } /*.pro_ernav { }*/ .er_nav li a { display: block; padding: 0 10px; font-size: 16px; line-height: 40px; color:#666; } .er_nav li a:hover { color: #1686CF; } .logo2 { height: 100px; padding: 10px 0; } .logo2 a { display:block; height:100%; } .logo2 img { max-height:100%; display:block; } .header2_pack { display:none; } .header2_pack .header_search { border-bottom-color: #333; } .header2_pack .header_search input::-webkit-input-placeholder { color:#333; } .header2_pack .header_search input { color:#333; } .header2_pack .header_search i { background-image: url(../images/search2.png); } .langage { font-size:18px; line-height:32px; color:#333; } .langage a { color:#333; } .langage a:hover, .langage .active{ color: #1686CF; } .po { position: absolute; left: 0; } @media(max-width:1700px) { .layout { max-width:1400px; } .home_plate1_cont h3 { font-size:48px; line-height:64px; } .home_plate1_cont { padding:0 60px 40px; } .duty_list_img { width:1000px; } .duty_list_right_cont { width:calc(100% - 1000px); } .relation_right_cont_pack h3 { font-size:45px; line-height:50px; } .relation_right_cont { padding-left:80px; } .home_plate1_cont::after { width:calc(100% - 120px); left:60px; } } @media(max-width:1500px) { .layout { max-width: 1200px; } .home_plate1_cont h3, .home_plate3_left_texts h3, .pro_swiper_cont h4 { font-size: 40px; line-height: 50px; } .home_plate3_left_texts h4, .culture_cont h4 { font-size: 24px; line-height: 34px; } .culture_icon{ width:80px; } .culture_cont h4 { margin-top:20px; } .culture_pack { padding:100px 50px; } .home_newsswiper_cont h4 { font-size:20px; line-height:30px; } .about_cont_list li h3 span { font-size:62px; line-height:72px; } .arrow { width:50px; height:50px; line-height:50px; } .culture_list_pack { padding:40px; } .banner_title { font-size:50px; line-height:70px; } .nav_btn { width:60px; } .nav_btn::after{ width:60px; height:60px; } .pro_swiper_cont p { margin-top:30px; } .home_banner_title h4 { font-size:50px; line-height:60px; } } @media(max-width:1400px) { .layout { max-width:1100px; } .w_nav > li > a, .header_search input { font-size: 16px; } .w_nav > li { padding:0 15px; } .home_banner_title h4 { font-size:40px; line-height:50px; } .home_banner_title p { font-size:18px; line-height:28px; } .home_banner_title span { line-height:45px; margin-top:30px; width:130px; } .home_plate1_cont h3, .home_plate3_left_texts h3, .pro_swiper_cont h4 { font-size:35px; line-height:45px; } .home_plate2_right .home_plate2_cont { padding:0 50px 0 60px; } .home_plate2_title h4 { font-size:30px; line-height:40px; } .home_plate2.active { background-size:30%; } .home_plate3_table div { line-height:100px; font-size:30px; } .home_plate3_cont, .home_news { padding: 80px 0; } .home_plate3_left_table li { width:80px; height:80px; } .home_plate4 { padding-top:80px; } .about_title h3 { font-size:30px; line-height:40px; } .home_newsbtn { line-height:45px; width:130px; } .footer_code { display:none; } .footer_navlist { padding:20px 30px; width:70%; } .footer_map { width:400px; } .footer_pack_fl { width:calc(100% - 400px); } .footer_phone_cont p, .footer_nav h3 { font-size: 18px; } .footer_nav a { line-height:40px; } .footer_map .dh1 { top: 35px; left: 54px; } .footer_map .dh2 { top: 126px; left: 98px; } .footer_map .dh3 { top: 60px; left: 208px; } .footer_map .dh4 { top: 108px; left: 226px; } .footer_map .dh5 { top: 76px; right: 83px; } .footer_map .dh7 { top: 146px; right: 57px; } .footer_map .dh6 { top: 73px; right: 43px; } .about_nav_list li a { font-size:20px; line-height:30px; } .about_nav_list { height:80px; } .about_nav { top:-80px; } .aboutUs { padding:80px 0; } footer { padding:80px 0 20px; } .home_plate2 { padding:80px 0; } .about_cont { width:100%; margin:60px 0 0; } .aboutUs { max-height:1000px; } .about_cont_list li h3 span { font-size:52px; line-height:62px; } .culture_list_cont h4 { font-size:22px; line-height:32px; } .culture_list_cont p { font-size:16px; line-height:26px; } .culture_plate2, .culture_plate1, .products_pack { padding: 80px 0; } .duty_list > li { padding-top:80px; } .duty { padding-bottom:80px; } .er_nav { left:60%; } .products_pack h4 { font-size:30px; line-height:40px; } .products_plate2_title li { font-size:20px; line-height:60px; } .relation_list_pack { padding:20px 40px; } .relation_list_title p { font-size:20px; line-height:30px; } .relation_plate2 { margin-top:80px; padding:30px; } .relation_left_cont h3 { font-size:70px; } .relation_left_cont { width:400px; } .relation_right_cont { width:calc(100% - 400px); } .relation_right_cont_pack h3 { font-size:35px; line-height:45px; } .relation_right_cont_pack p { font-size:16px; } .news_list { margin:40px -10px 0; } .news_list li { padding: 0 10px; margin-bottom:20px; } .news_list_cont h4 { margin-top:20px; font-size:18px; line-height:28px; } .footer_pack { padding:20px 0; } .banner_title { font-size:40px; line-height:60px; } .newsDetail_list li a h4 { font-size:20px; line-height:30px; } .newsDetail_right_title h3, .NewsDetail001-title h3 { font-size: 30px; line-height: 40px; } .newsDetail_right_cont { width:300px; } .NewsDetail001 { width:calc(100% - 300px); } .duty_list_img { width:800px; } .duty_list_right_cont { width:calc(100% - 800px); } .duty_list_right_cont .active, .duty_list_right_list li:hover h4 { font-size:28px; line-height:38px; } .duty_list_right_list li h4 { font-size:20px; line-height:30px; padding:0 30px; } .duty_list_right_list li{ margin-bottom:30px; } .duty_list_right_list_cont{ padding:30px; } .duty_list_right_list_cont h4 { font-size:20px; line-height:30px; } .duty_list_right_list_cont h4 img { max-width:30px; } .duty_list_right_list_cont p { font-size:16px; line-height:26px; } } @media(max-width:1000px) { .layout { max-width:100%; } .logo2 { display:none; } .header2_pack .header_search { display: none; } .w_nav { display:block; } .header2_pack { padding:0 20px; } .logo { height:60px; padding:10px 0; } .banner img { height:200px; object-fit:cover; } .nav_btn::after { display:none; } .nav_btn{ width:40px; } .w_nav > li > a { line-height:50px; } header>div:last-child { position:absolute; top:100%; left:0; width:100%; } .header2_pack { position:static; transform:none; } .langage { text-align:center; font-size:16px; } .er_nav { position:static; background:transparent; width:100%; box-shadow:none; } .er_nav li a { text-align:left; } .banner_title { font-size:25px; line-height:35px; } .relation_title, .relation_list { margin-top: 30px; } .about_title h3 { font-size:20px; line-height:30px; } .about_title p { font-size:16px; line-height:26px; } .relation_list_pack { padding:10px 20px; } .relation_list_btn a { width:30px; } .relation_list_btn { width:30px; } .relation_list_title { width:calc(100% - 30px); } .relation_list_title span { display:none; } .relation_list_title p { width:100%; font-size:16px; line-height:26px; } .relation_list li { margin-bottom:15px; } .relation_plate2 { margin-top:30px; display:block; padding:15px; } .relation_left_cont h3 { font-size:40px; line-height:60px; } .relation_left_cont h3 span, .products_pack h4 { font-size: 20px; line-height: 30px; } .relation_left_cont { width:100%; } .relation_left_cont p, .products_pack p { font-size: 16px; line-height: 26px; } .products_pack p { margin-top:10px; } .relation_left_cont em { font-size: 14px; line-height: 24px; margin-top: 10px; } .relation_right_cont { width:100%; padding-left:0; flex-wrap:wrap; margin-top:20px; } .relation_right_cont li { width:50%; margin-bottom:20px; text-align:center !important; } .relation_right_cont li:nth-child(2)::after { display:none; } footer { padding:30px 0 0; } .footer_navlist { display:none; } .footer_pack_fl { width: 100%; display: block; } .footer_map { display:none; } .footer_code{ display:flex; justify-content:space-around; margin-top:30px; width:100%; } .footer_code img { width:100px; } .footer_phone_cont{ padding:10px 0; } .news_list li { width:100%; padding:0; } .news_list { margin:20px 0 0; } .news{ padding:30px 0; } footer { background-size:cover; } .about_nav_list li a{ font-size:16px; line-height:26px; padding-left:10px; } .about_nav_list li { margin:0; } .about_nav_list { height:60px; } .about_nav { top:0; } .about_nav_list{ border-radius:0; } .about_nav_list{ justify-content:space-between; flex-wrap:wrap; padding:0 10px; } .culture_plate2, .culture_plate1 { padding:30px 0; } .products_pack { padding-bottom:30px; } .products_plate2_title { flex-wrap:wrap; justify-content:center; } .products_plate2_title li { width:50%; } .products_plate2_title li { font-size:16px; line-height:50px; padding:0 10px; text-align:center; } .pro_swiper_cont p{ max-width:100%; width:100%; font-size:16px; line-height:26px; margin-top:10px; color:#000; } .home_plate1_cont h3, .home_plate3_left_texts h3, .pro_swiper_cont h4 { font-size:25px; line-height:35px; } .products { padding-bottom:30px; } .pro_swiper_cont { width:90%; } .about_cont_list li h3 span { font-size:30px; line-height:40px; } .about_cont_list li h3{ font-size:16px; line-height:26px; } .about_cont_list li p{ font-size:16px; line-height:26px; margin-top:10px; } .about_desc{ margin-top:20px; } .aboutUs { max-width:700px; } .aboutUs { background-position:center 700px; } .culture_plate1 { padding-top:80px; } .culture_list{ margin:30px 0 0; } .culture_list li { width:100%; padding:0 ; margin-bottom:20px; } .arrow_right { right:10px; } .arrow_left { left:10px; } .duty_list_title { font-size:25px; line-height:35px; } .duty_list_pack{ margin-top:30px; } .duty_list_pack { display:block; } .duty_list_img { width:100%; } .duty_list_right_cont, .duty_list_right_list_cont { width: 100%; } .duty_list_right_list_cont, .duty_list_right_list_icon { position: static; } .duty_list_right_list_icon { margin-left:calc(100% - 43px); } .duty_list_right_list_cont h4{ margin-top:20px; font-size:18px; line-height:28px; } .duty_list_right_cont .active, .duty_list_right_list li:hover h4{ font-size:25px; line-height:35px; } .duty_list_right_cont .active::after, .duty_list_right_list li:hover h4::after{ display:none; } .duty_list_right_list li h4 { padding:0 10px; } .bannerswiper { height:250px; } .bannerswiper .swiper-pagination { display:none; } .home_banner_title { width:90%; } .home_banner_title h4{ font-size:23px; line-height:35px; } .home_banner_title p { font-size:16px; line-height:25px; margin-top:0; } .home_banner_title span { display:none; } .home_plate1_list { display:block; } .home_plate1_list li{ height:30vh; width:100%; } .home_plate1_list .active { width:100%; } .home_plate1_cont h4 { font-size:16px; line-height:26px; } .home_plate2 { padding:30px 0; } .home_plate2_pack { display:block; } .home_plate2_pack > div { width:100%; } .home_plate2_video { position:static; } .home_plate2_right .home_plate2_cont { padding:10px 0 0; } .home_plate2_title h4 { font-size:20px; line-height:30px; } .home_plate2_title p { font-size:16px; line-height:26px; } .home_plate2_cont a { font-size:14px; } .home_plate3_table div { font-size:25px; line-height:60px; width:100%; } .home_plate3_table { display:block; } .home_plate3_cont, .home_news { padding:30px 0; } .home_plate3_left_cont { width:100%; display:block; } .home_plate3_left_table { display:flex; justify-content:space-between; } .home_plate3_left_table li { margin-bottom:0; width:60px; height:60px; } .home_plate3_left_text { width:100%; margin-top:40px; padding:0; } .home_plate3_left_text_table { margin-top:50px; } .home_plate3_img { width:100%; padding:0; margin-top:30px; } .home_plate4 { padding-top:30px; } .culture { margin-top:30px; display:block; } .culture li { width:100%; } .culture_pack { padding:50px 30px; } .home_newsswiper .swiper-button-prev:before, .home_newsswiper .swiper-button-next:before { display: none; } .home_newsswiper { padding: 0 10px; margin-top:30px; } .home_newsswiper .swiper-button-next, .home_newsswiper .swiper-button-prev { width:27px; } .home_newsswiper .swiper-button-prev { left:10px; } .home_newsswiper .swiper-button-next { right:10px; } .home_newsswiper_cont h4 { font-size:16px; line-height:26px; margin-top:10px; } .home_newsswiper_cont span { font-size:14px; line-height:24px; margin-top:5px; } .home_newsbtn { margin-top:30px; } header.active { position:sticky; top:0; } }