﻿body { font-family: 思源黑体, "Open Sans", sans-serif; font-size: 14px; color: #333; overflow-x:hidden;}

input,
select,
textarea { font-family: 微软雅黑, "Open Sans", sans-serif; font-size: 1em; }

input[type="button"],
input[type="submit"],
input[type="reset"] { -webkit-appearance: none; }
 

textarea { -webkit-appearance: none; }

.wrap { max-width: 1300px; width: 96%; margin: 0 auto; position: relative; }
a,
a:link { text-decoration: none; color: #000; }
a:hover, .on>a { color: #0072BB; }
.header{padding:30px 0;box-shadow:0 0 10px rgba(0,0,0,0.1); line-height:40px;}
.header .wrap{ max-width:1400px;height:40px; display:flex; align-items:center;}
.header{z-index:10; position:fixed; top:0; left:0;width:100%;}
.header.fixed{ padding:15px 0;background:#fff;}
.header.fixed .menu li a{ color:#333}
.header.fixed .menu li a:after{ background-image:url(../img/icon1-1.png)}
.header.fixed .menu li:hover a,.header.fixed .menu li.on a{ color:#56bcc1}
.header.fixed .logo{ background:url(../img/logo-1.png) no-repeat center center}
.menu li{display:inline-block;font-size:16px;margin-left:60px;}
.menu li a{color:#fff;display:block;position:relative;} 
.menu li a:after{ content:'';display:block; position:absolute; bottom:0; left:0;margin:0 auto; width:0%; right:0; background:url(../img/icon1.png) no-repeat center center;height:4px;}
.menu li:hover a:after,.menu li.on a:after{width:100%;}
.logo{ background:url(../img/logo.png) no-repeat center center}
.logo img{ opacity:0}
.swiper1 .swiper-slide{ background-position:center center;background-size:cover; height:100vh;width:100%;}
.swiper1 .swiper-slide img{ opacity:0}
.swiper1:after{z-index:-1; content:'';display:block; position:absolute; top:0;width:100%; height:150px; background:linear-gradient(to bottom,#000,transparent);opacity:0.1}
.swiper1 .text{ position:absolute;color:#fff; top:50%; left:0;width:100%; text-align:center; transform:translateY(-50%)}
.swiper1 .text h2{font-size:54px;margin-bottom:1em;}
.swiper1 .text h3{font-size:38px;font-weight:100;display:flex; align-items:center; justify-content:center;}
.swiper1 .text h3:after,.swiper1 .text h3:before{ content:'';display:block;width:53px; height:1px; background:#fff;margin:0 20px;}
.swiper1 .swiper-pagination-bullet{width:44px; height:41px;background:url(../img/icon2.png) no-repeat center center;opacity:1;}
.swiper1 .swiper-pagination-bullet-active{ background:url(../img/icon2-1.png) no-repeat center center} 

.page{padding:150px 0;overflow:hidden; position:relative;z-index:1;}
.page.on{padding-bottom:0}
.page_tit{ margin-bottom:87px; text-align:center;}
.page_tit h3{font-size:42px;color:#0a3c4b;position:relative;}
.page_tit h3:after{ content:'';display:block;width:50px; height:3px; background:#56bcc1;margin:0 auto; margin-top:37px;}
.page_tit_fff h3{color:#fff;}
.page_tit_fff h3:after{ background:#fff;}
.swiper2{display:flex;}
.swiper_dots{width:268px; margin-right:30px;}
.swiper_dots li{cursor:pointer; line-height:66px;display:flex; align-items:center; border:1px solid #eee;margin-bottom:13px;padding-left:30px;padding-right:20px;font-size:18px;}
.swiper_dots li span{display:block; flex:1;color:#2c2c2c}
.swiper_dots li:before{content:'';display:block;width:3px; height:3px; background:#bfbfbf;margin-right:15px;}
.swiper_dots li:after{ display:block;opacity:0; width:20px;height:20px; content:'';background:url(../img/icon3.png) no-repeat center center;}
.swiper_dots li:last-child{ margin-bottom:0;}
.swiper_dots li:hover:after,.swiper_dots li.on:after{ opacity:1;}
.swiper_dots li:hover,.swiper_dots li.on{ background:#56bcc1;border-color:#56bcc1}
.swiper_dots li:hover span,.swiper_dots li.on span{color:#fff;}
.swiper_dots li:hover:before,.swiper_dots li.on:before{background:#fff;}
.swiper_dots li:hover:after,.swiper_dots li.on:after{ opacity:1;}
.swiper2 .swiper{ flex:1; }

.swiper-wrapper img{display:block;}
.swiper2 .text{ position:absolute; bottom:0; left:0;width:550px;max-width:100%; box-sizing:border-box; padding:35px 60px;z-index:2;background:rgba(255,255,255,0.8); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);}
.swiper2  .swiper-slide{ position:relative;height:474px;background-size:cover}
.swiper2  .swiper-slide img{ opacity:0}
.swiper2 .text h3{ font-size:30px;}
.swiper2 .text h3:after{ content:'';display:block; width:36px; height:2px; background:#000;margin:20px 0}
.swiper2 .text p{ line-height:28px; color:#404343; font-size:16px;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.page_bg1:after{content:'';z-index:-1; height:430px; background:url(../img/bg1.jpg) no-repeat center center; background-size:cover;position:absolute; top:0;left:0;width:100%;}
 
.swiper3 .swiper-slide{padding:15px;margin-bottom:20px; box-sizing:border-box; }
.swiper3 .box{padding:10px 0; background:#fff; box-shadow:0 0px 15px rgba(0,0,0,0.08);border-radius:5px; text-align:center;padding-bottom:50px;}
.swiper3 .box .icon img{ margin:0 auto;}
.swiper3 .box .icon{padding:50px 0;}
.swiper3 .box  h3{ font-size:24px;color:#2c2c2c;}
.swiper3 .box  h3:after{ content:'';display:block; width:30px; height:1px; background:#242828;margin:25px auto}
.swiper3 .box  p{height:96px; line-height:32px; font-size:16px;color:#787b7b;}
.swiper_box{ position:relative;}
.swiper_box .swiper-button{ width:40px; height:78px;text-align:center; line-height:78px;font-size:20px; position:absolute;top:50%; margin-top:-39px;background:#cfd1d1;z-index:1;border-radius:10px;cursor:pointer;}
.swiper_box .swiper-button:after{ font-family: swiper-icons;color:#fff;}
.swiper_box .swiper-button.prev{ left:-70px;}
.swiper_box .swiper-button:hover{ background:#56bcc1}
.swiper_box .swiper-button.prev:after{ content:'prev'}
.swiper_box .swiper-button.next{ right:-70px;}
.swiper_box .swiper-button.next:after{ content:'next'}
.swiper4_box{width:200%;overflow:hidden; margin:50px;margin-top:0;padding-bottom:50px; box-sizing:border-box;z-index:1}
.swiper_bg{ position:absolute; top:0; left:0; width:100%; height:100%;background:linear-gradient(to right,#f1f9fb,#fff);z-index:-1;}
.swiper4{ max-width:815px;margin-left:0;overflow:initial;}
.tit_txt{ position:absolute; top:0; right:100%;text-align:center;}
.swiper_cur{margin-left:70px;padding-top:20px; height:85px; display:flex; align-items:center;}
.swiper_cur .cur{width:24px; height:14px; background:url(../img/icon9.png) no-repeat left center;opacity:.3;cursor:pointer;}
.swiper_cur .cur:hover{ opacity:1;}
.swiper_cur .next1{ transform:rotate(180deg)}
.swiper_cur .index{width:120px;text-align:center;color:#56bcc1; font-size:36px;font-weight:bold;;}
.swiper4_box .box{padding:20px; }
.swiper4_box .img{ box-shadow:0 0 20px rgba(131,166,170,0.3);background:#56bcc1}
.swiper4_box .text{line-height:32px; font-size:16px; color:#333;margin-top:20px;opacity:.5}
.swiper4_box .img img{display:block; margin-left:0;}
.swiper4 .swiper-slide-active .text{opacity:1;}
.lc_list  li{width:20%; float:left;position:relative;}
.lc_list  li:after{ content:'';display:block; clear:both; width:115px; height:17px; background:url(../img/icon15.png) no-repeat center center;position:absolute; left:100%;top:30px;margin-left:-60px;}
.lc_list  li .icon{ width:70px;margin:0 auto;position:relative;}
.lc_list  li .icon span{ position:absolute; top:-15px; left:-40px; width:22px; height:22px; border-radius:100%; border:4px solid #fdecc8;background:#fac148;color:#fff;text-align:center; line-height:22px;}
.lc_list  li:last-child:after{ display:none;}
.lc_list  .icon{ text-align:center;height:125px;}
.lc_list h3{ margin-bottom:20px; line-height:52px; background:#56bcc1;color:#fff; font-size:22px; border-radius:5px;text-align:center;box-shadow:0 0 20px rgba(31,119,123,0.2)}
.lc_list .text{ width:90%;max-width:230px; margin:0 auto; line-height:32px;font-size:16px;color:#3f4747}
.page_bg2{ background:url(../img/bg2.jpg) no-repeat top center #f6f8f9;background-size:100% auto}
.qa_list{max-width:1100px;margin:0 auto;}
.qa_list li{margin-bottom:10px;background:#fff;padding:0 30px; box-shadow:0 0 10px rgba(134,149,150,0.05)}
.qa_list .tit{cursor:pointer; display:flex; height:62px;align-items:center;}
.qa_list .tit:hover h3,.qa_list .on .tit h3{color:#56bcc1}
.qa_list .on .tit:after{ transform:rotate(180deg); background:url(../img/icon17-1.png) no-repeat center center;}
.qa_list .tit span{width:21px; height:21px; background:url(../img/icon16.png) no-repeat center center;text-indent:-20px;overflow:hidden;margin-right:15px;}
.qa_list .tit h3{ flex:1; font-size:16px;color:#2c2c2c;font-weight:bold;}
.qa_list .tit:after{ content:'';display:block;width:17px; height:17px; background:url(../img/icon17.png) no-repeat center center;}
.qa_list .drop{transition:all 0s; display:none; border-top:1px solid #f2f2f2;padding:15px 20px;font-size:15px;color:#2c2c2c; line-height:26px; padding-left:35px;}

.footer{text-align:center; background:url(../img/bg3.jpg) no-repeat bottom center #fff; }
.footer h3{ font-size:24px;color:#0a3c4b; font-weight:100;}
.footer h3:after{ display:block; margin:30px auto;width:50px; height:2px; background:#56bcc1;content:'';}
.footer h2{ font-size:46px;color:#0a3c4b;font-weight:100;letter-spacing:5px;margin-bottom:60px;}
.footer .ewm{ width:147px; height:147px; margin:0 auto; padding:15px; background:#fff;border-radius:20px; box-shadow:0 2px 10px rgba(0,0,0,0.05)}
.footer .ewm img{width:100%; display:block;}
.foot{ height:100px; display:flex; justify-content:center; align-items:center;background:rgba(63,162,167,0.6);backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px);}


@media only screen and (max-width: 1000px) {
    .menu li{margin-left:40px;}
    .swiper1 .text h2{ font-size:30px;}
    .swiper1 .text h3{font-size:20px;}
    .page{padding:50px 0}
    .page_tit h3{font-size:30px;}
    .page_tit h3:after{margin-top:20px;}
    .page_tit{margin-bottom:50px;}
    .swiper_dots{width:200px;margin-right:15px;}
    .swiper_dots li{padding:0 15px;line-height:50px;}
    .swiper2 .swiper-slide{height:377px;}
    .swiper2 .text{padding:30px;}
    .swiper2 .text h3{ font-size:24px;}
    .tit_txt{display:none;}
    .swiper4_box{margin:20px;width:auto}
    .swiper4{width:100%;}
    .swiper_cur{height:50px;margin-left:30px;}
    .lc_list li{ width:100%; float:none;display:flex;margin-bottom:30px;}
    .lc_list .text{ flex:1;max-width:initial}
    .lc_list li .icon{ margin:0 30px;}
    .lc_list li:after{ left:0;margin-left:0;transform:rotate(90deg);background-size:100% 100%;top:100px; width:90px;height:17px;}
    .footer h2{ font-size:30px;}
    .footer h3{ font-size:18px;}
    .footer h3:after{margin:20px auto}
    .foot{ height:80px;}
}
.swiper-pagination3, .swiper-pagination2,.swiper-pagination4{ display: none }
@media only screen and (max-width: 850px) {

    .swiper-pagination3, .swiper-pagination2, .swiper-pagination4 { display: block }
    .swiper_box .swiper-button{display:none;}
     .swiper-slide{margin-bottom:30px;}
     .swiper1 .swiper-slide{margin-bottom:0}
    .menu_wrap { background: rgba(0,0,0,0.1); position: absolute; display: flex; align-items: center; top: 50%; height: 40px; margin-top: -20px; width: 40px; right: 0; justify-content: center; }
    .menu_wrap label{display:block;width:25px; height:2px; background:#fff;border-radius:2px;}
    .menu_wrap:after, .menu_wrap:before { position: absolute; width: 25px;margin:0 auto; left:0; right:0; height: 2px; top: -5px; content: ''; display: block; background: #fff; border-radius:2px;}
    .menu_wrap:after{ top:10px;}
    .menu_wrap:before{ top:28px;}
     .menu_wrap label,  .menu_wrap:after,  .menu_wrap:before { background: #56bcc1 }
    .menu{ position:fixed;bottom:0;width:70%; right:-100%; background:rgba(255,255,255,0.95);top:70px;z-index:1;}
    .h_menu .menu{right:0;}
    .menu li { display: block; float: none; border-bottom: 1px solid #ccc; line-height: 60px; text-align: left; margin: 0 30px; }
    .menu li a:after{display:none;}
    .menu li a { color: #333; }
    .header { position: fixed; background: #fff; padding: 15px 0; z-index: 10; }
    .h_menu .menu_wrap label{opacity:0;}
    .h_menu .menu_wrap:after { transform: rotate(-45deg) translateY(7px) translateX(-7px) }
    .h_menu .menu_wrap:before { transform: rotate(45deg) translateY(-6px) translateX(-6px) }
    .logo { background: url(../img/logo-1.png) no-repeat center center; }
    .swiper1 .swiper-slide{ height:calc(100vh * 0.6)}
    .swiper1 .text h2{ font-size:20px;}
    .swiper1 .text h3{font-size:16px;}
    .swiper1 .text h3:after, .swiper1 .text h3:before{width:20px;}
    .page_tit h3{ font-size:24px;}
    .page{padding:30px 0}
    .page_tit{ margin-bottom:30px;}
    .swiper_dots{ display:none;}
    .swiper2 .text{padding:20px;}
    .swiper2 .text h3{ font-size:18px;}
    .swiper2 .text h3:after{ margin:10px 0}
    .swiper2 .swiper-slide{height:auto;}
    .swiper2 .text{ position:initial;}
    .swiper4_box{margin:0}
    .lc_list .text, .swiper4_box .text { font-size: 14px; line-height: 22px; }
    .lc_list h3{ line-height:30px; margin-bottom:10px;font-size:18px;}
    .qa_list li{padding:0 20px;}
    .qa_list .tit h3{font-size:16px; line-height:20px;}
    .footer h2{font-size:20px;}
    .swiper2 .text{ font-size:16px;}
    .footer h3:after{ margin:10px auto;}
    .swiper_box .swiper-button.prev{left:0}
    .swiper_box .swiper-button.next{right:0}
    .swiper_box .swiper-button{border-radius:0}
    .swiper-pagination-bullet-active{background:#56bcc1}
}