@charset "utf-8";
/* CSS Document */

body{ max-width:19.2rem; margin:0 auto;}
.pd2{ max-width:19.2rem; padding-left:2.1rem; padding-right:2.1rem;}
.flex{ display:flex; display: -webkit-flex; align-items:center;flex-wrap:  wrap ; justify-content:space-between}
.flex2{ display:flex; display: -webkit-flex; align-items:stretch;flex-wrap:  wrap ; justify-content:space-between}

.suban img{ width:100%; display:block;}

.header{ transition: all .5s; background-color: #fff; padding-left:.8rem; padding-right:.8rem; padding-top:.35rem; padding-bottom:.2rem; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; }
.header a{ color:#566171; display:inline-block; color:#0d1937; display:flex; display: -webkit-flex; align-items:center; font-size:.18rem; line-height:.5rem; font-family: deng;}
.header a span{font-family: Helvetica,'Microsoft YaHei' , Arial,sans-serif, -apple-system, BlinkMacSystemFont;}
.header li{ position:relative; padding:0 .25rem;}
.header li em{ font-size:.16rem; line-height:.3rem; display:inline-block; margin:0 .1rem; font-style:normal; vertical-align:middle}
.header li i{ margin-left:.05rem;}
.header li .cpsub{ z-index:100; transition:all .3s; background:#fff; min-width:100%; text-align:center; position:absolute; top:120%; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); opacity:0; visibility:hidden; -o-transform:translateX(-50%);-ms-transform:translateX(-50%); width:auto;  box-shadow:0 0 10px rgba(0,0,0,.1); padding:0;}
.header li .cpsub a{ transition:all .3s; font-size:.16rem; line-height:.35rem; border-bottom:1px solid #eee; text-align:center; padding:.05rem .1rem; display:block; white-space:nowrap;}
.header li .cpsub a:last-child{ border:none;}
.header li .cpsub a em{ font-size: 12px;}
.header li .cpsub a:hover{ color:#fff; background:#0d1937;}
.header li:hover .cpsub{ top:100%; opacity:1; visibility:visible;}

.header.on{ position: fixed; top: -110%; width: 100%; left: 0; z-index: 100; box-shadow: 0 0 10px rgba(0,0,0,.1)}
.header.on.fixed{ padding-top: 15px; padding-bottom: 15px;}
.header.on.fixed{ top: 0;}
.header ul.flex{align-items: center;}
.header ul.flex em{ font-style:normal;color: #999;}

.banner{ position:relative;}
.banner p{ position:absolute; right:40px; bottom:40px; font-size:.26rem; color:#fff;}
.banner p span{ display:block; font-size:.2rem;}
.banner img{ width:100%;}
.banner a{ font-weight:bold; position:absolute; bottom:.5rem; left:1.6rem; display:inline-block; color:#556465; padding:0 .3rem; line-height:.6rem; border:2px solid #48b2da; border-radius:100px; font-size:.3rem; transition:all .3s;}

.banner a:hover{ background:#48b2da; color:#fff;}


.main01{ padding:.8rem 0;}
.main01 .w1200{ max-width:14.8rem; margin:0 auto; text-align:center;}

.main01 b{ display: block; font-size:.58rem; color:#556564; margin-bottom:.3rem;}
.main01 p{ font-size:.46rem; color:#556564; font-weight:bold;}

.main02{ background:#dee3e6; margin-bottom:2rem;}
.main2le{ width:43%; padding-right:.4rem; padding-left:2.1rem;}
.main2ri{ width:56%; border-left:.15rem solid #fff;}
.main2le b{ font-size:.42rem; line-height:1.4; display:block; margin-bottom:.7rem; color:#566466;}
.main2le p{ font-size:.42rem; color:#566466; display:block; line-height:1.4; text-align:justify}
.main2le p span{ font-size:.34rem;}

.header .flex{ align-items:flex-end}
.footer{ height:.66rem; background-color: #464b4d;text-align: center; vertical-align:middle;
    display: grid;
    place-items: center;
    color: white;
	font-size: .18rem;
    line-height: .5rem;
    font-family: deng;}
.footer a{ 
	color: white;
	font-size: .18rem;
	line-height: .5rem;
	font-family: deng;}
.footer em{ font-style: normal;}
.logo img{ width:0.3rem; margin-left:-.5rem}
.header a span{padding-left:10px;}

.suban img{ width:100%;}
.pro01{ padding-top:.8rem; padding-bottom:.8rem;}
.pro_tit{ margin-bottom:.5rem;}
.pro_tit b{ font-size:.24rem; text-transform: uppercase; line-height:1;justify-content:flex-start;color:#676767;}
.pro_tit em{ font-style:normal; font-size:.2rem; display:inline-block; padding:0 .1rem; line-height:.3rem; }
.pro_tit b span{letter-spacing: 2px;font-family: deng;}

.protxt{ border-left:2px solid #0f82ba; padding-left:.8rem;}
.protxt p:first-child{ margin-top:0}
.protxt p{font-family: huawenxihei;font-size:15px;color:#676767;line-height:1.5; text-align:justify}

.pro02{ margin-bottom:18px;}
.pro02 li{ width:calc(50% - .1rem);}
.pro03{ padding:0; margin-bottom:2.3rem;}
.pro3le,.pro3ri{ width:50%; padding:0 18px;}
.pro03 p{ line-height:1.8; font-size:.21rem; color:#676767;    text-align: justify;}
.pro03 p strong{ font-weight:bold;}
.protxt ul{ padding-top:.25rem;}
.protxt ul li{ margin-top:.3rem;font-family: deng; min-width:2.6rem; color:#1f1c1d; font-size:14px;line-height:1.1; padding-left:.22rem; width:32%; position:relative; letter-spacing:1px;}
.protxt ul li:before{ content:""; display:block; width:.1rem; height:.1rem; border:.02rem solid #1f1c1d; position:absolute; left:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%);}
.protxt ul li:nth-child(10){ width:100%;}
/*.protxt ul li:nth-child(1),.protxt ul li:nth-child(4),.protxt ul li:nth-child(7){ width:2.8rem;}
.protxt ul li:nth-child(2),.protxt ul li:nth-child(5),.protxt ul li:nth-child(8){ width:5.5rem;}
.protxt ul li:nth-child(3),.protxt ul li:nth-child(6),.protxt ul li:nth-child(9){ width:5rem;}
*/
.yingyong02{ padding-top:.6rem; padding-bottom:1rem; position:relative;background-color: #e5e9ec;}
/* .yingyong02:after{ content:""; display:block; width:100%; position:absolute; left:0; top:0; z-index:0; height:5.8rem; background-color:#e5e9ec;} */
.yingyong02 .txt{ position:relative; z-index:2;}
.yingyong02 .txt p{ font-size:.21rem; line-height:1.8; margin-bottom:.4rem; padding:0 ;color:#676767;}


.yingyong02 ul{ padding-top:.25rem; padding-left:.1rem;}
.yingyong02 ul li{ margin-top:.15rem; width:31.5%; color:#676767; font-size:.21rem;line-height:1.1; padding-left:.4rem; position:relative; letter-spacing:1px;}
.yingyong02 ul li:before{ content:""; display:block; width:.16rem; height:.16rem; border:.02rem solid #676767; position:absolute; left:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%);}


.yingyong02 .imgs2{ margin-bottom:.5rem;}
.yingyong02 .imgs2 .img{ width:32%;margin-top: 0.3rem;}

.about02ri{ width:50%;}
.about2le{ width:50%; margin-top:7px;}
.about02{ background-image:url(../images/contact_17.jpg); background-position:right center; background-size:35% auto; background-repeat:no-repeat; margin-bottom:2.1rem;}

.about02ri{ padding-left:.6rem; padding-right:2.1rem;}
.about02ri p{ font-size:.21rem; line-height:1.6;color:#676767; }

.contact01{ padding-top:.8rem; padding-bottom:.8rem;}
.contactbox{border-left:2px solid #0e86c6; padding-left:1.0rem; padding-top:.2rem;padding-bottom:.6rem;}
.contactbox{ max-width:9.5rem;}
.contactbox b{ font-size:.32rem; color:#676767; line-height:1; display:block; margin-bottom:5px;}
.contactbox b:nth-child(1){letter-spacing: .07rem;}
.contactbox b:nth-child(2){font-size:.28rem;letter-spacing: .02rem;}
.contactbox .zu01{ margin-bottom:8px;}
.contactbox p{ font-size:16px; color:#676767;margin-bottom:1px;letter-spacing: 1px;    line-height: 1.3;}
.contactbox p:nth-child(1){letter-spacing: 3px;}
.contactbox .line{ margin:.4rem auto; width:100%; height:2px; background:#e6e6e6;}
.contactbox span{width: 100%;letter-spacing: 1px;font-size:16px; display:inline-block; color:#676767;margin-bottom:.01rem;}
.contactbox span img{ width:.30rem; vertical-align:middle; margin-right:.2rem;}
.pinzhile,.pinzhiri{ width:50%;}
.pinzhiri p{   
     text-align:right;}
.pinzhi03{ margin-bottom:2.1rem;}
.pinzhi03.flex2{  align-items: flex-end;}
.pinzhi03 p{ font-size: .23rem;
    line-height: 3.2;}
	.pinzhile{ padding-left:2.1rem; padding-right:.8rem;}
	
	
	.licheng{ padding-top:.8rem; padding-bottom:.8rem;}
	
	.lishi >.line{ width:.07rem; transform:translateX(-50%); -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); height:100%; position:absolute; left:50%; top:0; z-index:1; background:#8e9299; -moz-transform:translateX(-50%); }
	.lishi >.line:after{ content:""; display:block; width:.15rem; height:.15rem; border:.05rem solid #8e9299; background:#fff; position:absolute; bottom:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);-ms-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); border-radius:100%;}
	.lishi >.line:before{ content:""; display:block; width:.15rem; height:.15rem; border:.05rem solid #8e9299; background:#fff; position:absolute; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%);-ms-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); border-radius:100%;}
	.lishi{ position:relative; padding:1.8rem 0}
	.lishi li{ z-index: 10; width:50%; padding:.6rem; position:relative; margin-bottom: .5rem;}
	.lishi li:first-child{ width:100%; padding:0;}
	.lile ,.liri{ width:50%; padding:.6rem; position:relative;}
	.lishi li .line{ width:4.6rem; position:absolute; height:1px; border-bottom:2px dashed #4eb5db;}
	
	.lishi li .lile .line{ right:0; top:0;}
	.lishi li .liri .line{ left:0; top:0;}
	
	.lishi li .liri .line:before{ content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); display:block; width:.17rem; height:.17rem; border-radius:100%; background:#4eb5db}
	.lishi li .lile .line:before,.lishi li>  .line:before{ content:""; position:absolute; left:-2px; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); display:block; width:.17rem; height:.17rem; border-radius:100%; background:#4eb5db}
	
	.lishi li .circle{ width:.46rem; height:.46rem; border-radius:100%; border:.04rem solid #8e9299; position:absolute; left:50%; top:0; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); background:#fff; z-index:2;}
	.lishi li .circle:after{ content:""; display:block; left:50%; top:50%; position:absolute; width:.27rem; height:.27rem; background:#66bbe2; border-radius:100%;transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}
	
.lishi li .line  b{ position:absolute; left:.15rem; bottom:0; line-height:.6rem; font-size:.36rem; color:#8c9195;}	
	.lishi li .txt p{ font-size:.22rem; line-height:1.2;text-align:justify}
	
	.lishi li:nth-child(2n) .line{ right:0; top:0;}
	
	.lishi li:nth-child(2n) .circle{ position:absolute; left:auto; right:0; top:0;transform:translate(50%,-50%); -webkit-transform:translate(50%,-50%);}
	
	
	
	.lishi li:nth-child(2n+1){ margin-top:1.1rem;}
	.lishi li:first-child{ margin-top:0}
.lishi li:nth-child(2n+1) >.line{ left:0; top:0;}
	.lishi li:nth-child(2n+1) > .line b{ right:.15rem; left:auto;}
	.lishi li:nth-child(2n+1) > .circle{ position:absolute; left:0; top:0;transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%);}
.lishi li:first-child > .circle{ left:50%; top:0;}
.lishi li:nth-child(2n+1) >.line:before{ right:-2px; left:auto;}


.lishi li:nth-child(3){ padding-bottom:2.5rem;}
.lishi li:nth-child(5){ margin-top:-1.5rem;}



.lishi li:nth-child(2n) .circle:after{ background:#e05232;}
.lishi li:nth-child(2n) .line{ border-bottom:2px dashed #e05232;}
.lishi li:nth-child(2n) .line:before{ background:#e05232}

.lishi li:nth-child(3n) .circle:after{ background:#699f3d;}
.lishi li:nth-child(3n) .line{ border-bottom:2px dashed #699f3d;}
.lishi li:nth-child(3n) .line:before{ background:#699f3d}

.lishi li:nth-child(4n) .circle:after{ background:#eea243;}
.lishi li:nth-child(4n) .line{ border-bottom:2px dashed #eea243;}
.lishi li:nth-child(4n) .line:before{ background:#eea243}

.lishi li:nth-child(5n) .circle:after{ background:#e2668a;}
.lishi li:nth-child(5n) .line{ border-bottom:2px dashed #e2668a;}
.lishi li:nth-child(5n) .line:before{ background:#e2668a}



.lishi li:nth-child(6n) .circle:after{ background:#2cabbe;}
.lishi li:nth-child(6n) .line{ border-bottom:2px dashed #2cabbe;}
.lishi li:nth-child(6n) .line:before{ background:#2cabbe}

.moreProduct{width: 100%;text-align: center;font-size: 0.3rem;}
.moreProduct a{color: #676767;}
.moreProduct:hover{background-color: #d5dadc;}

.wapphone{ position:fixed; bottom:0; width:100%; background:#66bbe1;}
.wapphone li{ width:25%; text-align:center;  padding:10px; font-size:14px;border-left:1px solid #fff;}
.wapphone li:first-child{ border-left:none;}
.wapphone li a{ color:#fff;}
.wapphone li a i{ margin-right:5px; font-size:16px;    display: block; margin-bottom:5px;}

.pro_nav{ padding-top:.6rem; text-align:center; font-size:.24rem;}
.pro_nav a{     transition: all .3s;
    display: inline-block;
    margin: 0 0.2rem;
    padding: 0;
    background: #fff;
    color: #333;
    line-height: .6rem;
    border: 1px solid #999;
    width: 2.5rem;}
.pro_nav a:hover{ box-shadow:0 0 15px rgba(0,0,0,.3); transform:translateY(-5px); -webkit-transform:translateY(-5px);}


@media screen and (max-width:960px){
 .wap{ display:block;}
	 .pc{ display:none;}
	}


@media screen and (max-width:768px){
	.banner a{ left:20px; bottom:10px; font-size:20px; line-height:1.4; }
	.main01 .w1200{ max-width:none; padding:0 20px;}
	.main01 b{ font-size:22px; line-height:1.4;}
	.main01 p{ font-size:14px; margin-top:20px;}
	.main2le{ width:100%; padding:40px 20px;}
	.main2le b{ font-size:20px; margin-bottom:15px;}
	 .main2le p{ font-size:14px;}
	 .main2ri{ width:100%; border:none; padding:0 20px; padding-bottom:20px;}
	 
	 .pd2{ padding-left:20px; padding-right:20px;}
	 .pro01{ padding-top:40px; padding-bottom:40px;}
	 .pro_tit b{ font-size:20px; line-height:30px;}
	 .pro_tit em{ font-size:20px; padding:0 5px; line-height:30px;}
	 .pro_tit{ margin-bottom:20px;}
	 .protxt{ padding-left:15px;}
	 .protxt p,.pro03 p{ font-size:14px; line-height:1.4; margin-top:15px; margin-bottom:0}
	 .pro03{ padding:0 20px;}
	 .pro02{ margin-bottom:40px;}
	 .pro3le, .pro3ri{ width:100%; }
	 .protxt ul li:before,.yingyong02 ul li:before{ width:10px; height:10px; }
	 .protxt p{ text-align:left;}
	 .protxt ul li{ width:100% !important; font-size:14px;padding-left:20px; margin-top:10px;}
	 .yingyong02 .txt p{ font-size:14px; padding:0 0; line-height:1.6; margin-bottom:15px;color:#676767;}
	 .yingyong02:after{ height:50%;}
	 .yingyong02 ul{ padding-left:0; padding-top:20px;}
	 .yingyong02 ul li{ width:100%; font-size:14px; padding-left:20px; margin-top:10px;}
	 .yingyong02{ padding-top:20px;}
	 
	 .licheng .pro_tit{ padding-left:15px;}
	 .licheng{ padding-top:40px; padding-bottom:40px; padding-left:0; padding-right:0}
	 .lishi li{ padding:15px; margin-bottom:40px;}
	 .lishi{ padding:50px 0;}
	 .lishi li .line b{ left:10px; line-height:30px; font-size:18px;}
	 .lishi li .lile .line:before, .lishi li> .line:before,.lishi li .liri .line:before{ width:10px; height:10px;}
	 .lishi li .line{ width:calc(100% - 15px);}
	 .lishi li .txt p{ font-size:12px; line-height:1.5;}
	 .lishi >.line:before,.lishi >.line:after{ width:20px; height:20px;}
	 .lishi li .circle{ width:20px; height:20px;}
	 .lishi li .circle:after{ width:10px; height:10px;}
	 .lishi li:nth-child(2n+1){ margin-top:40px;}
	 
	 .about2le, .about02ri{padding:0 20px; width:100%;}
	 .about02ri{ padding-top:20px;}
	 .about02ri p{ font-size:14px; line-height:1.6; margin-bottom:10px;}
	 .contact01{ padding-top:40px; padding-bottom:40px;}
	 .contactbox b{ font-size:18px;}
	 .contactbox p{ font-size:14px; margin:5px 0;}
	 .contactbox .line{ margin:30px 0;}
	 .contactbox span img{ width:15px; margin-right:5px;}
	 .contactbox span{ font-size:16px; width:100%;}
	 .contactbox{ max-width:none; padding:20px 0; padding-left:20px;}
	 .pinzhi03 p{ font-size:14px; line-height:1.6; margin-top:15px;}
	 .pinzhile, .pinzhiri{ width:100%}
	 .pinzhile{ padding:0 20px}
	  .pinzhiri{ padding:0 20px;}
	}
.deng{font-family: deng;}
@font-face
{
font-family: deng;
src: url('../fonts/Deng.ttf')
}

@font-face
{
font-family: deng2;
src: url('../fonts/Deng2.ttf')
}
	@font-face
{
font-family: huawenxihei;
src: url('../fonts/huawenxihei.TTF')
}