@charset "utf-8";

@import url('../font/webFont.css');

body,td,th,input,textarea,select{font-family: "Microsoft YaHei", 微软雅黑, "Open Sans", Economica, sans-serif; color:#777177; outline:none;}
html{font-size:62.5%; overflow-x:hidden;}
html,body{background:#fff; height:100%;}
html,body,form{margin:0;}
img{border:0px none; vertical-align:middle; outline:none; max-width:100%; width:auto; height:auto;}
ul,dl{display:block; margin:0; padding:0;}
ul,dl{display:block; margin:0; padding:0;}
dd{margin:0; padding:0;}
li{list-style:none;}
p{display:block; margin:0; padding:0;}
a,button,input,img,div,p,li,span{border:0px none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent;}
a{text-decoration:none; color:#777177; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent;}
a:active{color:#226e70;}
*:after{content:''; display:block; height:0; clear:both;}
#think_page_trace_open{z-index:999998;}
mark{display:inline-block;}

.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}

#all{width:100%; height:100%; transition:transform .3s;}
#black{content:''; display:block; width:100%; height:100%; position:fixed; z-index:98; left:0; top:0; background:rgba(0,0,0,.5); display:none;}
#all.move{transform:translateX(-200px);}
#outer{width:200px; height:100%; position:fixed; z-index:99; background:#f4f5f6; right:0; top:0; transform:translateX(200px); transition:transform .3s; overflow:auto;}
#outer.move{transform:translateX(0px);}
#outer>a{display:block; font-size:1.5rem; transition:all .25s; padding:2.6rem 0 2.6rem 3.2rem; border-bottom:1px solid #e8e8e8;}
#outer>a>i{display:inline-block; width:32px; vertical-align:middle; font-size:2.4rem;}
#outer>a>i.icon-home{font-size:2.8rem; margin-left:-4px; margin-right:4px;}
#outer>a:hover{background:#d8ae5d; color:#fff;}
#outer>div{background:#e8e8e8; display:none;}
#outer>div>a{display:block; font-size:1.4rem; padding:2rem 0 2rem 5.8rem; border-bottom:1px solid #fff; transition:all .25s;}
#outer>div>a:hover{background:#018635; color:#fff;}

#outer::-webkit-scrollbar{width:8px; height:8px;}
#outer::-webkit-scrollbar-track{background:#fff;}
#outer::-webkit-scrollbar-thumb{background:#1b1b1b;}
#outer::-webkit-scrollbar-thumb:vertical:hover{background: #5d92fe;}



#nav{background:#018635; width:96px; height:93px; position:fixed; z-index:99; right:0; top:0; color:#fff; transition:transform .3s, background .2s;}
#nav.move{transform:translateX(-200px);}
#nav>span{display:block; width:100%; text-align:center; font-size:2.5rem; margin-top:22px;}
#nav>p{font-weight:bold; text-align:center; margin-top:7px;}
#nav:hover{background:#d8ae5d;}


#head{border-bottom:1px solid rgba(255,255,255,.16); width:100%; height:92px; position:fixed; left:0; top:0; z-index:4; transition:background .35s, opacity .25s}
#head .logo{height:100%;}
#head .logo a{display:block; width:150px; height:46px; margin:23px 0 0 36px; position:relative;}
#head .logo a>img{height:100%; position:absolute; left:0; top:0; transition:all .3s;}
#head .logo a>img.blue{opacity:0;}
#head .logo a>span{color:#fff; position:absolute; right:0; top:-10px; transform:scale(.9); transition:all .35s;}
#head.active{background:#fff;}
#head.active .logo a>img.white{opacity:0;}
#head.active .logo a>img.blue{opacity:1;}
#head.active a>span{color:#666;}
#head.hide{opacity:0; z-index:0;}

#menu{position:absolute; z-index:2; right:230px; top:0; height:100%; width:800px;}
#menu>li{float:left; height:92px;}
#menu>li>a{display:block; color:#fff; font-size:1.6rem; line-height:90px; padding:0 28px; transition:color .25s;}
#menu>li>a:hover, #menu>li:hover>a{color:#018635 !important;}
#head.active #menu>li>a{color:#464646;}

#menu>li>.d1{position:fixed; width:100%; left:0; height:0; margin:3px auto auto auto; background:#fff; overflow:hidden; transition:all .35s;}
#menu>li>.d1.active{height:613px;}
#menu>li>.d1 .wrap{display:table; table-layout:fixed; width:100%;}
#menu>li>.d1 dl{display:table-cell; width:25%; box-sizing:border-box; border-right:1px solid #e8e8e8;}
#menu>li>.d1 dl:last-child{border-right:0px none;}
#menu>li>.d1 dl>dt>a{display:block; height:54px; line-height:52px; background:#f4f5f6; text-align:center; font-size:1.7rem; color:#464646; transition:all .25s; white-space:normal; overflow:hidden; text-overflow:ellipsis;}
#menu>li>.d1 dl:hover>dt>a{background:#018635; color:#fff;}
#menu>li>.d1 dl>dd{padding:25px 30px 30px 30px; min-height:449px;}
#menu>li>.d1 dl>dd>a{display:table; table-layout:fixed; font-size:1.4rem; padding:5px 0 5px 0; width:100%;}
#menu>li>.d1 dl>dd>a img{display:inline-block; width:50px; height:50px; background:#eee; margin-right:10px; transition:all .2s;}
#menu>li>.d1 dl>dd>a:hover img{margin-left:6px; margin-right:10px;}
#menu>li>.d1 dl>dd>a p{display:table-cell; vertical-align:middle; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%; position:relative; padding:1px 0;}
#menu>li>.d1 dl>dd>a p:after{content:''; display:block; width:0; height:1px; position:absolute; left:0; bottom:0; background:#888;}
#menu>li>.d1 dl>dd>a:hover p{color:#333;}
#menu>li>.d1 dl>dd>a:hover p:after{width:100%;}
#menu>li>.d1 .more{display:block; height:56px; line-height:54px; background:#eaf2f7; text-align:center; font-size:1.7rem; color:#333; transition:all .25s;}
#menu>li>.d1 .more i{font-size:2.8rem; vertical-align:middle; margin-right:.5rem; display:inline-block;}
#menu>li>.d1 .more:hover{background:#dbebf5;}

#menu>li>.d2{position:fixed; width:100%; left:0; margin:3px auto auto auto; background:#fff; overflow:hidden; transition:height .3s; height:0;}
#menu>li>.d2.active{height:250px; border-top:1px solid #e6e6e6;}
#menu>li>.d2 .wrap{width:100%; margin:auto; padding:20px 25px 30px 25px; box-sizing:border-box;}
#menu>li>.d2 .wrap a{display:block; float:left; width:20%; box-sizing:border-box; padding:10px; font-size:1.5rem;}
#menu>li>.d2 .wrap a>p{background:#f4f5f6; box-sizing:border-box; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:all .2s; padding:5px 10px;}
#menu>li>.d2 .wrap a:hover>p{background:#e8e8e8; color:#464646; transition:all .25s;}
#menu>li>.d2 .wrap a>p img{display:inline-block; width:60px; height:60px; margin-right:5px; transition:all .2s;}
#menu>li>.d2 .wrap a:hover>p img{margin-left:6px;}
#menu>li>.d2 .wrap a.more p{background:#eaf2f7; border:0px none; height:70px; line-height:68px; padding:0; text-align:center; color:#464646; transition:all .25s;}
#menu>li>.d2 .wrap a.more p:after{display:none;}
#menu>li>.d2 .wrap a.more p>i{font-size:2.4rem; display:inline-block; vertical-align:middle; margin-right:.5rem;}
#menu>li>.d2 .wrap a.more:hover p{background:#dbebf5;}

#menu>li>.same{position:fixed; width:100%; left:0; margin:2px auto auto auto; background:#fff; overflow:hidden; transition:height .3s; height:0; box-sizing:border-box;}
#menu>li>.same.active{height:400px; border-top:1px solid #e6e6e6;}
#menu>li>.same .wrap{width:1200px; padding:50px 0; margin:auto;}
#menu>li>.same .l{width:380px; float:left;}
#menu>li>.same .l .tit{font-size:4rem; color:#464646; position:relative; margin-bottom:50px;}
#menu>li>.same .l .tit:after{width:42px; height:4px; background:#018635; content:''; display:block; position:absolute; left:0; bottom:-20px;}
#menu>li>.same .desc{color:#999; line-height:1.8; font-size:1.5rem;}

#menu>li>.same .c{width:200px; float:left; margin-left:160px;}
#menu>li>.same .c>a{display:block; font-size:1.8rem; padding:10px 0 10px 0; border-bottom:1px solid #fff; transition:padding-left .25s;}
#menu>li>.same .c>a:hover{border-bottom:1px solid #888; color:#333; padding-left:8px;}

#menu>li>.same .r{width:300px; float:right;}
#menu>li>.same .r .img{width:300px; height:200px; background:#eee; margin-top:10px;}
#menu>li>.same .r .desc{margin-top:10px; font-size:1.7rem; color:#666;}

#lan{width:80px; height:92px; line-height:90px; color:#fff; position:absolute; z-index:3; right:186px; top:0; text-align:center; transition:color .3s; text-align: center;}
#lan>svg{font-size: 1.86rem; vertical-align: middle;}
#lan>span{display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 1.6rem; transition: all .3s;}
#lan:hover>span{color: #018635 !important;}

#search{width:80px; height:92px; line-height:90px; color:#fff; position:absolute; z-index:3; right:116px; top:0; text-align:center; transition:color .3s;}
#search>span{font-size:2.2rem;}
#search:hover{color:#018635 !important;}
#head.active #search{color:#999;}

@media (max-width:1440px){
  #menu{width:770px;}
  #menu>li>a{font-size:1.5rem;}

  #menu>li>.d1 dl>dt>a{font-size:1.6rem;}

  #menu>li>.d2 .wrap a>p{padding:4px 8px; font-size:1.5rem;}
  #menu>li>.d2 .wrap a.more p{height:68px; line-height:66px;}
}
@media (max-width:1366px){
  #menu>li>.d1 dl>dt>a{font-size:1.5rem;}

  #menu>li>.d1 dl>dd{padding:20px 20px;}
  #menu>li>.d1 dl>dd>a{font-size:1.3rem; padding:4px 0;}

  #menu>li>.same .c>a{font-size:1.6rem;}
  #menu>li>.same .r .desc{font-size:1.5rem;}
}
@media (max-width:1280px){
  #menu{width:730px;}
  #menu>li>a{padding:0 25px;}

  #menu>li>.d1 dl>dt>a{font-size:1.4rem;}
  #menu>li>.d1 dl>dd>a{font-size:1.3rem; padding:3px 0;}
  #menu>li>.d1 .more{font-size:1.5rem;}

  #menu>li>.d2 .wrap a{padding:8px;}
  #menu>li>.d2 .wrap a>p{padding:4px 6px; font-size:1.4rem;}
  #menu>li>.d2 .wrap a.more p{height:68px; line-height:66px;}

  #menu>li>.same .wrap{width:330px; width:1100px;}
  #menu>li>.same .l .tit{font-size:4.6rem;}
  #menu>li>.same .desc{font-size:1.4rem;}
  #menu>li>.same.active{height:380px;}

  #menu>li>.same .c{width:200px; float:left; margin-left:140px;}
}
@media (max-width:1080px){
  #all.move{transform:translateX(-160px);}
  #outer{width:160px; transform:translateX(160px);}
  #outer>a{font-size:1.4rem; transition:all .25s; padding:1.7rem 0 1.7rem 2.5rem;}

  #nav{width:66px; height:66px; transition:transform .3s, background 0s;}
  #nav:hover{background:#018635;}
  #nav.move{transform:translateX(-160px);}
  #nav>span{font-size:1.7rem; margin-top:16px;}
  #nav>p{margin-top:5px; font-size:.9rem;}
  #nav:active{background:#d8ae5d;}

  #head{background:#fff; height:65px;}
  #head .logo a{width:108px; height:32px; margin:16px 0 0 20px;}
  #head .logo a>img.white{opacity:0;}
  #head .logo a>img.blue{opacity:1;}
  #head .logo a>span{color:#666; top:-7px; transform:scale(1);}

  #lan{display: none;}

  #search{width:65px; height:65px; line-height:63px; color:#777177; right:68px; top:0;}
  #search>span{font-size:2.2rem;}

  #menu{display:none;}
}



#contact{height:360px; background:#f4f5f6; position:relative; z-index:3; overflow:hidden;}
#contact .wrap{margin:70px 155px; position:relative;}
#contact .left { width:200px; float:left; padding-right:5%; }
#contact .left a{display:block; margin-bottom:15px;}
#contact .left a p{font-family:Montserrat; color:#ccc; font-size:1.9rem; font-weight:600; display:inline-block; vertical-align:middle; margin-left:.6rem;}
#contact .left a span{display:inline-block; vertical-align:middle; font-size:1.5rem;}
#contact .left a.active p, #contact .left a.active span{color:#464646;}

#contact .center{width:100%; margin:auto;}
#contact .center .l{ float:left; position:relative;}
#contact .center .l .item{display:none;}
#contact .center .l .item p { font-size:1.6rem; margin-bottom:8px; }

#contact .center .l .item .con span, #contact .center .l .item .con a{display:inline-block;}
#contact .center .tit{color:#464646; border-bottom:1px solid #e6e6e6; padding:0 0 18px 2px; font-size:1.8rem; font-weight:bold;}
#contact .center .l .tit>span{font-weight:normal; font-size:1.4rem;}
#contact .center .l .con{margin-top:26px; padding-left:2px; font-size:1.4rem;}
#contact .center .l .con p{ margin-bottom:8px;}
#contact .center .l .con .nav{width:110px; height:36px; border:1px solid #e4e4e4; border-radius:100px; display:block; font-size:1.2rem; text-align:center; line-height:35px; color:#333; margin-top:25px; transition:all .25s;}
#contact .center .l .con .nav i{display:inline-block; font-size:1.5rem; vertical-align:middle; margin-right:.4rem;}
#contact .center .l .con .nav:hover{background:#333; color:#fff; border:1px solid #333;}

#contact .center .r{ width:300px; float:right; margin-right: 10%;}
#contact .center .r .con{margin-top:26px; padding-left:2px;}
#contact .center .r .con .item{width:98px; float:left; margin-right:25px; text-align:center; color:#464646;}
#contact .center .r .con .img{width:98px; height:98px;}
#contact .center .r .con .title{font-size:1.2rem; margin-top:.8rem;}

#contact .right{ width:220px; float:right;}
#contact .right .tit{color:#464646; border-bottom:1px solid #e6e6e6; padding:0 0 18px 2px; font-size:1.8rem; font-weight:bold;}
#contact .right .con{margin-top:26px; padding-left:2px;}
/*
#contact .right .con a{display:block; width:116px; height:36px; border:1px solid #e4e4e4; font-size:1.2rem; text-align:center; line-height:35px; color:#333; margin-bottom:5px; transition:all .25s;}
#contact .right .con a i{display:inline-block; vertical-align:middle; font-size:1.4rem; margin-right:.5rem;}
#contact .right .con a:hover{background:#333; color:#fff; border:1px solid #333;}
*/
#contact .right .con p{ margin-bottom:8px;}
#contact .right .con .nav{width:110px; height:36px; border:1px solid #e4e4e4; border-radius:100px; display:block; font-size:1.2rem; text-align:center; line-height:35px; color:#333; margin-top:25px; transition:all .25s;}
#contact .right .con .nav i{display:inline-block; font-size:1.5rem; vertical-align:middle; margin-right:.4rem;}
#contact .right .con .nav:hover{background:#333; color:#fff; border:1px solid #333;}


@media (max-width:1680px){
  #contact .wrap{margin:70px 125px;}
}
@media (max-width:1440px){
  #contact{height:336px;}
  #contact .wrap{margin:65px 100px;}
}
@media (max-width:1366px){
  #contact{height:326px;}
  #contact .wrap{margin:58px 80px;}
  #contact .center .l{ }
  #contact .center .r{ width:200px; margin-right: 5%; }
}
@media (max-width:1080px){
  #contact{height:auto;}
  #contact .wrap{margin:35px 20px 25px 20px;}
  #contact .left{ display:none; }
  #contact .l{ display:none; }
  #contact .r{ display:none; }

  #contact .center{ width:100%; height:200px;}
  #contact .center .l{width:100%; float:none;}
  #contact .center .r{display:none;}

  #contact .right{ float:left; width:100%; }
}




#climb{width:56px; height:227px; position:fixed; z-index:9; right:-56px; top:50%; margin-top:-120px; transition:right .3s ease;}
#climb>a{display:block; width:100%; height:56px; line-height:56px; background:rgba(0,0,0,.46); margin-bottom:1px; color:#fff; text-align:center; transition:all .2s;}
#climb>a>i{font-size:2.5rem;}
#climb>a:hover{background:rgba(15,44,120,.8);}
#climb.active{right:1px;}
#climb .tel{position:relative; transform:translateX(0); transition:all .4s ease;}
#climb .tel>p{position:absolute; width:150px; height:56px; background:#018635; color:#fff; left:57px; top:0; font-size:1.4rem;}
#climb .tel:hover{transform:translateX(-150px);}
#climb .qr{position:relative;}
#climb .qr>p{position:absolute; width:0; height:0; position:absolute; left:-1px; top:0; background:#fff; padding:0px; box-sizing:border-box; transition:all .3s;}
#climb .qr:hover>p{width:170px; height:170px; padding:20px; left:-171px; top:-56px;}

@media (max-width:1080px){
  #climb{display:none;}
}


#foot{height:260px; background:#222; position:relative; z-index:3; letter-spacing:.03rem; overflow:hidden;}
#foot .wrap{padding:68px 155px; position:relative;}
#foot .row1{color:rgba(255,255,255,.4); font-size:1.4rem;}
#foot .row1 .l{width:60%; float:left;}
#foot .row1 .r{width:40%; float:right; text-align:right;}
#foot .row1 .r a{color:#f55e00;}
#foot .row1 .r a i{display:inline-block; font-size:3rem; vertical-align:middle; margin-right:-15px;}
#foot .line{background:rgba(255,255,255,.1); width:100%; height:1px; font-size:0; margin-top:36px;}
#foot .row2{margin-top:45px; color:rgba(255,255,255,.4); font-size:1.3rem; font-weight:300;}
#foot .row2 .l{width:80%; float:left;}
#foot .row2 .l span{display:inline-block;}
#foot .row2 .l a{display:inline-block;}
#foot .row2 .r{width:20%; float:right; text-align:right;}
#foot .row2 .r a{display:inline-block; color:rgba(255,255,255,.4);}

@media (max-width:1680px){
  #foot .wrap{padding:68px 125px;}
}
@media (max-width:1440px){
  #foot{height:250px;}
  #foot .wrap{padding:60px 100px;}
  #foot .line{margin-top:30px;}
}
@media (max-width:1366px){
  #foot{height:240px;}
  #foot .wrap{padding:55px 80px;}
  #foot .line{margin-top:25px;}
  #foot .row2{margin-top:40px;}
}
@media (max-width:1080px){
  #foot{height:auto;}
  #foot .wrap{padding:38px 20px;}
  #foot .row1 .l{width:100%; float:none;}
  #foot .row1 .r{width:100%; float:none; text-align:left; margin-top:5px;}
  #foot .row1 .r a i{font-size:3.2rem; margin-left:-28px;}

  #foot .line{margin-top:30px;}

  #foot .row2{margin-top:40px;}
  #foot .row2 .l{width:100%; float:none; font-size:1.1rem;}
  #foot .row2 .l>span{display:none;}
  #foot .row2 .l a{display:block; padding-left:1.1rem; margin-top:5px; font-size:1.1rem;}
  #foot .row2 .l a.beian{display:inline-block; font-size:1.1rem;}
  #foot .row2 .r{width:100%; float:none; text-align:left; font-size:1rem; margin-top:5px; padding-left:1.1rem; box-sizing:border-box;}
}



#getmore{height:47px; margin-top:50px; margin-bottom:20px; text-align:center;}

#getmore .loading-box {margin:0px 0 100px 0; height:47px; text-align:center; line-height:47px; display:none;}
#getmore .loading-box>div{width:12px; height:12px; background-color:#018635; border-radius:100%; display:inline-block; animation:bouncedelay 1.4s infinite ease-in-out; animation-fill-mode:both; margin:0 3px;}
#getmore .loading-box .bounce1{animation-delay:-0.32s;}
#getmore .loading-box .bounce2{animation-delay:-0.16s;}
@keyframes bouncedelay{
  0%,80%,100% {transform: scale(0.0);}
  40%{transform: scale(1.0);}
}

#getmore .handle{padding:0 40px 0 50px; font-size:1.6rem; color:#fff; background:#464646; height:47px; line-height:45px; display:inline-block; transition:all .2s; display:none;}
#getmore .handle>span{font-size:1rem; transform:scale(.7); display:inline-block; vertical-align:top; margin-left:.6rem;}
#getmore .handle:hover{background:#d8ae5d;}


#search-box{width:600px; height:60px; background:#fff; position:fixed; left:0; right:0; top:0; bottom:0; margin:auto; z-index:99; display:none;}
#search-box input{width:480px; height:60px; background:#fff; line-height:60px; padding:15px; box-sizing:border-box; font-size:1.6rem; float:left;}
#search-box input::placeholder{color:#999; font-weight:300;}
#search-box a{display:block; width:60px; height:60px; float:left; text-align:center; color:#fff; line-height:60px; transition:all .2s;}
#search-box a.search>i{font-size:1.8rem;}
#search-box a.close>i{font-size:1.6rem;}
#search-box a.search{background:#018635;}
#search-box a.search:hover{background:#2c91f8;}
#search-box a.close{background:#0f2c79;}
#search-box a.close:hover{background:#183789;}

@media (max-width:1080px){
  #search-box{width:90%; height:50px;}
  #search-box input{width:100%; height:50px; line-height:50px; padding:10px;}
  #search-box a{width:50px; height:50px; line-height:50px; position:absolute;}
  #search-box a.search{right:50px; top:0;}
  #search-box a.close{right:0; top:0;}
}





