@charset "utf-8";

@import url('font/webFont.css');

body,td,th,input,textarea,select{font-family:Arial, 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;}
div:after, ul:after, dl:after{content:''; display:block; height:0; clear:both;}


.wrap{max-width:1200px; margin:auto;}

#banner{width:100%; height:720px; position:relative; z-index:1; left:0; top:0;}
#banner .swiper-container{height:100%;}
#banner .swiper-wrapper{height:100%;}
#banner .swiper-slide{width:100%; height:100%;}
#banner .swiper-slide>div.img{width:100%; height:100%; position:absolute; z-index:2; left:0; top:0; background-size:cover; background-position:center; background-repeat:no-repeat; transition:transform 15s;}

#banner .swiper-pagination{bottom:30px;}
#banner .swiper-pagination-bullet{width:10px; height:10px; margin:0 7px; opacity:1; background:rgba(0,0,0,.4); transition:all .25s;}
#banner .swiper-pagination-bullet-active{width:25px; opacity:1; border-radius:100px; background:#d70c19;}

#top{height:33px; background:rgba(218,1,22,.8); position:fixed; width:100%; left:0; top:0; z-index:99; transition:all .3s;}
#top .l{width:50%; float:left;}
#top .l a{color:#fff; font-family:Montserrat; font-size:1.3rem; font-weight:300; letter-spacing:.05rem; line-height:30px;}
#top .l i{font-size:1.5rem; vertical-align:middle; margin-top:-.2rem;}
#top .r{width:50%; float:right;}
#top .r a{float:right; height:33px; line-height:31px; color:#fff; width:40px; text-align:center; background:rgba(0,0,0,.3); font-size:1.2rem; font-weight:bold; transition:all .2s;}
#top .r a.active{background:rgba(0,0,0,.5); color:#ddd;}
#top .r a:hover{background:rgba(0,0,0,.15);}

#top.hide{opacity:0; filter:alpha(opacity=0); top:-33px;}

#head{background:#fff; height:86px; position:fixed; left:0; top:33px; width:100%; z-index:99; box-shadow:0 5px 15px rgba(0,0,0,.12); transition:all .3s;}
#head .logo{width:200px; float:left;}
#head .logo a{display:block; height:40px; margin-top:21px; transition:all .25s;}
#head .logo a>img{height:100%;}

#head.sm{height:72px; top:0;}
#head.sm .logo a{height:35px; margin-top:18px;}

#nav{display:none;}

#menu{width:920px; height:100%; float:right; margin-right:-3%; transition:width .3s;}
#menu>li{float:left; height:100%;}
#menu>li>a{display:block; padding:0 32px; height:100%; line-height:86px; font-size:1.7rem; font-family:Montserrat; color:#464646; font-weight:500; position:relative; transition:all .25s;}
#menu>li>a:after{content:''; display:block; width:0; height:3px; background:#d70c19; position:absolute; left:50%; bottom:0; margin-left:0; transition:all .3s; opacity:0;}
#menu>li>a:hover{color:#d70c19;}
#menu>li>a:hover:after{width:60%; margin-left:-30%; opacity:1;}
#menu>li>a.active:after{width:60%; margin-left:-30%; opacity:1;}

#head.sm #menu{width:886px;}
#head.sm #menu>li>a{line-height:72px; font-size:1.6rem;}

@media (max-width:1280px){
  #banner{height:660px;}

  .wrap{max-width:1160px;}

  #menu{width:885px;}
  #menu>li>a{font-size:1.6rem;}
}
@media (max-width:1080px){
  #banner{height:240px; margin-top:70px;}
  #banner .swiper-pagination{bottom:13px;}
  #banner .swiper-pagination-bullet{width:6px; height:6px; margin:0 4px;}
  #banner .swiper-pagination-bullet-active{width:12px;}

  #top{height:30px; background:#d70000;}
  #top .l a{font-size:1.2rem; line-height:28px; padding-left:8px;}
  #top .l i{font-size:1.5rem; vertical-align:middle; margin-top:-.2rem;}
  #top .r a{height:30px; line-height:30px;}

  #top.hide{top:-30px;}

  #head{height:60px; top:30px;}
  #head .logo{width:100%; float:none;}
  #head .logo a{height:28px; margin-top:15px; margin-left:12px;}

  #head.sm{height:60px; top:0;}
  #head.sm .logo a{height:28px; margin-top:15px;}

  #nav{display:block; position:absolute; right:0; top:0; width:60px; height:60px; text-align:center; line-height:58px;}
  #nav>i{font-size:2rem; color:#464646;}

  #menu{display:none; transition:top .3s;}
  #menu{width:100%; height:auto; float:none; margin-right:0; position:fixed; left:0; top:90px; background:#d70000;}
  #menu>li{float:none; height:auto;}
  #menu>li>a{display:block; padding:0; height:60px; line-height:60px; font-size:1.5rem; color:#fff; border-bottom:1px solid rgba(255,255,255,.2); text-align:center;}
  #menu>li>a:after{display:none;}
  #menu>li>a:hover{color:#fff;}
  #menu>li>a:active{background:#cc0000;}

  #head.sm #menu{width:100%; top:60px;}
  #head.sm #menu>li>a{line-height:60px; font-size:1.5rem;}
}

#m1{height:460px; margin-top:36px;}
#m1 .tit{font-family:Montserrat; font-size:2.6rem; color:#464646; text-transform:uppercase;}

#m1 .swiper-container{height:360px; margin-top:30px;}
#m1 .swiper-container .swiper-slide{height:320px;}
#m1 .swiper-container .swiper-slide a{display:block; border:1px solid #e6e6e6; text-align:center; padding:18px; transition:all .25s;}
#m1 .swiper-container .swiper-slide a .img{position:relative; width:100%; padding-top:100%;}
#m1 .swiper-container .swiper-slide a .img>img{position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; max-width:100%; max-height:100%;}
#m1 .swiper-container .swiper-slide a .title{margin-top:15px; font-size:1.35rem; color:#464646; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; transition:all .25s;}
#m1 .swiper-container .swiper-slide a:hover{border:1px solid #d70000; box-shadow:0 0 0 5px #d70000 inset;}
#m1 .swiper-container .swiper-slide a:hover .title{color:#d70000;}

@media (max-width:1080px){
  #m1{height:auto; margin-top:20px; padding:0 12px;}
  #m1 .tit{font-size:1.6rem; font-weight:700;}

  #m1 .swiper-container{height:300px; margin-top:0;}
  #m1 .swiper-container .swiper-slide{height:260px;}
  #m1 .swiper-container .swiper-slide a{border:0px none; height:100%;}
  #m1 .swiper-container .swiper-slide a .img{position:relative; width:100%; padding-top:0; height:200px;}
  #m1 .swiper-container .swiper-slide a .img>img{position:relative; z-index:1;}
  #m1 .swiper-container .swiper-slide a .title{font-size:1.5rem;}
  #m1 .swiper-container .swiper-slide a:hover{border:0px none; box-shadow:unset;}
}

#m2{height:420px;}
#m2 .wrap{height:100%;}
#m2 .l{width:50%; height:100%; background:#eee url('img/left.jpg') no-repeat center/cover; float:left;}
#m2 .l a{display:block; height:100%; position:relative; z-index:1;}
#m2 .l a .bg{position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.55); z-index:1; transition:all .3s;}
#m2 .l a i{position:absolute; left:30px; bottom:30px; color:#fff; z-index:2; font-size:6rem; transition:all .5s;}
#m2 .l a .cn{color:#fff; position:absolute; left:100px; z-index:2; bottom:67px; font-size:1.7rem; font-weight:300; transition:all .3s;}
#m2 .l a .en{color:#fff; position:absolute; left:100px; z-index:2; bottom:36px; font-size:2.4rem; font-weight:300; font-family:Montserrat; transition:all .4s;}
#m2 .l a:hover .bg{background:rgba(0,0,0,.35);}
#m2 .l a:hover i{left:280px;}
#m2 .l a:hover .cn{left:195px;}
#m2 .l a:hover .en{left:30px;}

#m2 .r{width:50%; height:100%; border-left:1px solid #fff; box-sizing:border-box; float:right;}
#m2 .r .t{height:209px; background:#eee url('img/right.jpg') no-repeat center/cover;}
#m2 .r .t a{display:block; height:100%; position:relative;}
#m2 .r .t a .bg{position:absolute; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:1; transition:all .3s;}
#m2 .r .t a i{position:absolute; left:30px; bottom:30px; color:#fff; z-index:2; font-size:6rem; transition:all .45s;}
#m2 .r .t a .cn{color:#fff; position:absolute; left:100px; z-index:2; bottom:67px; font-size:1.7rem; font-weight:300; transition:all .3s;}
#m2 .r .t a .en{color:#fff; position:absolute; left:100px; z-index:2; bottom:36px; font-size:2.4rem; font-weight:300; font-family:Montserrat; transition:all .4s;}
#m2 .r .t a:hover .bg{background:rgba(0,0,0,.3);}
#m2 .r .t a:hover i{left:210px;}
#m2 .r .t a:hover .cn{left:130px;}
#m2 .r .t a:hover .en{left:30px;}

#m2 .r .f{height:210px; margin-top:1px;}
#m2 .r .left{width:50%; height:100%; background:#777; float:left;}
#m2 .r .left a{color:#fff; display:block; height:100%; position:relative; text-align:center; transition:all .25s;}
#m2 .r .left a i{padding-top:42px; font-size:8rem; display:block;}
#m2 .r .left a p{font-family:Montserrat; font-size:1.7rem; font-weight:300; margin-top:12px;}
#m2 .r .left a:hover{background:#888;}

#m2 .r .right{width:50%; height:100%; background:#d70000; border-left:1px solid #fff; box-sizing:border-box; float:right;}
#m2 .r .right a{color:#fff; display:block; height:100%; position:relative; text-align:center; transition:all .25s;}
#m2 .r .right a i{padding-top:42px; font-size:8rem; display:block;}
#m2 .r .right a p{font-family:Montserrat; font-size:1.7rem; font-weight:300; margin-top:12px;}
#m2 .r .right a:hover{background:#f30000;}

@media (max-width:1080px){
  #m2{height:auto; margin-top:25px;}

  #m2 .l{width:100%; height:230px; float:none;}
  #m2 .l a{display:block; height:100%; position:relative; z-index:1;}
  #m2 .l a:hover .bg{background:rgba(0,0,0,.35);}
  #m2 .l a:hover i{left:30px;}
  #m2 .l a:hover .cn{left:100px;}
  #m2 .l a:hover .en{left:100px;}

  #m2 .r{width:100%; height:230px; border-left:0px none; float:none; margin-top:1px;}
  #m2 .r .t a:hover .bg{background:rgba(0,0,0,.3);}
  #m2 .r .t a:hover i{left:30px;}
  #m2 .r .t a:hover .cn{left:100px;}
  #m2 .r .t a:hover .en{left:100px;}
}

#foot{background:#333; margin-top:100px; margin-bottom:-20px;}
#foot .l{width:460px; float:left; margin-top:50px;}
#foot .tit{position:relative; font-size:2rem; font-weight:500; color:#fff; font-family:Montserrat;}
#foot .tit:before{content:''; display:block; position:absolute; left:-15px; top:3px; width:3px; height:20px; background:#ec0000;}
#foot .l .logo{height:40px; opacity:.16; filter:alpha(opacity=16); margin-top:1.2rem;}
#foot .l .logo>img{height:100%;}
#foot .l .txt{font-size:1.3rem; margin-top:20px; line-height:1.6; color:#888;}
#foot .l a{display:inline-block; padding:12px 26px; background:#222; color:#ddd; font-size:1.3rem; margin-top:1.2rem; transition:all .2s;}
#foot .l a:hover{background:#111; color:#fff;}

#foot .r{width:400px; float:right; margin-top:50px;}
#foot .r .contact{font-size:1.5rem; color:#888; margin-top:1.2rem; font-weight:300;}
#foot .r .contact>p{margin-bottom:.6rem;}
#foot .r .contact>p>a{text-decoration:underline; color:#999;}
#foot .r .contact>p>a:hover{color:#ccc;}

#btm{border-top:1px solid #444; margin-top:40px; height:50px;}
#btm .wrap{position:relative; z-index:1;}
#btm .totop{display:block; width:36px; height:36px; position:absolute; right:0; top:-36px; line-height:1;}
#btm .totop i{font-size:3.6rem; transition:all .2s;}
#btm .totop:hover{color:#ec0000;}
#btm .l{width:50%; float:left; margin-top:0; line-height:50px; font-size:1.4rem; color:#999;}
#btm .r{width:50%; float:right; text-align:right; line-height:50px; font-size:1.4rem; color:#999; margin-top:0;}

@media (max-width:1280px){
  #btm .l{font-size:1.3rem;}
  #btm .r{font-size:1.3rem;}
}
@media (max-width:1080px){
  #foot{margin-top:0px; padding:0 12px; border-top:1px solid #fff;}
  #foot .l{width:100%; float:none; padding-top:35px; margin-top:0;}

  #foot .r{width:100%; float:none; margin-top:35px; border-top:1px solid rgba(255,255,255,.08); padding-top:30px;}

  #btm{border-top:1px solid rgba(255,255,255,.08); margin-top:35px; height:auto;}
  #btm .totop{position:relative; z-index:1; top:0; margin:30px auto;}
  #btm .totop>i{color:#666;}
  #btm .totop>i:active{color:#d70000;}
  #btm .l{width:100%; float:none; text-align:center; line-height:1.3; padding-top:0;}
  #btm .r{width:100%; float:none; text-align:center; line-height:1.3; border-top:0px none; padding-top:0; margin-top:10px; padding-bottom:30px;}
}

#space{height:230px;}

#main{background:#fff; min-height:600px; padding:30px 35px; box-sizing:border-box; box-shadow:10px 10px 20px rgba(0,0,0,.11); position:relative; z-index:1;}

#place{font-size:1.3rem; color:#999; border-bottom:1px solid #eee; padding-bottom:30px;}
#place a>i{font-size:1.3rem; margin-right:.3rem;}
#place a:last-child{color:#d70000; text-decoration:underline; font-size:1.6rem; font-weight:300;}
#place a:hover{color:#d70000;}

.content{font-size:1.5rem; line-height:1.8; padding:30px;}
.content p, .content div{margin-bottom:1.6rem;}
.content p>img{padding:10px 0;}

@media (max-width:1080px){
  #space{height:90px;}
  #main{min-height:350px; padding:20px 12px;}
  #place{font-size:1.2rem; padding-bottom:20px;}
  #place a:last-child{font-size:1.2rem;}

  .content{font-size:1.5rem; padding:15px 3px;}
  .content p, .content div{margin-bottom:1.6rem;}
  .content p>img{padding:10px 0;}
}


.list{margin-top:25px;}
.list>a{display:block; width:23%; float:left; border:1px solid #e6e6e6; box-sizing:border-box; margin:1%; padding-top:35%; position:relative;}
.list>a .img{position:absolute; width:100%; height:100%; left:0; top:0; padding:15px; box-sizing:border-box;}
.list>a .img>img{width:100%; height:100%;}
.list>a .tit{position:absolute; width:100%; height:45px; background:rgba(0,0,0,.5); left:0; bottom:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff; text-align:center; line-height:45px; font-size:1.5rem; transition:all .3s;}
.list>a:hover .tit{background:#d70000; bottom:15px;}

@media (max-width:1080px){
  .list{padding-bottom:30px;}
  .list>a{width:48%; padding-top:66%;}
}


.contact_bg{position:absolute; width:500px; height:400px; background:url('img/contact.jpg') no-repeat center/100%; right:30px; top:80px;}
.contact_view{font-size:1.5rem; line-height:1.8; padding:30px;}
.contact_view p a{text-decoration:underline;}
.contact_view p a:hover{color:#d70000;}

@media (max-width:1080px){
  .contact_bg{position:relative; z-index:1; width:100%; height:250px; background:url('img/contact.jpg') no-repeat center/100%; right:0; top:0;}
  .contact_view{padding:0 3px; margin:30px 0;}
}


.support p{font-size:1.5rem; line-height:1.8;}
.support h1{display:block; margin-bottom:10px; font-size:4.6rem; color:#464646; font-family:Montserrat; text-transform:uppercase;}
.support p a:hover{color:#ff0000 !important;}
.support .hotline{color:#d70000; font-size:2.6rem; margin-top:25px; font-family:Montserrat; font-weight:300;}

@media (max-width:1080px){
  .support>img{width:100% !important; float:none !important; margin-left:0 !important;}
  .support h1{font-size:3rem; font-weight:600;}
  .support .hotline{font-size:1.8rem; font-weight:600; padding-bottom:30px;}
}


#prolist{margin-top:10px;}
#prolist>li{width:33.33333333%; float:left; padding:2%; box-sizing:border-box;}
#prolist>li>a{display:block; border:1px solid #e6e6e6; padding:25px; position:relative; overflow:hidden;}
#prolist>li>a .img{position:relative; z-index:1; width:100%; padding-top:100%; overflow:hidden;}
#prolist>li>a .img>img{position:absolute; max-width:100%; max-height:100%; left:0; top:0; left:0; bottom:0; margin:auto; transition:all .3s;}
#prolist>li>a .tit{text-align:center; margin-top:15px; color:#464646; font-size:1.5rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; position:relative; z-index:2;}
#prolist>li>a:after{background:#d70000; position:absolute; width:100%; height:50%; content:''; display:block; left:0; bottom:-50%; z-index:3; opacity:.16; transition:all .35s ease;}
#prolist>li>a>div{position:absolute; z-index:4; width:100%; height:50%; display:block; left:0; bottom:-50%; transition:all .5s ease;}
#prolist>li>a>div>p{display:-webkit-box; height:100%; color:#fff; font-size:1.7rem; padding:15px; box-sizing:border-box; -webkit-box-pack:center; -webkit-box-align:center; -webkit-box-orient:vertical; text-align:center;}
#prolist>li>a:hover .img>img{transform:scale(1.12);}
#prolist>li>a:hover:after{bottom:0; opacity:.9;}
#prolist>li>a:hover>div{bottom:0;}

@media (max-width:1080px){
  #prolist>li{width:50%; padding-bottom:30px;}
  #prolist>li>a{padding:10px;}
  #prolist>li>a:after{display:none;}
  #prolist>li>a>div{display:none;}
  #prolist>li>a .tit{height:35px; font-size:1.3rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow: ellipsis; white-space:unset;}
}


.proview h1{display:block; font-size:3.6rem; font-family:Montserrat; text-align:center; font-weight:500; color:#464646; margin-top:30px;}

#proconL{margin:50px auto; width:100%; height:500px; overflow:hidden;}
#proconL .swiper-container{width:100%; height:500px;}
#proconL .swiper-slide{text-align:center;}
#proconL .swiper-container img{width:auto; height:100%;}
#proconL .swiper-pagination{font-size:14px; padding-bottom:8px; color:#fff;}
#proconL .swiper-button-next, #proconL .swiper-button-prev{opacity:.3;}

@media (max-width:1080px){
  .proview h1{font-size:3.2rem; font-weight:600; line-height:1.16;}
  #proconL{margin:10px auto; height:auto;}
  #proconL .swiper-container{height:auto;}
  #proconL .swiper-container img{width:90%; height:auto;}
}


#pro_tags{margin-top:36px;}
#pro_tags .tags_title{border-bottom:0px none !important; border-top:2px solid #d70000; padding:20px 20px 0 20px !important; background:#fff; border-left:1px solid #e6e6e6; border-right:1px solid #e6e6e6; font-size:16px !important; font-weight:bold !important; color:#ec0000 !important;}
#pro_tags .tags_content{margin-top:0 !important; padding:20px 30px 25px 30px !important; background:#fff; border:1px solid #e6e6e6; border-top:0px none;}
#pro_tags table{border-left:1px solid #ccc; border-top:1px solid #ccc;}
#pro_tags table td,#pro_tags table th{border-right:1px solid #ccc; border-bottom:1px solid #ccc; padding:5px;}
#pro_tags table th{background:#E1F1F9;}
#pro_tags table{border:0px none; margin:auto; border-left:1px solid #ccc !important; border-top:1px solid #ccc !important;}
#pro_tags table td{border:0px none !important; border-right:1px solid #ccc !important; border-bottom:1px solid #ccc !important; padding:6px !important; font-family:'微软雅黑' !important; font-size:13px !important;}
#pro_tags table tr{transition:all 0.3s;}
#pro_tags table tr:hover{background:#eee;}

@media (max-width:1080px){
  #pro_tags .tags_content{padding:15px !important;}
}

#prevnext{margin:60px auto 50px auto; position:relative; font-size:13px; border-top:1px solid #ddd; padding-top:20px; z-index:1;}
#prevnext .prev{margin:7px 0;}
#prevnext .next{margin:7px 0;}
#prevnext .prev>a, #prevnext .next>a{color:#333; font-size:1.4rem;}
#prevnext .prev>a:hover, #prevnext .next>a:hover{color:#ec0000;}
#prevnext>a{display:block; width:88px; height:35px; background:#fff; line-height:35px; text-align:center; border:1px solid #e6e6e6; border-radius:3px; position:absolute; right:0; top:28px; font-size:1.4rem;}
#prevnext>a:hover{border:1px solid #ccc;}

@media (max-width:1080px){
  #prevnext{margin:50px auto 40px auto;}
  #prevnext .prev>a, #prevnext .next>a{font-size:1.3rem;}
  #prevnext>a{position:relative; z-index:1; top:0; margin:30px auto 0 auto;}
}