html, body { box-sizing:content-box; background: #f8f8f8;}

body { font-size:14px; font-family:'microsoft yahei',Tahoma,Arial,Roboto,'Droid Sans','Helvetica Neue','Droid Sans Fallback','Heiti SC','Hiragino Sans GB',Simsun,sans-self; -webkit-tap-highlight-color:rgba(0,0,0,0);}

body, select, input, textarea,h2 { color:#333; margin: 0px; font-weight: normal;}

img { vertical-align:bottom;}

:focus { outline:none;}
a { color:#333; text-decoration:none;}
a:hover { color:#cc0000;}
a:visited,a:active { color:#333;}

::-moz-selection{ background:#fcd700; color:#fff; text-shadow:none;}
::selection { background:#fcd700; color:#fff; text-shadow:none;} 

ins { background-color:#fcd700; color:#000; text-decoration:none;}
mark { background-color:#fcd700; color:#000; font-style:italic; font-weight:bold;}

input { /*-webkit-appearance:none;*/ border-radius:0px;}
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

img,video { vertical-align: middle;}

.min-width { min-width: 1200px;}
.row { width: 1200px; margin: auto; position: relative;}
.col-l { float: left;}
.col-r { float: right;}
.text-center { text-align: center;}
.text-right { text-align: right;}

.flex { display: flex;}


.head { position: relative;}
.head.index { height: 1000px;}
.head .video { min-width: 100%; min-height: 100%; background: #000; position: relative; display: flex;}
.head .video video { min-width: 100%; min-height: 100%; object-fit: cover;}
.head .video .mask { width: 100%; height: 100%; background: url(skin/banner-mask.png); position: absolute; left: 0; top: 0; text-align:center;}
.head .video .mask img { position:absolute; top:50%; left:50%; width:1000px; height: 500px; margin-left:-500px; margin-top:-250px;
}
.head .name { text-align: center; width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.head .name strong { font-size: 48px; color: #FFF; padding-top: 53px;}
.head .name span { font-size: 24px; color: #FFF;}
.head .show { width: 100%;}
.head .show img { width: 100%; max-width: none;}

.head .secti { position: absolute; top: 40px; right: 40px; left: 40px; z-index: 1000; align-items: center; justify-content: space-between;}
.head .secti .list li { display: inline; margin: 15px;}
.head .secti .list li a { padding: 10px 0; color: #FFF; border: rgba(255, 255, 255, 0) solid 1px; border-left: 0; border-right: 0;}
.head .secti .list li a:hover { border: rgba(255, 255, 255, 1) solid 1px; border-left: 0; border-right: 0;}

.head .language { border: #FFF solid 2px;}
.head .language a { padding: 5px 20px; color: #FFF; display: inline-block;}
.head .language a.on { color: #424343; background: #FFF;}

.tool { background: #FFF; padding: 23px; width: 1154px; margin: auto; margin-top: -70px; position: relative; z-index: 1000; display: flex; box-shadow: rgba(0,0,0,.1) 0 0 10px;}
.tool .item { flex: 1;}
.tool .item a { background: #000; position: relative; display: block;}
.tool .item a strong { color: #FFF; position: absolute; left: 20px; right: 20px; top: 20px; font-size: 24px;}
.tool .item a span { color: #FFF; position: absolute; left: 20px; right: 20px; top: 55px; font-size: 12px;}
.tool .item a:hover img { opacity: .5;}
.tool .item a:hover strong,.tool .item a:hover span { text-align: center;}

.goods { padding: 100px 0;}
.goods .name { align-items: center;}
.goods .name .info { padding-right: 16px; margin-right: 14px; position: relative;}
.goods .name .info::after { content: ''; position: absolute; right: 0; top: 0; height: 100%; width: 3px; background: #cc0000;}
.goods .name .info strong { display: block; font-size: 30px;}
.goods .name .info span { display: block; color: #666;}
.goods .name .text { line-height: 24px; color: #666; flex: 1;}
.goods .name .more a { padding: 10px 40px; background: #cc0000; color: #FFF;}
.goods .name .more a:hover { background: #454545;}

.list-pro { margin-left: -14px; padding-top: 50px;}
.list-pro li { float: left; width: 390px; padding-left: 14px; padding-top: 14px;}
.list-pro li img { border: #f1f1f1 solid 1px; border-bottom: 0; display: block;}
.list-pro li span { display: block; text-align: center; line-height: 60px; background: #FFF; padding-left: 20px; border: #f1f1f1 solid 1px; border-top: 0;}
.list-pro li:hover span { background: #cc0000 url(skin/list-pro-li.png) right 20px center no-repeat; border: #cc0000 solid 1px; border-top: 0; color: #FFF;}

.about { height: 364px; background:#FFF url('skin/about-bg.png') top no-repeat; padding-top: 200px;}
.about .row { height: 364px; background: #FFF; box-shadow: rgba(0,0,0,.1) 0 0 10px;}
.about .info { flex: 1; padding: 56px;}
.about .info .name { padding-bottom: 20px;}
.about .info .name strong { font-size: 30px; color: #cc0000; display: block;}
.about .info .name span { display: block; color: #666;}
.about .info .text { line-height: 24px; text-align: justify; color: #666; padding-bottom: 40px;}
.about .info .more a { border: #ddd solid 1px; color: #333; padding: 10px 30px;}
.about .info .more a:hover { background: #cc0000; border: #cc0000 solid 1px; color: #FFF;}
.about .show { width: 464px; background: url(skin/about-show.png);}
.about .show .name strong { font-size: 30px; color: #cc0000; display: block; text-align: center; padding-top: 40px;}
.about .show .name span { display: block; color: #666; text-align: center;}
.about .show .list { display: flex; align-items: center; padding: 25px 40px;}
.about .show .list .slide { flex: 1;}
.about .show .list .slide li { text-align: center;}
.about .show .prev,.about .show .next { cursor: pointer;}

.power { padding: 100px 0; background: #FFF;}
.power .name { align-items: center;}
.power .name .info { padding-right: 16px; margin-right: 14px; position: relative;}
.power .name .info::after { content: ''; position: absolute; right: 0; top: 0; height: 100%; width: 3px; background: #cc0000;}
.power .name .info strong { display: block; font-size: 30px;}
.power .name .info span { display: block; color: #666;}
.power .name .text { line-height: 24px; color: #666; flex: 1;}
.power .name .more a { padding: 10px 40px; background: #cc0000; color: #FFF;}
.power .name .more a:hover { background: #454545;}

.numb { padding: 80px 0;}
.numb .item:first-child { border-left: #e5e5e5 solid 1px;}
.numb .item { text-align: center; flex: 1; border-right: #e5e5e5 solid 1px;}
.numb .item span { font-size: 48px; font-weight: bold;}
.numb .item sup {vertical-align: baseline; top: -20px; font-size: 30px; font-weight: bold;}
.numb .item sub { font-size: 18px;}
.numb .item .name { font-size: 16px; padding-top: 10px;}

.power .list { display: flex; align-items: center; justify-content: center;}
.power .list .slide { flex: 1;}
.power .list .slide li { float: left; margin: 5px; cursor: pointer;}
.power .list .slide li img { width: 389px; height: 260px; display: block;}
.power .list .slide li span { display: block; line-height: 60px; text-align: center; border-bottom: #e5e5e5 solid 1px;}
.power .list .slide li:hover span { border-bottom: #cc0000 solid 1px;}
.power .prev,.power .next { cursor: pointer; width: 50px; height: 50px; background-position: bottom; margin-top: -60px;}
.power .prev{ cursor: pointer; margin-right: 20px; background-image: url(skin/power-l.png);}
.power .next{ cursor: pointer; margin-left: 20px; background-image: url(skin/power-r.png);}
.power .prev:hover,.power .next:hover { background-position: top;}

.news { background: #f8f8f8; padding: 100px 0;}
.news .name { align-items: center;}
.news .name .info { padding-right: 16px; margin-right: 14px; position: relative;}
.news .name .info::after { content: ''; position: absolute; right: 0; top: 0; height: 100%; width: 3px; background: #cc0000;}
.news .name .info strong { display: block; font-size: 30px;}
.news .name .info span { display: block; color: #666;}
.news .name .text { line-height: 24px; color: #666; flex: 1;}
.news .name .more a { padding: 10px 40px; background: #cc0000; color: #FFF;}
.news .name .more a:hover { background: #454545;}

.news .cont { padding-top: 50px; justify-content: space-between;}
.news .show { width: 480px;}
.news .show .text { padding: 20px; background: #cc0000; color: #FFF;}
.news .show .text .date { width: 50px; text-align: center; line-height: 30px;}
.news .show .text .date strong { display: block; font-size: 36px;}
.news .show .text .date span { font-size: 12px;}
.news .show .text .name { white-space:normal; flex: 1; padding-left: 10px;}
.news .show .text .name strong { display: block; font-size: 18px; font-weight: normal; padding-bottom: 10px; margin-bottom: 10px; border-bottom: #FFF solid 1px;}
.news .show .text .name span { display: block;}

.news .list { width: 633px; border-top: #dddddd solid 1px;}
.news .list li { padding: 30px 0; border-bottom: #dddddd solid 1px;}
.news .list li a { padding-left: 20px; display: block; position: relative;}
.news .list li a::before { content:''; width: 10px; height: 10px; background: #666666; border-radius: 100px; display: block; position: absolute; left: 0; top: 6px;}
.news .list li strong { display: block; font-size: 16px; font-weight: normal; padding-bottom: 20px;}
.news .list li strong i { float: right; font-style: normal; color: #999;}
.news .list li span { color: #666; line-height: 24px; padding-right: 100px; position: relative; display: block;}
.news .list li span::after { content: ''; width: 53px; height: 35px; background-image: url(skin/news-li.png); background-position: top; position: absolute; right: 0; top: 0;}
.news .list li a:hover strong { color: #cc0000;}
.news .list li a:hover span::after { background-position: bottom;}

.link { background: #FFF; padding: 80px 0;}

.link .list { display: flex; align-items: center; justify-content: center;}
.link .list .slide { max-width: 1000px; overflow: hidden;}
.link .list .slide li { margin:0 25px; cursor: pointer; white-space:nowrap}
.link .list .slide li img { height: 50px; width: auto; max-width: none; display: block;}
.link .list .slide li:hover span { border-bottom: #cc0000 solid 1px;}
.link .prev,.link .next { cursor: pointer; width: 50px; height: 50px; background-position: bottom;}
.link .prev{ cursor: pointer; margin-right: 50px; background-image: url(skin/power-l.png);}
.link .next{ cursor: pointer; margin-left: 50px; background-image: url(skin/power-r.png);}
.link .prev:hover,.link .next:hover { background-position: top;}

.foot { padding: 80px 0; background: #fff;}
.foot .row { justify-content: space-between;}
.foot .form { width: 572px;}
.foot .form .name strong { display: block; font-size: 24px;}
.foot .form .name span { font-size: 12px; color: #666666; display: block;}
.foot .form .name i { font-style: normal; color: #666; display: block; padding: 8px 0 20px 0;}
.foot .form .item { padding-bottom: 10px;}
.foot .form .item input { width: 100%; padding: 10px 20px; box-sizing: border-box; border: #e5e5e5 solid 1px;}
.foot .form .item textarea { width: 100%; padding: 10px 20px; box-sizing: border-box; border: #e5e5e5 solid 1px; height: 108px; resize: none;}
.foot .form .submit { cursor: pointer; line-height: 50px; background: #cc0000; color: #FFF; text-align: center;}

.foot .info { padding-top: 100px;}
.foot .info .logo { padding-bottom: 20px;}
.foot .info .phone { padding: 20px 0; border: #e5e5e5 solid 1px; border-left: 0; border-right: 0; font-size: 35px; color: #00a1fe; font-weight: bold;}
.foot .info .other { padding-top: 43px; line-height: 30px; justify-content: space-between;}
.foot .info .other .code { width: 101px;}
.foot .info .other .code img { display: block; width: 101px;}
.foot .info .other .code span { text-align: center; font-size: 12px; color: #666666; display: block;}

.copyright { line-height: 70px; background: #454545; font-size: 12px; text-align: center; color: #FFF;}
.copyright a { color: #FFF;}

.fancy { cursor: pointer;}

.html { text-align: justify; line-height: 35px; padding-bottom: 80px;}

.navs { line-height: 60px; border-bottom: #e5e5e5 solid 1px; padding-left: 20px; background: url(skin/nav-img.png) left center no-repeat;}
.navs a:first-child { margin-left: 0;}
.navs a { margin: 0 20px;}

.list-pow { margin-left: -16px; padding-top: 40px;}
.list-pow li { float: left; padding-left: 16px; padding-top: 20px; cursor: pointer;}
.list-pow li img { width: 389px; height: 260px; display: block;}
.list-pow li span { display: block; line-height: 60px; text-align: center; border-bottom: #e5e5e5 solid 1px;}
.list-pow li:hover span { border-bottom: #cc0000 solid 1px;}

.new-fir { padding-top: 80px; padding-bottom: 60px; border-bottom: #e5e5e5 solid 1px;}
.new-fir a { justify-content: space-between;}
.new-fir .show { width: 350px; margin-left:50px;}
.new-fir .info { width: 750px;}
.new-fir .info .date { border: #e5e5e5 solid 1px; width: 68px; padding-top: 5px; margin: 20px 0;}
.new-fir .info .date strong { display: block; text-align: center; font-size: 36px;}
.new-fir .info .date span { display: block; text-align: center; line-height: 20px;}
.new-fir .info .cont { margin-right: 70px; border-right: #e5e5e5 solid 1px; position: relative; padding-right: 20px;}
.new-fir .info .cont::after { content:''; position: absolute; width: 41px; height: 41px; background-image: url(skin/news-list-li.png); background-position: top; top: 50%; margin-top: -20px; right: -70px; }
.new-fir .info .cont .name { font-size: 24px; font-weight: bold;}
.new-fir .info .cont .text { line-height: 24px; padding-top: 15px; color: #666666;}
.new-fir a:hover .info .cont::after { background-position: bottom;}
.new-fir a:hover .info .name { color: #cc0000;}

.list-new .item { border-bottom: #e5e5e5 solid 1px; padding: 40px 0;}
.list-new a { justify-content: space-between;}
.list-new .item .date { border: #e5e5e5 solid 1px; width: 68px; padding-top: 5px; height: 62px; margin-left: 50px;}
.list-new .item .date strong { display: block; color: #333; text-align: center; font-size: 36px;}
.list-new .item .date span { display: block; color: #333; text-align: center; line-height: 20px;}
.list-new .item .cont { width: 900px; margin-right: 70px; border-right: #e5e5e5 solid 1px; position: relative; padding-right: 20px;}
.list-new .item .cont::after { content:''; position: absolute; width: 41px; height: 41px; background-image: url(skin/news-list-li.png); background-position: top; top: 50%; margin-top: -20px; right: -70px; }
.list-new .item .cont .name { font-size: 20px; font-weight: bold;}
.list-new .item .cont .text { line-height: 24px; padding-top: 15px; color: #666666;}
.list-new a:hover .cont::after { background-position: bottom;}
.list-new a:hover .name { color: #cc0000;}

.html .new-name { padding-top: 80px; text-align: center; font-size: 24px; font-weight: bold;}
.html .new-date { text-align: center; padding-bottom: 80px;}

.contact { padding-top: 80px; justify-content: space-between;}
.contact .info { width: 600px;}
.contact .info .name strong { display: block; font-size: 36px; padding-bottom: 10px;}
.contact .info .name span { color: #999;}
.contact .info .item { line-height: 24px; margin-top: 30px; padding-left: 80px; background-position: 5px center; background-repeat: no-repeat;}
.contact .info .item span { display: block; color: #999;}
.contact .info .item strong { font-weight: normal;}
.contact .info .item.phone { background-image: url(skin/con-tel.png); background-position: left center;}
.contact .info .item.phone strong { font-size: 36px; font-weight: bold; line-height: 40px;}
.contact .info .item.add { background-image: url(skin/con-add.png);}
.contact .info .item.fax { background-image: url(skin/con-fax.png);}
.contact .info .item.mail { background-image: url(skin/con-mail.png);}
.contact .info .item.web { background-image: url(skin/con-web.png);}

.contact .form { width: 500px;}
.contact .form .name strong { display: block; font-size: 24px;}
.contact .form .name span { font-size: 12px; color: #666666; display: block;}
.contact .form .name i { font-style: normal; color: #666; display: block; padding: 0px 0 20px 0;}
.contact .form .item { padding-bottom: 10px;}
.contact .form .item input { width: 400px; padding: 10px 20px; box-sizing: border-box; border: #e5e5e5 solid 1px;}
.contact .form .item textarea { width: 100%; padding: 10px 20px; box-sizing: border-box; border: #e5e5e5 solid 1px; height: 108px; resize: none;}
.contact .form .submit { cursor: pointer; width: 200px; line-height: 50px; background: #cc0000; color: #FFF; text-align: center;}

.map { width: 100%; max-width: none;}

.pages { padding-top: 40px; text-align: center;}
.pages a { display: inline-block; width: 40px; height: 40px; line-height: 40px; border:#e5e5e5 solid 1px; background: #FFF; margin:0 5px;} 
.pages a.selected { background: #cc0000; border: #cc0000 solid 1px; color: #FFF;}

.prev_down { padding-top: 40px; display: flex;}
.prev_down a { flex: 1; background: #e4e4e4; padding:5px 20px; color: #333;}
.prev_down a:hover { background: #cc0000; color: #FFF;}
.prev_down a.disabled:hover { background: #e4e4e4; color: #333;}