@charset "utf-8";
/* CSS Document */
body{ font:14px/1.7 "微软雅黑", "Microsoft YaHei",Arial, sans-serif; color:#333; background-color:#fff; overflow-x:hidden;}
a{ text-decoration:none; color:#333;-webkit-tap-highlight-color:transparent;}
*{ list-style:none; margin:0; outline:none; padding:0; border:none;}
.fl{ float:left;}
.fr{ float:right;}
.ov{ overflow:hidden;}
.dis{ display:block !important;}
.dn{ display:none;}
.clear{ clear:both;}
.clear:after{ content:""; display:block; clear:both;}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#999;} 
input:-moz-placeholder,textarea:-moz-placeholder{ color:#999;} 
input::-moz-placeholder,textarea::-moz-placeholder{ color:#999;} 
input:-ms-input-placeholder,textarea:-ms-input-placeholder{ color:#999;} 
input,select,textarea{ -webkit-appearance:none;}
input[type=radio]{ -webkit-appearance:radio;}
input[type=checkbox]{ -webkit-appearance:checkbox;}


/*客服*/
.kf{ position:fixed; right:1%; bottom:10%; z-index:100;}
.kf .top{ width:46px; border-radius:50px; box-shadow:0 0 20px rgba(0,81,251,.1); background:linear-gradient(to bottom,#16428B,#0000b3);}
.kf .top a{ display:block; text-align:center; padding:15px 0;}
.kf .top a img{ display:block; height:20px; margin:5px auto; margin-bottom:3px;}
.kf .top a span{ font-size:12px; line-height:22px; display:block; color:#fff;}
.kf .mil{ display:block; width:46px; border-radius:50px; box-shadow:0 0 20px rgba(0,81,251,.1); background-color:#fff; margin:20px 0; padding:10px 0;}
.kf .mil dt{ display:block; text-align:center; border-bottom:1px solid #eee; overflow:hidden;}
.kf .mil dt a{ display:block; overflow:hidden; padding:10px 0; cursor:pointer;}
.kf .mil dt a img{ display:block; height:20px; margin:5px auto; margin-bottom:3px;}
.kf .mil dt a span{ font-size:12px; line-height:22px; display:block; color:#333;}
.kf .mil dt a:hover span{ color:#16428B;}
.kf .mil dd{ display:block; text-align:center; position:relative; border-bottom:1px solid #eee;}
.kf .mil dd:last-child{ border-bottom:none;}
.kf .mil dd a{ display:block; overflow:hidden; padding:10px 0; cursor:pointer;}
.kf .mil dd a img{ display:block; height:20px; margin:5px auto; margin-bottom:3px;}
.kf .mil dd a span{ font-size:12px; line-height:22px; display:block; color:#333;}
.kf .mil dd a:hover span{ color:#16428B;}
.kf .mil dd p{ width:120px; display:none; position:absolute; right:60px; bottom:0; background-color:#fff; border-radius:10px; padding:10px; box-shadow:0 0 10px rgba(0,81,251,.1);}
.kf .mil dd:hover p{ display:block;}
.kf .mil dd p b{ color:#16428B;}
.kf .mil dd p img{ width:120px; display:block;}
.kf .mil dd p span{ font-size:12px; line-height:22px; display:block; color:#333; text-align:center;}
.kf .bot{ display:block; width:46px; height:46px; border-radius:50px; box-shadow:0 0 20px rgba(0,81,251,.1); background-color:#fff; cursor:pointer; display:none;}
.kf .bot img{ height:12px; margin:17px auto; display:block;}

.mess{ width:300px; position:fixed; right:0; bottom:-1460px; z-index:999; box-shadow:0 0 20px rgba(0,81,251,.1); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.mess.hei{ bottom:0;}
.mess .close{ position:absolute; right:10px; top:2px; -webkit-transition:1s linear; transition:1s ease-in;}
.mess .close img{ width:35px; display:block; cursor:pointer;}
.mess .close:hover{ transform:rotate(360deg); -ms-transform:rotate(360deg); -moz-transform:rotate(360deg); -webkit-transform:rotate(360deg); -o-transform:rotate(360deg);}
.mess .title{ padding:0 20px; height:40px; background-color:#16428B; border-top-left-radius:10px; border-top-right-radius:10px;}
.mess .title b{ display:block; font-size:16px; line-height:40px; height:40px; color:#fff; float:left;}
.mess .box{ padding:20px; padding-top:15px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; background-color:#fff;}
.mess .box .m01{ font-size:14px; line-height:24px; color:#666; margin-bottom:10px;}
.mess .box .m02{ width:100%; box-sizing:border-box; border:1px solid #ddd; margin-bottom:15px; border-radius:5px;}
.mess .box .m02 input{ width:100%; padding:0 15px; font-size:14px; line-height:34px; height:34px; display:block; overflow:hidden;}
.mess .box .m02 textarea{ width:100%; padding:5px 15px; font-size:14px; line-height:24px; height:80px; display:block; overflow:hidden; font-family:inherit;}
.mess .box .m03{ width:100%; border-radius:5px;}
.mess .box .m03 input{ width:100%; height:40px; line-height:40px; text-align:center; background-color:#333; color:#fff; font-size:14px; border-radius:5px; overflow:hidden; cursor:pointer;}
.mess .box .m03 input:hover{ background-color:#16428B;}
.mess .box .layui-upload-drag{ padding-top:5px; margin-bottom:15px;}
.mess .box .layui-upload-drag .file{ display:block; width:100%; height:36px; border-radius:5px; background-color:#f7f7f7; text-align:center; line-height:36px; font-size:14px;}
.mess .box .layui-upload-file{ display:none !important;}

/*header*/
.header{ width:88%; padding:0 6%; height:94px; background-color:#fff; position:fixed; left:0; top:0; z-index:99; display:flex; align-items:center;}
.header .logo{ height:50px;}
.header .logo img{ display:block; height:50px;}
.header .logo img.img02{ display:none;}
@media only screen and (max-width: 1360px){
.header .logo{ height:40px;}
.header .logo img{ display:block; height:40px;}
}
@media only screen and (max-width: 1280px){
.header .logo{ height:30px;}
.header .logo img{ display:block; height:30px;}
.header .logo img.img01{ display:none;}
.header .logo img.img02{ display:block;}
}
.header .gg{ flex:1; margin-left:3vw; display:flex; flex-wrap:wrap; justify-content:space-around; overflow:visible;}
.header .gg p{ font-size:16px; line-height:1.5; color:#666666; text-align:center; font-weight: normal;}
.header .gg p:first-child{ color:#16428B; font-weight: bold;}
/* 标语暗金色 */
.header .gg p:nth-child(2),
.header .gg p:nth-child(3),
.header .gg p:nth-child(4),
.header .gg p:nth-child(5){ color:#D49A00; font-weight: 600; }
.header .ser{ margin-left:3vw; height:36px; border:1px solid #ddd; border-radius:40px;}
.header .ser p{ display:block; width:12vw; float:left; overflow:hidden;}
.header .ser p input{ width:100%; padding:0 15px; display:block; font-size:14px; height:36px; line-height:36px; box-sizing:border-box;}
.header .ser a{ width:30px; height:30px; background-color:#16428B; display:block; float:left; overflow:hidden; border-radius:100%; margin:3px; margin-left:0;}
.header .ser a input{ width:100%; height:100%; display:block; border-radius:100%; background-color:#16428B; background-image:url(../images/ser.svg); background-size:14px auto; background-position:center; background-repeat:no-repeat; cursor:pointer;}
.header .yu{ margin-left:2vw;}
.header .yu a{ padding:0 20px; height:36px; line-height:36px; font-size:14px; border-radius:40px; overflow:hidden; float:left; background-color:#f1f1f1; margin-left:1vw;}
.header .yu a:hover{ color:#16428B;}
.header .yu a.on{ background-color:#16428B; color:#fff;}
.nav{ width:88%; padding:0 6%; height:46px; display:flex; align-items:center; justify-content:space-between; background-color:#16428B; position:fixed; left:0; top:94px; z-index:99;}
.nav a{ flex:1; font-size:16px; color:#fff; text-align:center; display:block;}
.nav a:hover,.nav a.on{ color:#ffc000;}
.nav span{ width:1px; height:14px; display:block; background-color:#fff; opacity:.5; overflow:hidden;}

.hbg{ width:100%; height:140px;}

/*index*/
.bg{ width:100%; height:100%; position:absolute; left:0; top:0; z-index:1; background-color:#000; opacity:.5;}
.footer{ width:100%; text-align:center; font-size:14px; line-height:50px; color:#fff; z-index:5; background-color:#333;}
.footer a{ color:#fff;}

.index{ padding:5vw 6%; width:100%; min-height:calc(100vh - 140px); box-sizing:border-box; position:relative; z-index:5; display:flex; align-items:center; background-position:center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed;}
.index .box{ width:100%; max-width:1440px; margin:auto; position:relative; z-index:3;}
.index .box .title{ width:100%; text-align:center; display:flex; align-items:center; justify-content:center;}
.index .box .title p{ display:flex; align-items:center; justify-content:center; padding:0 50px; background-color:rgba(22, 66, 139, 0.9); height:60px; border-radius:50px;}
.index .box .title img{ display:block;}
.index .box .title b{ font-size:30px; line-height:50px; display:block; color:#fff; margin:0 30px;}

/*企业文化 (已去除灰色背景，改为白底浅阴影) */
.index .box .culture{ width:100%; display:flex; flex-wrap:wrap;}
.index .box .culture li{ width:100%; display:flex; justify-content:space-between; align-items:center; padding:3vw 5%; box-sizing:border-box; border-radius:10px; background-color:#fff; box-shadow:0 4px 20px rgba(0,0,0,0.05); margin-top:3vw;}
.index .box .culture li:nth-child(2n){ flex-direction:row-reverse;}
.index .box .culture li .left{ width:40%;}
.index .box .culture li .left img{ display:block; width:100%;}
.index .box .culture li .right{ width:55%;}
.index .box .culture li .w02{ width:100%; font-size:24px; line-height:34px; margin-top:10px; color:#16428B; font-weight:bold;}
.index .box .culture li .w03{ width:40px; height:2px; display:block; margin:10px 0; background-color:#16428B;}
.index .box .culture li .w04{ width:100%; font-size:16px; line-height:26px; color:#666;}

/*责任经营 (已去除灰色背景，改为白底浅阴影) */
.index .box .zr{ width:100%; display:block;}
.index .box .zr li{ width:100%; display:flex; align-items:center; background-color:#fff; box-shadow:0 4px 20px rgba(0,0,0,0.05); margin-top:3vw; border-radius:10px; overflow:hidden;}
.index .box .zr li .left{ width:35%;}
.index .box .zr li .left img{ width:100%; display:block;}
.index .box .zr li .right{ width:55%; padding:3vw 5%;}
.index .box .zr li .right .w01{ font-size:24px; line-height:34px; color:#16428B; font-weight:bold;}
.index .box .zr li .right .w02{ width:40px; height:2px; display:block; margin-top:15px; background-color:#16428B;}
.index .box .zr li .right .w03{ width:100%; font-size:16px; line-height:26px; color:#666; margin-top:25px;}

/*公司介绍 (已去除灰色背景，改为白底浅阴影) */
.index .box .about{ width:100%; font-size:16px; line-height:36px; color:#333; margin-top:3vw; padding:3vw 5%; border-radius:10px; background-color:#fff; box-shadow:0 4px 20px rgba(0,0,0,0.05); box-sizing:border-box;}

/*我们的产品*/
.pro{ width:100%; min-height:calc(100vh - 140px); position:relative; z-index:1; display:flex;}
.pro .lbar{ width:240px; padding:2vw 3%; background-color:#fff;}
.pro .lbar .sav{ width:100%;}
.pro .lbar .sav a{ display:block; overflow:hidden; width:100%; font-size:16px; line-height:40px; height:40px; border-radius:10px; background-color:#f1f1f1; text-align:center; margin-bottom:1vw;}
.pro .lbar .sav a:hover{ color:#16428B;}
.pro .lbar .sav a.on{ background-color:#16428B; color:#fff;}
.pro .lbar .list{ width:100%; display:block;}
.pro .lbar .list li{ display:block;  margin-top:.5vw; overflow:hidden;}
.pro .lbar .list li span{ width:18px; display:block; height:14px; margin:6px 10px; margin-left:0; display:block; float:left;}
.pro .lbar .list li span img{ display:block; height:14px; margin:auto;}
.pro .lbar .list li p{ font-size:14px; line-height:24px; display:block; float:left;}
.pro .lbar .list li p a{ display:block; color:#666;}
.pro .rbar{ flex:1; padding:2vw 3%; background-color:#f1f1f1;}
.pro .rbar .dao{ width:100%; padding:0 30px; box-sizing:border-box; background-color:#fff;}
.pro .rbar .dao .left{ padding-top:20px; padding-bottom:30px; width:calc(100% - 240px); float:left; height:122px; box-sizing:border-box; overflow:auto;}
.pro .rbar .dao .left::-webkit-scrollbar{ width:5px; height:1px;}
.pro .rbar .dao .left::-webkit-scrollbar-thumb{ border-radius:10px; background-color:#16428B;}
.pro .rbar .dao .left::-webkit-scrollbar-track{ border-radius:10px; background:rgba(0,0,0,0.1);}
.pro .rbar .dao a{ display:block; font-size:14px; line-height:24px; margin-right:20px; float:left; margin-top:5px;}
.pro .rbar .dao a.on,.pro .rbar .dao a:hover{ color:#16428B;}
.pro .rbar .dao span{ display:block; width:1px; height:12px; margin:6px 20px; margin-left:0; margin-top:11px; float:left; overflow:hidden; background-color:#aaa;}
.pro .rbar .dao span:last-child{ display:none;}
.pro .rbar .dao .right{ width:238px; height:36px; border:1px solid #ddd; border-radius:40px; margin-top:30px;}
.pro .rbar .dao .right p{ display:block; width:calc(100% - 36px); float:left; overflow:hidden;}
.pro .rbar .dao .right p input{ width:100%; padding:0 15px; display:block; font-size:14px; height:36px; line-height:36px; box-sizing:border-box;}
.pro .rbar .dao .right a{ width:30px; height:30px; background-color:#16428B; display:block; float:right; overflow:hidden; border-radius:100%; margin:3px; margin-left:0;}
.pro .rbar .dao .right a input{ width:100%; height:100%; display:block; border-radius:100%; background-color:#16428B; background-image:url(../images/ser.svg); background-size:14px auto; background-position:center; background-repeat:no-repeat; cursor:pointer;}

.pro .rbar .table{ width:100%; margin-top:2vw;}
.pro .rbar .table table{ width:100%; background-color:#ddd;}
.pro .rbar .table table th{ background-color:#ffc000; color:#333; padding:5px; font-size:14px; font-weight:normal;}
.pro .rbar .table table td{ background-color:#fff; color:#333; padding:5px; font-size:14px; font-weight:normal;}
.pro .rbar .table table td img{ max-height:60px;}
.pro .rbar .fanye{ margin-top:1vw; width:100%;}
.pro .rbar .fanye>div{ float:right;}
.pro .rbar .fanye ul,.pro .rbar .fanye form{ display:block; float:left; overflow:hidden;}
.pro .rbar .fanye ul li{ display:block; float:left;}
.pro .rbar .fanye ul li a,.pro .rbar .fanye ul li span{ font-size:14px; width:34px; line-height:34px; height:34px; border-radius:5px; display:block; background-color:#fff; overflow:hidden; text-align:center; float:left; margin-right:10px;}
.pro .rbar .fanye ul li a:hover{ color:#16428B;}
.pro .rbar .fanye ul li.active span{ background-color:#ffc000; color:#333;}
.pro .rbar .fanye ul li.disabled span{ cursor:no-drop;}
.pro .rbar .fanye p{ display:flex; align-itmes:center; overflow:hidden; float:left; font-size:14px; line-height:34px; color:#666;}
.pro .rbar .fanye p .layui-input{ font-size:14px; width:50px; line-height:34px; height:34px; border-radius:5px; display:block; background-color:#fff; color:#666; overflow:hidden; text-align:center; margin:0 10px;}
.pro .rbar .fanye p .layui-laypage-btn{ font-size:14px; width:40px; line-height:34px; height:34px; border-radius:5px; display:block; background-color:#ffc000; color:#333; overflow:hidden; text-align:center; margin-left:10px; cursor:pointer;}
