@charset "utf-8";
/* CSS Document */
body,html {margin:0; padding:0;  color:#5e5e5e;  font:12px/180% "Microsoft Yahei","Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;}
body{width:100%;background:#fbfcfd; padding-top: 68px;}
body a{outline:none;blr:expression(this.onFocus=this.blur());}
h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {margin:0;padding:0; list-style:none;}
li {list-style:none; vertical-align:bottom;}
img {border:none; display:block;}
em,i {font-style:normal;}
a{text-decoration:none; color:#5e5e5e;}
.disable {display:none;}
.fl {float:left;}
.fr {float:right;}
.clearfix:after {content:""; height:0; display:block; clear:both; visibility:hidden;}
* html .clearfix {height:1%;}
* +html .clearfix {height:1%;}
.clearfix {display:block; clear:both;}
input,textarea{ resize:none; font-family:"微软雅黑"; outline:none;}
select{height:22px; line-height:18px; padding:2px 0; outline:none;}

.wrapper{ width:1200px; margin:0 auto;}

.header{ position: fixed; left: 0; top: 0; right: 0; background: rgba(255,255,255,0.9); z-index: 9;  box-shadow: 0 0 10px rgba(0,0,0,0.05) }
.header .wrapper{ display: -webkit-flex; display: flex; justify-content: space-between; align-items: center; height: 68px}
.header .logo img{ display: block; height: 38px;}
.header .nav{ display: -webkit-flex; display: flex; justify-content: flex-start; align-items: center;}
.header .nav a{ display: block; margin-left: 5px; font-size: 17px; color: #333; line-height: 68px; padding: 0 20px; transition: all 0.3s; position: relative;}
.header .nav a::after{ position: absolute; left: 50%; width: 0; bottom: 10px; transform: translateX(-50%); content: ""; border-bottom: 2px #007aff solid; transition: all 0.3s;}
.header .nav a:hover,.header .nav a.on{ color: #007aff}
.header .nav a:hover::after,.header .nav a.on::after{ width: 30px; }
.header .nav i{ display: block; margin-left: 10px; border: 1px #007aff solid; line-height: 30px; height: 30px; font-size: 14px; color: #007aff; padding: 0 20px; cursor: pointer; border-radius: 16px;}

.banner{ display: -webkit-flex; display: flex; align-items: center; height: 450px; background: url("../images/banner.jpg") no-repeat center center; background-size: cover;}
.banner b{ display:block; color: #222426; font-size: 48px; font-style: normal; font-weight: 500; height: 72px; line-height: 72px;}
.banner p{color: #515863; font-size: 18px; font-style: normal; font-weight: 400; line-height: 32px;  margin-top: 24px; width: 500px;}

.index_nums{ background: url("../images/img01.jpg") no-repeat center center; background-size: cover; overflow: hidden}
.index_nums .wrapper{ height: 130px; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center;}
.index_nums li.con{ display: -webkit-flex; display:flex; align-items: center; justify-content: center}
.index_nums img{ display: block; width: 125px;}
.index_nums div{ -webkit-flex: 1; flex: 1; color: #fff;}
.index_nums b{ display: block; font-size: 28px; line-height: 28px; margin-bottom: 5px; font-weight: normal;}
.index_nums p{ font-size: 16px;line-height: 20px;}
.index_nums .line{ height: 40px; border-right: 1px rgb(71, 152, 255, 0.8) solid;}

.index_about{ height: 568px; background: url("../images/bg.png") no-repeat center top; overflow: hidden}
.index_about .wrapper{ height: 568px; position: relative;}
.index_about .img{ position: absolute; left: 0; bottom: 0; width: 600px;}
.index_about .con{ position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 660px; text-align: right;}
.index_about .con b{ display: block; font-size: 38px; line-height: 50px; color: rgb(25, 102, 255);}
.index_about .con p{ padding-left: 120px; color: #fff; font-size: 18px; line-height: 1.9;}
.index_about .con span{ display: block; font-size: 14px; line-height: 2; color: rgb(136, 136, 136); color: #9a9b9f; margin-top: 18px;}


.index_main .title{ padding: 40px 0 20px; text-align: center; color: #333;}
.index_main .title h4{ display: block; font-size: 34px; font-weight: 400; line-height: 75px;}
.index_main .title img{ display: block; margin: 0 auto;}
.index_supper{ display:-webkit-flex; display:flex; justify-content: space-between; padding: 30px 0 60px;}
.index_supper div{width: 365px; text-align: center;}
.index_supper img{ margin: 0 auto; display: block;}
.index_supper b{ display:block; margin-bottom: 12px; margin-top: 20px; font-weight: 500; font-size: 22px; color: #000; line-height: 28px;}
.index_supper p{ font-size: 14px; color: #3d485d; line-height: 23px;}

.index_mains{ background: url("../images/img09.png") no-repeat center top; background-size: 100% 100%;}
.index_mains .title h4{ color: #fff;}
.main_honor{ padding-top: 10px; padding-bottom: 80px;}
.main_honor .top{ display: -webit-flex; display: flex; justify-content: space-between;}
.main_honor .top .left{ display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap; width: 810px;}
.main_honor .top .left div{ position: relative; height: 170px; border-radius: 2px; background: #fff; background: linear-gradient(to left, #fff, #d8e2f9); width: 100%; box-sizing: border-box; padding: 36px 40px 0; overflow: hidden}
.main_honor .top .left div:nth-child(n+2){ margin-top: 20px; width: calc(50% - 10px);}
.main_honor .top .right{ -webkit-flex: 1; flex: 1; margin-left: 20px;}
.main_honor .top .right div{ position: relative;  width: 100%; height: 360px; border-radius: 2px; background: #fff;  padding: 36px 40px 0; box-sizing: border-box; overflow: hidden; background: linear-gradient(to left, #fff, #d8e2f9);}
.main_honor .bottom{ display: -webkit-flex; display: flex; justify-content: space-between; margin-top: 20px;}
.main_honor .bottom div{ overflow: hidden; position: relative; width: calc(50% - 10px); box-sizing: border-box; height: 170px; background: #fff; border-radius: 2px;  padding: 36px 40px 0; background: linear-gradient(to left, #fff, #d8e2f9);}
.main_honor b{ display: block; font-size: 26px; color: #000; line-height: 40px; font-weight: normal; position: relative; z-index: 2;}
.main_honor p{ font-size: 16px; color: #3d485d; line-height: 25px; margin-top: 5px; max-width: 400px; position: relative; z-index: 2;}
.main_honor img{ position: absolute; right: 0; bottom: 0; width: 200px;}
.main_honor .top .left div:nth-child(n+2) p{ max-width: 270px;}
.main_honor .top .left div:nth-child(n+2) img{ right: -43px; bottom: -20px;}
.main_honor .top .right img{ width: 230px; right: -20px; bottom: -20px;}
.main_honor .bottom  img{ right: -30px}

.main_news{ background: url("../images/img07.png") no-repeat center top; padding-bottom: 70px;}
.index_tab{ display: -webkit-flex; display: flex; padding: 10px 0 20px; justify-content: center}
.index_tab a{ display: block; font-size: 14px; line-height: 33px; width: 110px; text-align: center; margin: 0 13px;  transition: all 0.3s;}
.index_tab a:hover,.index_tab a.on{ color: #007aff; background: #fff; border-radius: 17px;}
.index_news{ height: 384px; overflow: hidden; display: flex; display: -webkit-flex; justify-content: space-between;}
.index_news .left{ width: 460px; height: 384px; background: #fff; box-sizing: border-box; padding: 40px 40px 0; border-radius: 2px}
.index_news .left a{display: block;}
.index_news .left img{ display:block; width: 100%;}
.index_news .left h4,.index_news .right h4{ display: block; margin-top: 26px; font-size: 14px; line-height: 24px; color: rgb(34, 34, 34); height: 24px; overflow: hidden; font-weight: normal;}
.index_news .left p,.index_news .right p{ font-size: 12px; color: #ccc; line-height: 1.0; margin-top: 2px}
.index_news .left span,.index_news .right span{ display: block; font-size: 12px; color: #888; line-height: 22px; margin-top: 18px;}
.index_news .left a:hover h4{color: #007aff}
.index_news .right{ -webkit-flex:1; flex: 1; display: flex; display: -webit-flex; flex-wrap: wrap;}
.index_news .right div{ margin-left: 2px; border-radius: 2px; width: calc(50% - 2px); height: 191px; background: #fff; box-sizing: border-box; padding: 42px 42px 0;}
.index_news .right div:nth-child(n+3){ margin-top: 2px;}
.index_news .right h4{ margin-top: 0;}
.index_news .right a:hover h4{ color:#007aff;}
.index_more{ display: -webkit-flex; display: flex; justify-content: center; padding-top: 30px;}
.index_more a{ display: block; width: 133px; height: 38px; line-height: 38px; text-align: center; color: #007aff; border: 1px #007aff solid; font-size: 14px; border-radius: 20px; transition: all 0.3s;}
.index_more a:hover{ color: #fff; background: #007aff;}

.tel_index{ background: url("../images/img17.png") no-repeat center center; background-size: cover;}
.tel_index .wrapper{ height: 200px; display:-webkit-flex; display: flex; justify-content: space-between; align-items: center; color: #fff;}
.tel_index .right{ display: -webkit-flex; display: flex; justify-content: space-between; align-items: center;}
.tel_index b{ display: block; font-size: 34px; line-height: 45px;}
.tel_index p{ font-size: 18px; line-height: 1.9;}
.tel_index .left p{ margin-top: 15px;}
.tel_index img{ margin-right: 20px; width: 110px;}
.tel_index .right b{ font-size: 28px;}

.footer{ background: rgb(20, 26, 36);}
.f_top{ padding: 30px 5px 20px;}
.f_top b,.f_center .cons b{ display: block; font-size: 17px; color: #fff; font-weight: normal; line-height: 25px;}
.f_top div a{ display: inline-block; vertical-align: top; font-size: 14px; color: #9a9b9f; margin-right: 15px; line-height: 30px; margin-top: 5px; transition: all 0.3s;}
.f_top div a:hover{ color: rgba(255,255,255, 1.0)}
.f_line{ border-bottom: #424851 1px solid;}
.f_center{ padding: 20px 5px; display: -webkit-flex; display: flex; justify-content: space-between; align-items: flex-start;}
.f_center .con p{ display: -webkit-flex; display: flex; align-items: center; justify-content: flex-start; font-size: 14px; color: #9a9b9f; line-height: 40px;}
.f_center .con img{ margin-right: 5px}
.f_center .cons{ display: -webkit-flex; display: flex; justify-content: flex-start; align-items: flex-start;}
.f_center .cons div{ margin-left: 110px;}
.f_center .cons div:nth-child(1){ margin-left: 0}
.f_center .cons p{ font-size: 14px; line-height: 25px;}
.f_center .cons p a{ color: #9a9b9f}
.f_center .cons p a:hover{ color: #fff;}
.f_center .cons b{ margin-bottom: 5px;}
.f_copy{text-align: center; font-size: 14px; color: #9a9b9f; padding: 12px 5px;}

/*图片位*/
.p_img{ height: 200px; background-position: center center; background-repeat: no-repeat; background-size: cover; display: -webkit-flex; display: flex; align-items: center; text-align: center; color: #ffffff; line-height: 1.1; box-sizing: border-box;}
.p_img b{ display: block; font-size: 20px; font-weight: normal; color:#fff; margin-top: 10px; letter-spacing: 3px; padding-left: 3px;}
.p_img h4{ display: block; font-size: 36px; font-weight: normal; margin-top: 25px; color: rgb(25, 102, 255); font-weight: normal; text-transform: capitalize;}
.p_img p{ font-size: 40px; line-height: 40px; padding: 20px 0; letter-spacing: 3px; padding-left: 3px;}
.p_img a{ display: block; margin: 30px auto 0; height: 60px;  width: 240px; cursor: pointer; text-align: center; display:-webkit-flex; display: flex;  align-items:  center; justify-content:  center; line-height: 56px; font-size: 16px; color: #3C71FF; border-radius: 30px; background: #FFF; transition: all 0.3s ease-in-out;}
.p_img a img{ margin-right: 15px;}
.p_img a:hover { transform: translateY(-8px); box-shadow: 0 5px 8px rgba(0,0,0,0.1);}

.case_img{ color: #1f2774}

.p_img h3{ display: block; font-size: 45px; font-weight: 600; text-align: left; letter-spacing: 3px; padding-left: 100px;}
.p_img span{ display: block; font-size: 35px; font-weight: normal; text-align: left; margin-top: 20px; padding-left: 100px;}

/*新闻列表*/
.news_tab{ background: rgb(246, 246, 246); height: 60px; line-height: 60px;}
.news_tab ul{ display: -webkit-flex; display: flex;}
.news_tab a{ display: block; font-size: 18px; color: #465467; position: relative; margin-right: 30px; transition: all 0.3s;}
.news_tab a::after{ content: ""; position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; width: 0; border-bottom: 2px #007aff solid; transition: all 0.3s;}
.news_tab a:hover,.news_tab a.on{ color: #007aff}
.news_tab a:hover::after,.news_tab a.on::after{ width: 30px;}

.news_list{ padding: 30px 0 20px;}
.news_list li{transition: all 0.3s; border-bottom: 1px solid rgba(0,0,0,0.1)}
.news_list a{ display: -webkit-flex; display: flex; flex-direction: row; padding: 20px 15px; transition: all 0.3s; position: relative;}
.news_list .img{ width: 200px; height: 130px; overflow: hidden; margin-right: 25px; border: 1px #deecf7 solid; border-radius: 2px;}
.news_list .img img{display: block; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s linear;}
.news_list .cons{ -webkit-flex: 1; flex: 1; padding-right: 185px; overflow: hidden;}
.news_list .cons h4{display: block; font-size: 20px; transition: all 0.5s linear; font-weight: normal; color: #000; line-height: 40px; height: 40px; overflow: hidden; white-space: nowrap; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical;}
.news_list .cons p{ font-size: 15px; color: #999; line-height: 28px; overflow: hidden; display: -webkit-box; text-overflow:ellipsis; -webkit-line-clamp:3; -webkit-box-orient:vertical; margin-top: 10px;}
.news_list .time{ position: absolute; right: 15px; top: 20px; text-align: right; font-size: 30px; color: #02081b; line-height: 40px; margin-left: 70px; font-family: "Arial"; transition: all 0.3s;}
.news_list .time b{ display: block; font-size: 20px; font-weight: normal; color: #666;}
.news_list li:hover{ box-shadow: 0 3px 15px rgba(0,0,0,0.15);}
.news_list a:hover img{ transform: scale(1.10)}
.news_list a:hover .time{ right: 35px;}
.news_list a:hover h4{color: #007aff}

/*分页*/
.pages{ padding:20px 0 70px; text-align: center;}
.page a,.page i{ display:inline-block; vertical-align: top; font-size: 14px; color: #555; border:1px solid rgba(0,0,0,.15); padding: 0 10px; height: 30px; line-height: 30px; margin: 0 3px; border-radius: 2px; transition: all 0.3s;}
.page a:hover,.page a.ons,.page a.on{ border-color: #007aff; color: #fff; background: #007aff}
.page a.ons:hover{ color:#fff; background-color: #007aff;}
.page a.on{ font-weight: 600;}


/*当前位置*/
.location{ text-align: right; font-size: 16px; line-height: 60px; background: rgb(246, 246, 246);}
.location a{ color: #999;}

/*新闻详情*/
.detial_news{ padding-bottom: 100px;}
.detial_news .title{ padding: 60px 0 30px; text-align: center;}
.detial_news .title h1{ display: block; font-size: 28px; color: #02081b; line-height: 35px; font-weight: normal;}
.detial_news .title p{ font-size: 16px; color: #999; line-height: 1.1; padding: 30px 0 0;}
.detial_news .con{ font-size: 15px; color: #666; line-height: 27px;}
.detial_news .con p{text-indent: 2em; padding: 10px 0 15px;}
.detial_news .con img{ display: block; max-width: 100%; margin: 5px auto;}

/*服务*/
.service{ padding: 30px 0 60px; overflow: hidden}
.service h4{ display: block; position: relative; font-size: 24px; color: #000; font-weight: normal; line-height: 70px; text-align: center; margin-bottom: 30px;}
.service h4::after{ position: absolute; content: ""; left: 50%; bottom: 0; transform: translateX(-50%); width: 50px; height: 2px; background: #007aff}
.service .cons{ padding: 0 100px; font-size: 14px; color: #333; line-height: 25px; text-align: center;}
.service01{ background: #f6faff;}
.service01 img{ width: 100%; display: block;}
.step_con{ padding-top: 30px; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center;}
.step_con .step{ height: 140px; width: 172px; position: relative;}
.step_con .step::before{ position: absolute; content: ""; left: 50%; transform: translate(-50%); z-index: 1; top: -30px; width: 60px; height: 60px; background: #007aff; border-radius: 100%; line-height: 38px;}
.step_con .step .s_con{ height: 100%; position: relative; z-index: 2;  border: 1px solid transparent; border-radius: 10px; box-sizing: border-box;  background: #fff6;  -webkit-box-pack: center;  -ms-flex-pack: center;  justify-content: center; justify-content: center; box-shadow: 0 2px 10px #215efe36; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);}
.step_con .step b{ display: block; line-height: 60px; margin-top: -30px; color: #fff; font-size: 20px; text-align: center; font-family: "Arial"}
.step_con .step img{ width: 35px; display: block; margin: 10px auto 0;}
.step_con .step p{ font-size: 16px; color: #000; text-align: center; padding-top: 15px;}
.step_con .r_img{ width: 55px;}

/*关于*/
.about{ display:-webkit-flex; display: flex; justify-content: space-between; padding: 40px 0;}
.about .right{ width: 552px; display: -webkit-flex; display: flex; justify-content: space-between; flex-wrap: wrap;}
.about .right img{ display: block; width: 100%;}
.about .right img:nth-child(n+2){ margin-top: 10px; width: 271px}
.about .left{ -webkit-flex: 1; flex: 1; margin-right: 80px;}
.about .left b{ display: block; font-size: 38px; color: rgb(25, 102, 255); line-height: 50px;}
.about .left span{ display: block; font-size: 18px; color: rgb(34, 34, 34); line-height: 1.8; margin-top: 5px;}
.about .left p{ font-size: 14px; color: #777; line-height: 25px; margin-top: 16px;}
.service02{ background: rgb(246, 246, 246);}
.honor ul{display: -webkit-flex; display: flex; justify-content: space-between;}
.honor li{ width: 360px; text-align: center;}
.honor div{height: 240px; display: -webkit-flex; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 10px rgba(0,0,0,0.05); background: #fff; border-radius: 4px;}
.honor div img{ display: block; max-height: 100%; width: 100%;}
.honor b{ display: block; font-size: 16px; color: #000; font-weight: normal; line-height: 20px; padding-top: 15px;}









