@charset "utf-8";



.banner{ height:666px; position:relative; overflow:hidden}

.banner .item{ height:666px;background-repeat:no-repeat; background-position:center; background-size:cover}

.banner .slick-dots{ position:absolute; z-index:2; left:0; right:0; bottom:10px; text-align:center}

.banner .slick-dots li{ display:inline-block; width:40px; height:5px; margin:0 5px; background-color:#333; cursor:pointer}

.banner .slick-dots li.slick-active{ background:#db282f}

.banner .slick-dots button{ display:none}



.banner .slick-arrow{ width:54px; height:54px; border:none; background-color:#2F343A; overflow:hidden; cursor:pointer; position:absolute; z-index:2;top:50%; margin-top:-27px; background-repeat:no-repeat; background-position:center; background-size:10px; text-indent:-999px;transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-o-transition: alll 0.3s;}

.banner .slick-arrow:hover{ background-color:#db282f}

.banner .slick-prev{ left:-54px; background-image:url(../images/prev-small.png)}

.banner .slick-next{ right:-54px; background-image:url(../images/next-small.png)}

.banner:hover .slick-prev{ left:0;}

.banner:hover .slick-next{ right:0;}

.banner .txtbox{ max-width:1160px; margin:0 auto;height:100%; position:relative}



.banner .txtbox h2{transition: all 2s;-moz-transition: all 2s;-webkit-transition: all 2s;-o-transition: alll 2s;position:absolute; left:0;top:-100%; opacity:0; z-index: 50; font-size: 52px; font-weight: lighter; line-height: 56px; min-width: 50px; color: rgb(255, 255, 255); background-color: rgb(219, 40, 46); display: inline-block !important; padding: 14px 20px 15px}

.banner .txtbox .p{transition: all 2s;-moz-transition: all 2s;-webkit-transition: all 2s;-o-transition: alll 2s;position:absolute; left:0; bottom:-100%; opacity: 0; z-index: 50;margin-left:200px; font-size: 18px; line-height: 30px; min-width: 50px; color: rgb(0, 0, 0); background-color: rgb(255, 255, 255); display: inline-block !important; padding: 10px 20px;}

.banner .txtbox .more{transition: all 2s;-moz-transition: all 2s;-webkit-transition: all 2s;-o-transition: alll 2s;position:absolute; left:-100%; opacity:0; z-index: 50;bottom:30%}

.banner .txtbox .more a{font-size: 14px;background-color:#000; line-height: 36px; color:#fff; height: 36px; padding: 0px 20px 0px 20px; display: inline-block;color:#fff;}

.banner .txtbox .more:after{content:""; width: 36px; height: 36px; background-color: #ffffff !important; background-image: url(../images/arrow-rm.png); background-position: center center; background-repeat: no-repeat; transition: all 0.3s ease 0s; -webkit-transition-duration: 0.3s; -webkit-transition-timing-function: ease;right:-36px;position:absolute}



.banner .slick-active .txtbox h2{ top: 36%; opacity:1}

.banner .slick-active .txtbox .p{ bottom: 45%; opacity: 1;}

.banner .slick-active .txtbox .more{left:0; opacity:1;}



.index01{ margin-top:-100px; position:relative; z-index:33; padding-bottom:40px;}

.index01 ul{ margin-left:-8px; margin-right:-8px;}

.index01 li{ width:25%; float:left; text-align:center}

.index01 li a{ display:block; margin:0 8px; border:1px solid #e1e1e3; padding:20px; padding-top:46px; border-radius:5px; background-color:#fff; position:relative}

.index01 li a:after{ content:""; display:block; height:18px; position:absolute; z-index:1; bottom:-18px; left:0; right:0; background:url(../images/ico-shadow.png) no-repeat center top; background-size:auto 100%}

.index01 li .ico{ height:76px; background-position:center; background-repeat:no-repeat; background-size:auto 100%; margin-bottom:45px;}

.index01 li a:hover{ background-color:#db282f; color:#fff}

.index01 li a:hover h3{ color:#fff}

.index01 li .ico-a01{ background-image:url(../images/ico-a01.png)}

.index01 li .ico-a02{ background-image:url(../images/ico-a02.png)}

.index01 li .ico-a03{ background-image:url(../images/ico-a03.png)}

.index01 li .ico-a04{ background-image:url(../images/ico-a04.png)}

.index01 li a:hover .ico-a01{ background-image:url(../images/ico-a01h.png)}

.index01 li a:hover .ico-a02{ background-image:url(../images/ico-a02h.png)}

.index01 li a:hover .ico-a03{ background-image:url(../images/ico-a03h.png)}

.index01 li a:hover .ico-a04{ background-image:url(../images/ico-a04h.png)}

.index01 li h3{ font-size:24px; font-weight:normal; color:#000; margin-bottom:10px}

.index01 li .ms{ height:80px;}



.index02{ padding:40px 0}

.index02 .bd{ max-width:760px; margin:0 auto; padding-left:152px; background:url(../images/ico-index0201.png) no-repeat center left; background-size:132px; font-size:30px; line-height:1.6}

.index02 .bd a{ font-size:30px; font-weight:lighter}

.index02 .bd a span{ font-size:48px;}

.index02 .bd .p2{ text-indent:-10px}

.index02 .bd .p1{letter-spacing:2px}



.index03{ padding-top:40px;}

.plo{ text-align:center; font-size:18px; position:relative; line-height:1.6; margin-bottom:50px; text-transform:uppercase}

.plo:after{ content:""; display:inline-block;width:46px; height:4px; background-color:#cccccc; border-radius:4px; }

.plo h3{ font-weight:normal; color:#000}

.index03 .bd{ overflow:hidden; position:relative}

.index03 .bd ul{ float:left; width:25%}

.index03 .bd ul li a{ display:block; position:relative;}

.index03 .bd ul li a:before{transition: all 0.3s;-moz-transition: all 0.3s;-webkit-transition: all 0.3s;-o-transition: alll 0.3s; content:""; display:block; position:absolute; z-index:1; left:0; right:0;top:0; bottom:0; background:rgba(0,0,0,.3)}

.index03 .bd ul li a:hover:before{ opacity:0;}

.index03 .bd ul img{ display:block; width:100%}

.index03 .bd .slick-arrow{ width:4.2vw; height:8.2vw; border:none; display:block; background-color:transparent; position:absolute; z-index:1;top:50%; margin-top:-4.1vw; background-position:center; background-size:100%; overflow:hidden; text-indent:-999px; cursor:pointer}

.index03 .bd .slick-prev{ left:0; background-image:url(../images/left-btn.png);}

.index03 .bd .slick-next{ right:0; background-image:url(../images/right-btn.png);}



.index04{ padding-top:65px; padding-bottom:70px;}

.index04 .bd{ text-align:center; line-height:2}



.index05{ background:url(../images/index05bg.jpg) no-repeat center; background-size:cover; text-align:center; color:#fff;  padding-top:110px; padding-bottom:120px}

.index05 h3{font-size:24px; font-weight:normal;}

.index05 h3 i{ color:#db282f}



.index06{padding:30px 0;}

.index06 li{ float:left; width:25%;}

.index06 li a{ color:#000; display:block; font-size:18px; height:30px; line-height:30px; background-repeat:no-repeat; background-position:center left; background-size:auto 100%; padding-left:45px }

.index06 li a:hover{ color:#db282f}

.index06 li.li1 a{ background-image:url(../images/ico-b01.png)}

.index06 li.li2 a{ background-image:url(../images/ico-b02.png)}

.index06 li.li3 a{ background-image:url(../images/ico-b03.png)}

.index06 li.li4 a{ background-image:url(../images/ico-b04.png)}

.index06 li.li1 a:hover{ background-image:url(../images/ico-b01h.png)}

.index06 li.li2 a:hover{ background-image:url(../images/ico-b02h.png)}

.index06 li.li3 a:hover{ background-image:url(../images/ico-b03h.png)}

.index06 li.li4 a:hover{ background-image:url(../images/ico-b04h.png)}



.index07{ height:685px; position:relative}

#allmap{ height:100%; width:100%; position:absolute; z-index:1; left:0;top:0;}

 



.index07 .adderbox{ position:absolute; z-index:2; width:415px; left:50%; margin-left:88px; background-color:#eeeeee; padding-bottom:70px; top:30px;}

.adderbox .hd{ height:214px; background-color:#db282f; background-image:url(../images/addlogo.png); background-repeat:no-repeat; background-position:30px center; background-size:170px;}

.adderbox ul{ background-color:#fff; padding:30px; font-size:16px; }

.adderbox ul li{ margin-bottom:10px}

.adderbox ul a{ font-size:16px}

.adderbox ul .l1{ font-size:24px; color:#000}





.lanmu{ padding-top:20px; padding-bottom:100px}

.lanmu .weap{ position:relative}

.nbanner{ height:350px; background-repeat:no-repeat; background-position:center; background-size:cover}



.aboutpage{ max-width:860px; float:right; position:relative}

.aboutpage .title{ font-size:30px; line-height:1.2; margin-bottom:40px; padding-right:300px}

.aboutpage .aboutlogo{ position:absolute; z-index:1; right:0;top:-170px; width:290px;}

.aboutpage .aboutlogo img{ display:block; width:100%}

.aboutpage .aboutconn{ overflow:hidden}

.aboutpage .aboutconn img{ max-width:100%; height:auto !important}





.sidebox{ float:left; width:172px; margin-right:35px;}

.sidebox .hd h3{ height:40px; line-height:40px; background-color:#000; text-align:center; color:#fff; font-size:18px;}

.sidebox .hd h3 a{ font-size:18px; color:#fff}

.lanmuright{ overflow:hidden}

.list01 ul{ margin-left:-17px; margin-right:-17px; margin-bottom:30px;}

.list01 li{ float:left; width:33.33%; text-align:center; margin-bottom:15px}

.list01 li a{ display:block; margin:0 17px;}

.list01 li .img{ border:1px solid #eee; overflow:hidden; margin-bottom:15px; }

.list01 li h3{ font-weight:normal; color:#000;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

.list01 li img{ display:block; width:100%; height:292.95px}

.list01 .more{ text-align:center;}

.list01 .more span{ width:140px; height:40px; line-height:40px; text-align:center; color:#db282f; border:1px solid #dfdfe0; background-color:#f6f6f8; border-radius:40px; cursor:pointer; display:inline-block}

.list01 .more span:after{ content:""; display:inline-block; vertical-align:middle; width:11px; height:6px; margin-left:5px; background:url(../images/ico-02.png) no-repeat center; background-size:auto 100%}



.pro_btn{ text-align:center; margin-top: 30px}

 .pro_btn span{ width:140px; height:40px; margin-top: 30px;  line-height:40px; text-align:center; color:#db282f; border:1px solid #dfdfe0; background-color:#f6f6f8; border-radius:40px; cursor:pointer; display:inline-block}

 .pro_btn span:after{ content:""; display:inline-block; vertical-align:middle; width:11px; height:6px; margin-left:5px; background:url(../images/ico-02.png) no-repeat center; background-size:auto 100%}



.sidenav { margin-top:5px}

.sidenav li{ margin-bottom:5px;}

.sidenav li a{ display:block;    background: #eee; color:#999; line-height:40px; padding-left:42px;}

.sidenav li a:hover,.sidenav li.on a{ background-color:#db282f; color:#fff}

.sideadder{ background-color:#eeeeee; padding:10px 0;}

.sideadder li{ padding-left:42px; height:18px; line-height:18px; background-repeat:no-repeat; background-position: 15px center; margin-bottom:10px}

.sideadder li.l1{ background-image:url(../images/ico-d01.png)}

.sideadder li.l2{ background-image:url(../images/ico-d02.png)}

.sideadder li.l3{ background-image:url(../images/ico-d03.png)}



.path{ margin-bottom:20px; position:relative; line-height:16px; padding-left:15px; margin-top:10px}

.path:before{ content:""; display:block; width:4px; height:16px; border-radius:4px; background-color:#db282f; position:absolute; z-index:1; left:0;top:0}



.caseprevnext{ text-align:right; margin-bottom:10px}

.caseprevnext a{ display:inline-block; color:#7f7f7f; width:40px; height:40px; line-height:40px; border:1px solid #cdcdcd; border-radius:40px; margin-left:5px; text-align:center; font-family:"宋体"; font-size:26px}

.caseprevnext a:hover{ background-color:#ffe5e5; border:1px solid #ff0606; color:#ff7272}

.casepagebox{ padding-right:266px;}

.casepageconn { overflow:hidden; border:1px solid #eee; margin-top:10px}

.casepageconn img{ max-width:100%; height:auto !important}

.caseside{ position:absolute; z-index:1; right:0;top:0; width:244px;}

.caseside01{ padding:15px; background-color:#f3f3f3}

.caseside .ms{ color:#999}

.caseside02{ padding:15px; background-color:#ebebeb}



.contactpage{ max-width:1002px; margin:0 auto; }

.contactpage01{padding-top:10px; padding-bottom:50px; overflow:hidden}

.contactpage01 ul{ margin-left:-10px; margin-right:-10px}

.contactpage01 li { float:left; width:25%;}

.contactpage01 li a{display: block; height: 155px; transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transition: all 0.3s;background-repeat:no-repeat;background-position: center 0;background-size:auto 310px;margin:0 10px;}

.contactpage01 li.l1 a{background-image:url(../images/lx_icon01.jpg);}

.contactpage01 li.l1 a:hover{background-position:center -155px;}

.contactpage01 li.l2 a{background-image:url(../images/lx_icon02.jpg);}

.contactpage01 li.l2 a:hover{background-position:center -155px;}

.contactpage01 li.l3 a{background-image:url(../images/lx_icon03.jpg);}

.contactpage01 li.l3 a:hover{background-position:center -155px;}

.contactpage01 li.l4 a{background-image:url(../images/lx_icon04.jpg);}

.contactpage01 li.l4 a:hover{background-position:center -155px;}

.contactpage02{height:340px}





.list02 ul{ height:1740px;position:relative}

.list02 li{ position:absolute; z-index:3}

.list02 ul:hover li:before{ content:"";transition: all 0.3s; display:block; position:absolute; z-index:1; left:0; right:0;top:0; bottom:0; background:rgba(0,0,0,.3)}

.list02 ul li:hover:before{ display:none !important}

.list02 li img{ display:block; width:100%}

.list02 .l1{width:356px;  top:0px; left:0px;}

.list02 .l2{width:595px; top:0px; right:0px;}

.list02 .l3{width:595px; top:235px; right:0px;}

.list02 .l4{width:314px; top:626px; left:0px;}

.list02 .l5{width:637px; top:626px; right:0px;}

.list02 .l6{width:475px; top:998px; left:0px;}

.list02 .l7{width:475px; top:998px; right:0px;}

.list02 .l8{width:265px; top:1369px; left:0px;}

.list02 .l9{width:265px; top:1369px; left:267px;}

.list02 .l10{width:419px; top:1369px; right:0px;}



.list03 ul{ height:1300px;position:relative}

.list03 li{ position:absolute; z-index:3}

.list03 ul:hover li:before{transition: all 0.3s; content:""; display:block; position:absolute; z-index:1; left:0; right:0;top:0; bottom:0; background:rgba(0,0,0,.3)}

.list03 ul li:hover:before{ display:none !important}

.list03 li img{ display:block; width:100%}

.list03 .l1{width:953px;  top:0px; left:0px;}

.list03 .l2{width:298px; top:433px; left:0px;}

.list03 .l3{width:653px; top:433px; right:0px;}

.list03 .l4{width:449px; top:865px; left:0px;}

.list03 .l5{width:502px; top:865px; right:0px;}

@media(max-width:1200px) {

.banner{ height:55.5vw}

.banner .item{ height:55.5vw}

.banner .txtbox{ margin:0 10px}

.banner .txtbox h2{ font-size:4.3vw; line-height:4.6vw;min-width:4.1vw;padding:1.16vw 1.6vw 1.25vw;}

.banner .txtbox .p{ font-size:1.5vw; margin-left:16.6vw; padding:.8vw 1.6vw; line-height:2.5vw}

.banner .slick-active .txtbox h2{top:30%}

.banner .slick-active .txtbox .p{ bottom:51%}



.list02 ul{ height:144vw;}

.list02 .l1{width:37.35%; top:0px; left:0px;}

.list02 .l2{width:62.43%; top:0px; right:0px;}

.list02 .l3{width:62.43%; top:18.5vw; right:0px;}

.list02 .l4{width:32.94%; top:49.8vw; left:0px;}

.list02 .l5{width:66.84%; top:49.8vw; right:0px;}

.list02 .l6{width:49.84%; top:80vw; left:0px;}

.list02 .l7{width:49.84%;top:80vw; right:0px;}

.list02 .l8{width:27.8%;  top:110vw; left:0px;}

.list02 .l9{width:27.8%;  top:110vw; left:28%;}

.list02 .l10{width:43.96%; top:110vw; right:0px;}

.nbanner{ height:28vw; }





.list03 ul{ height:108vw;position:relative}

.list03 li{ position:absolute;}

.list03 li img{ display:block; width:100%}

.list03 .l1{width:100%;  top:0px; left:0px;}

.list03 .l2{width:31.26%; top:36vw; left:0px;}

.list03 .l3{width:68.52%; top:36vw; right:0px;}

.list03 .l4{width:47.11%; top:72vw; left:0px;}

.list03 .l5{width:52.67%; top:72vw; right:0px;}



.list01 li img{ height:24.4vw;}

}

@media(max-width:1160px) {.caseside{ right:10px;}}

@media(max-width:1006px) {

.index01 li a:after{ height:1.78vw; bottom:-1.78vw}

.index01 li .ico{ margin-bottom:15px; height:66px;}

.index01 li a{ padding-top:25px}

.index01 li h3{ font-size:20px;}



.index07{ height:500px;}

.index07 .adderbox{ margin-left:0; right:10px; left:auto; padding-bottom:20px}

.adderbox .hd{ height:120px;    background-size: 80px;background-position: 20px center;}

.adderbox ul{ padding:20px;}



.contactpage01 li a{ height:120px;background-size: auto 240px;}

.contactpage01 li.l1 a{background-position:center 0px !important;}

.contactpage01 li.l2 a{background-position:center 0px !important;}

.contactpage01 li.l3 a{background-position:center 0px !important;}

.contactpage01 li.l4 a{background-position:center 0px !important;}

}

@media(max-width:999px) {

.index01{ margin-top:-50px;}





} 

@media(max-width:851px) {



.lanmu{ padding-top:10px; padding-bottom:50px;}

.sidebox .hd{ display:none;}

.sideadder{ display:none;}

.sidebox{ float:none; margin-bottom:10px; width:auto; margin-right:0; padding:0}

.sidenav{ overflow:hidden;}

.sidenav ul{ margin-left:-3px; margin-right:-3px;}

.sidenav li{ margin-bottom:6px; width:33.33%; float:left}

.sidenav li a{ padding-left:10px; margin:0 3px; height:36px; line-height:36px}

.path{ display:none}

.list01 ul{ margin-left:-5px; margin-right:-5px;}

.list01 li{ width:50%}

.list01 li a{ margin:0 5px;}

.list01 li{ margin-bottom:10px}

.list01 .more span{ width:120px; height:36px; line-height:36px; font-size:13px}

.list01 .more span:after{ height:4px}



.sideboxfix{ position:static !important}

.casepagebox{ padding-right:0}

.caseside{ position:static !important; width:auto; margin-top:10px}

.caseprevnext{ display:none}

.list01 li img{ height:47.9vw;}



.list02 ul{ height:174vw;}

.list02 .l3{top:23.5vw}

.list02 .l4{top:62.6vw}

.list02 .l5{top:62.6vw}

.list02 .l6{top:99.8vw}

.list02 .l7{top:99.8vw}

.list02 .l8{top:136.9vw}

.list02 .l9{top:136.9vw}

.list02 .l10{top:136.9vw}





.list03 ul{ height:130vw} 

.list03 .l1{width:100%;  top:0px; left:0px;}

.list03 .l2{width:31.26%; top:43.3vw; left:0px;}

.list03 .l3{width:68.52%; top:43.3vw; right:0px;}

.list03 .l4{width:47.11%; top:86.5vw; left:0px;}

.list03 .l5{width:52.67%; top:86.5vw; right:0px;}



}	 

@media(max-width:780px) {

.index02 .bd{ font-size:3.7vw; padding-left:18vw; background-size:16.9vw;}

.index02 .bd a span{ font-size:6.15vw;}

.index02 .bd a{font-size:3.7vw;}

}



@media(max-width:760px) {

.index01{ margin-top:0; padding:20px 0}	

.index01 li{ width:50%; margin-bottom:20px}

.index01 ul{ margin-left:-5px; margin-right:-5px;}

.index01 li a{ padding:10px; margin:0 5px;}

.index01 li .ico{ height:40px; margin-bottom:10px;}

.index01 li h3{ font-size:18px}

.index01 li a:after{height: 3.6vw;bottom: -3.6vw;}

.index02 .bd{ font-size:3.5vw}

.index02 .bd a{ font-size:3.5vw}

.index02{ padding:10px 0}

.index03{ padding:20px 0}

.plo{ margin-bottom:20px}

.banner .slick-arrow{ width:6.8vw; height:6.8vw; margin-top:-3.4vw}

.banner .slick-dots{ bottom:5px; display:block}

.banner .slick-dots li{ height:4px; width:30px; margin:0 3px}

.banner .txtbox .more{ bottom:23%}

.banner .txtbox .more a{ line-height:24px; height:24px; font-size:12px; padding:0 10px}

.banner .txtbox .more:after{ width:24px; height:24px; right:-24px;}

.index04{ padding-top:20px; padding-bottom:25px;}

.index05{ padding-top:70px; padding-bottom:80px;}

.index05 h3{ font-size:20px}

.index06 li{ width:50%; margin:10px 0}

.index06 li a{ font-size:16px}



.index07 .adderbox{ width:auto; left:30px; right:30px;top:auto; bottom:80px;padding-bottom:10px}

.adderbox .hd{ height:60px; background-size:40px}

.adderbox ul .l1{ font-size:20px;}

.adderbox ul{ font-size:14px; background:rgba(255,255,255,.6)}

.index07 .adderbox{ background-color:rgba(204,204,204,.5)}

.adderbox ul a{ font-size:14px}

.adderbox ul li{ margin-bottom:5px}





.aboutpage .aboutlogo{ width:36.5vw;top:-21.2vw}

.aboutpage .title{ padding-right:37vw; font-size:20px; margin-bottom:6vw}





.list01 li .img{ margin-bottom:10px;}

.list01 li{ margin-bottom:10px}





.contactpage01 li a{ background-color:#ccc}

.contactpage01{ padding-top:0; padding-bottom:10px}

.contactpage01 li{ width:50%; margin-bottom:10px}

.contactpage02{ height:280px}

.contactpage01 ul{ margin-left:-5px; margin-right:-5px;}

.contactpage01 li a{ height:100px;background-size: auto 200px; margin:0 5px}

.contactpage01 li.l1 a{background-position:center 0px !important;}

.contactpage01 li.l2 a{background-position:center 0px !important;}

.contactpage01 li.l3 a{background-position:center 0px !important;}

.contactpage01 li.l4 a{background-position:center 0px !important;}

}

