﻿@charset "utf-8";
* { margin: 0; padding: 0; }
body { font-family: 微软雅黑, Microsoft YaHei, \5FAE\8F6F\96C5\9ED1; font-size: 12px; _background-image: url(about:blank); _background-attachment: fixed; color: #333333 }
body { }
html { _overflow-x: hidden }
:focus { outline: 0; }
img { border: 0; }
ul, li { list-style: none; }
div, ul, li, dl, dt, dd, table, td, input { font-size: 12px; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 12px; }
i, em { font-style: normal; }
a { color: #333; text-decoration: none; -webkit-transition: .3s; transition: .3s; }
a:hover { color: #ff0000; }
::-webkit-input-placeholder, :-moz-placeholder, ::-moz-placeholder, :-ms-input-placeholder {
color:#333333;
font-family:微软雅黑, Microsoft YaHei, \5FAE\8F6F\96C5\9ED1;
}
select::-ms-expand {
display: none;
}
input, textarea { font-family: 微软雅黑, Microsoft YaHei, \5FAE\8F6F\96C5\9ED1; }
.clear { clear: both; zoom: 1; }
.clear:after, .clear:before { clear: both; display: block; content: ""; height: 0; width: 100%; font-size: 0; visibility: hidden; zoom: 1; }
.fl { display: inline; float: left }
.fr { display: inline; float: right }
.section .container { width: 1200px; margin: 0 auto; clear: both; position: relative; }
.banner { position: relative; width: 100%; height: 700px; overflow: hidden; perspective: 1200px; }
.banner .bg { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: url(../images/banner.jpg) no-repeat center top; height: 700px; z-index: 1; }
.banner .pattern { perspective: 800px; z-index: 2; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: url(../img/blank.gif); }
.banner .pattern span { position: absolute; left: 0; width: 100%; height: 99px; display: block; background: url(../images/pattern.png) repeat-x 0 0; }
.banner .container { position: absolute; z-index: 3; left: 50%; top: 115px; margin-left: -400px; text-align: center; }
.banner .container img { animation: zoomInDown 1s; -webkit-animation: zoomInDown 1s; }
.banner p { margin-top: 40px; animation: fadeInUp 1s; -webkit-animation: fadeInUp 1s; }
.banner p a { font-size: 18px; display: inline-block; margin-right: 20px; border: 1px solid #fff; border-radius: 20px; width: 160px; height: 40px; line-height: 40px; color: #FFFFFF; }
.banner p a.btn02 { background: #e30000; border: 1px solid #e30000; }
.banner p a:hover { background: #e30000; border: 1px solid #e30000; }
.banner p a.btn02:hover { border: 1px solid #fff; background: none; }
.section01 { background: url(../images/white_wall.png) repeat; padding: 70px 0; }
.section .title { text-align: center; margin-bottom: 20px; }
.section .title h3 { font-size: 36px; line-height: 36px; }
.section .title p { font-size: 22px; color: #808080; text-transform: uppercase; line-height: 22px; margin-top: 15px; }
.section01 .item { float: left; width: 390px; text-align: center; }
.section01 .item .t01 { position: relative; z-index: 10; }
.section01 .item .txt { margin-top: -130px; position: relative; z-index: 1; padding: 160px 60px 0; height: 301px; color: #FFFFFF; font-size: 14px; }
.section01 .item-1 .txt { background: url(../images/section01_01.png) center top no-repeat; }
.section01 .item-2 .txt { background: url(../images/section01_02.png) center top no-repeat; }
.section01 .item-3 .txt { background: url(../images/section01_03.png) center top no-repeat; }
.section01 .item .txt:after { content: ""; width: 390px; height: 461px; position: absolute; left: 0; top: 0; z-index: 2; transform: scale(0, 0); -webkit-transition: .3s; transition: .3s; z-index: 3; }
.section01 .item-1 .txt:after { background: url(../images/section01_01hover.png) left top no-repeat; }
.section01 .item-2 .txt:after { background: url(../images/section01_02hover.png) left top no-repeat; }
.section01 .item-3 .txt:after { background: url(../images/section01_03hover.png) left top no-repeat; }
.section01 .item:hover .txt:after { transform: scale(1, 1) }
.section01 .item .txt dl { z-index: 6; position: relative; }
.section01 .item dt { font-size: 28px; text-align: center; margin-bottom: 20px; }
.section01 .item dt span { display: block; margin-top: 14px; }
.section01 .item dt span i { font-size: 14px; display: inline-block; border-bottom: 2px solid #ffffff; padding-bottom: 24px; text-transform: uppercase; }
.section01 .item dd { font-size: 14px; line-height: 26px; }
.section02 { background: url(../images/section01_bg.jpg) no-repeat center top; padding: 70px 0 0; height: 680px; }
.section02 .title h3 { color: #FFFFFF; }
.section02 .title p { color: #d4d4d4; }
.section02 .process { margin-left: 150px; }
.section02 .processcont { width: 191px; height: 191px; background: url(../images/section02_circle.png) no-repeat; padding: 26px; position: relative; float: left; margin: 0 70px 40px 0; }
.section02 .processcont .circle { width: 190px; height: 190px; position: relative; }
.section02 .circle .cg { position: absolute; top: 0; width: 50%; overflow: hidden; height: 190px; transform: rotateZ(-360deg); }
.section02 .circle .cg.left { left: 0; transform-origin: 100% 50%; }
.section02 .circle .cg.right { right: 0; transform: rotateZ(360deg); }
.section02 .circle .cg .c { position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-image: url(../images/section02_circlehover.png); background-repeat: no-repeat; background-position: 100% 50%; transform-origin: 0 50%; }
.section02 .circle .cg.left .c { background-position: 0 0; transform-origin: 100% 50%; }
.section02 .txt { position: absolute; top: 45%; left: 38%; color: #ffffff; font-size: 16px; text-align: center; }
.section03 { background: url(../images/section02_bg.jpg) no-repeat center top; height: 620px; padding: 60px 0 0; }
.section03 .advan { position: relative;width: 1200px; }
.section03 .advan_center { position: absolute; top: 100px; left: 50%; margin-left: -215px; }
.section03 dt { background: url(../images/hexagon.png) no-repeat; width: 88px; height: 97px; line-height: 97px; text-align: center; font-size: 32px; color: #e30000; display: inline; }
.section03 .advan01 dt, .advan03 dt { float: right; margin-left: 10px; }
.section03 dl { width: 328px; }
.section03 dd { font-size: 14px; line-height: 26px; text-align: right; padding-top: 15px; }
.section03 .advan02 dt, .advan04 dt { float: left; margin-right: 10px; }
.section03 .advan02 dd, .advan04 dd { text-align: left; }
.section03 .advan01 { position: absolute; top: 70px; left: 40px; }
.section03 .advan02 { position: absolute; top: 70px; right: 40px; }
.section03 .advan03 { position: absolute; top: 310px; left: 40px; }
.section03 .advan04 { position: absolute; top: 310px; right: 40px; }
.section04 { background: url(../images/section03_bg.jpg) no-repeat center top; padding: 60px 0; }
.section04 .title h3 { color: #fff; }
.section04 .about { width: 1030px; margin: 0 auto; }
.section04 .wechat { background: url(../images/section04_wechat.jpg) no-repeat center top; width: 330px; height: 441px; text-align: center; }
.section04 .wechat .tit { margin-top: 15px; }
.section04 .wechat p { font-size: 18px; line-height: 28px; }
.section04 .qrCode { width: 194px; height: 194px; position: relative; margin: 120px 0 0 65px; overflow: hidden; }
.section04 .qrCode:after { content: ''; position: absolute; left: 0; top: -100px; background: url(../images/qrcode_line.png) no-repeat center top; width: 100%; height: 157px; -webkit-animation: qrcode 3s linear infinite both; animation: qrcode 3s linear infinite both; }
@-webkit-keyframes qrcode {
0% {
 top: -100px;
}
100% {
 top:194px;
}
}
 @keyframes qrcode {
0% {
 top: -100px;
}
100% {
 top:194px;
}
}
.section04 .info { width: 548px; height: 401px; background: url(../images/section04_info.png) no-repeat; padding: 40px 40px 0; position: relative; }
.section04 .info .tit { font-size: 22px; color: #fff; border-bottom: 1px solid #fff; padding: 5px 0 18px; margin-bottom: 20px; }
.section04 .info .txt p { color: #f6f1f1; font-size: 15px; line-height: 34px; margin-bottom: 15px; }
.section04 .info a { bottom: 50px; position: absolute; right: 50px; display: block; width: 128px; height: 95px; background: url(../images/btn.png) no-repeat; color: #fff; font-size: 16px; line-height: 26px; text-align: center; padding-top: 35px; }
.section04 .info a span { display: block; font-size: 26px; }
.section04 .info a:hover { opacity: 0.8 }
.bottom_wrap { background: rgba(0,0,0,.69); position: fixed; left: 0; right: 0; bottom: 0px; z-index: 9999; height: 110px; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#B2000000,endColorstr=#B2000000);}
.bottom_wrap .bottom_pic { position: absolute; top: -42px; left:40px; }
.bottom_wrap .bottom_form { position: absolute; right:100px; top:20px;}
.bottom_wrap .bottom_form .icon { float: left; width: 38px; height: 32px; border: solid 1px #e5e5e5; background: url(../images/bottom_icon.jpg) no-repeat; }
.bottom_wrap .bottom_form .bottom_input { float: left; height: 32px; line-height: 32px;  border: 1px solid #e5e5e5;border-left:none; margin: 0; width:200px; padding-left:12px; }
.bottom_wrap .bottom_form .btn { margin-top:10px;}
.bottom_wrap .bottom_form .btn a { float:left; margin-right:13px; width:120px; display:inline; background:#ff4d49; line-height:34px; height:34px; color:#FFFFFF; font-size:14px; text-align:center; }
.bottom_wrap .bottom_form .btn a:hover { opacity:0.8;}
.bottom_wrap .bottom_form .btn a.btn02 { background:#ec9307; margin-right:0px;}
.bottom_wrap .close { position:absolute; top:8px; right:40px; height: 35px; width: 35px;  border-radius: 35px;display: block;   background:url(../images/footer_close.png) 5px 7px no-repeat;  background-color: rgba(0,0,0,.6);   margin-top: 10px;  }
.writePop,.consPop {width:666px;height:530px;background-color:#ececec;border:4px solid #eb0000;position:fixed;left:50%;margin-left:-333px;top:50%;margin-top:-283px;z-index:93;display:none}
.writePop-hd {height:59px;line-height:55px;font-size:18px;color:#fff;position:relative;text-indent:20px;background-color:#eb0000;overflow:hidden}
.writePop-hd .close{display:block;width:32px;height:32px;background:url(../images/close.png) no-repeat;position:absolute;right:18px;top:12px;z-index:2}
.writePop-bd {margin-top:35px}
.writePop-bd li {padding-top:16px;}
.writePop-bd li .btn-2 {background-color:#ff8a00}
.writePop-bd li .btn-2:hover {background-color:#ff6600}
.writePop-bd li.submit {padding-top:21px;}
.section7-form {width:590px;margin:0 auto;margin-top:6px;overflow:hidden}
.section7-form  li {position:relative;padding-top:35px;overflow:hidden}
.section7-form  li .leftCon {float:left;width:285px;height:46px;background-color:#fff;overflow:hidden}
.section7-form  li .rightCon {float:right;width:285px;height:46px;background-color:#fff;overflow:hidden}
.section7-form  li .input {padding:16px 20px 0 20px;position:relative}
.section7-form  li .input .inp {width:100%;border:none;background:none}
.section7-form  li .btn {width:100%;height:46px;background-color:#5b9432;border:none;cursor:pointer;color:#fff;font-size:18px}
.section7-form  li .btn:hover {background-color:#429d00}
.section7-form  li .textarea {height:110px;padding:18px 20px;background-color:#fff;vertical-align:top;position:relative}
.section7-form  li .textarea textarea {width:100%;height:110px;border:none;background:none;overflow:hidden}
.section7-form  li .select {position:relative;padding:12px 10px;}
.section7-form  li .select select {background:none;border:none;width:100%;}
.darkbg {width:100%;height:100%;background-color:#000;background-color:rgba(0,0,0,.8);position:fixed;left:0;top:0;right:0;bottom:0;z-index:92}