@charset 'utf-8';
body { font-family: '微软雅黑', Arial; background: #fff }
.scale_img dt img, .scale_img li img { -o-transition: all 1s linear 0s; transition: all 1s linear 0s }
.scale_img dt:hover img, .scale_img li:hover img { -webkit-transform: scale(1.05) rotate(0deg) translateY(0); -ms-transform: scale(1.05) rotate(0deg) translateY(0); transform: scale(1.05) rotate(0deg) translateY(0) }

h2.main_title a { display: block; font-weight: 400; font-size: 34px; line-height: 100%; color: #333; letter-spacing: 2px }
h2.main_title img { display: inline-block; margin-left: 16px }

.fullSlide { position: relative; z-index: 1; clear: both; width: 100% }
.fullSlide .bd { margin: 0 auto; position: relative; z-index: 0; overflow: hidden }
.fullSlide .bd .con { width: 100% !important; height: auto !important; display: block }
.fullSlide .bd .li { width: 100% !important; overflow: hidden; text-align: center; background: no-repeat center top; z-index: 0 }
.fullSlide .bd .li img { display: block; height: auto !important; width: 100% }
.fullSlide .hd { position: absolute; width: 100%; height: 12px; left: 0; bottom: 90px; text-align: center; cursor: pointer }
.fullSlide .hd li { display: inline-block; width: 12px; height: 12px; background: #fff; margin: 0 19px; border-radius: 50%; opacity: .6; -o-transition: all .3s ease; transition: all .3s ease }
.fullSlide .hd li.on { width: 36px; height: 12px; opacity: 1; border-radius: 5px }
.fullSlide p { display: none; position: absolute; top: 50%; width: 80px; height: 80px; z-index: 99; opacity: 1; text-align: center; margin-top: -40px }
.fullSlide .prev2 { left: 3% }
.fullSlide .next2 { right: 3% }

.intro { position: relative; padding: 50px 65px 50px 72px; background: #F1F5F8; width: 1200px; margin: -50px auto 106px; z-index: 99; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }
.intro .intro_con { float: left; width: 471px }
.intro h2 a { display: block; position: relative; font-size: 33px; line-height: 100%; color: #333; font-weight: 400; padding-bottom: 32px }
.intro h2 a:after { position: absolute; content: ""; width: 49px; height: 3px; background: #faaa30; bottom: 0; left: 0 }
.intro p { font-size: 15px; line-height: 24px; color: gray; margin: 30px 0 40px }
.intro p:last-child { font-size: 22px; line-height: 100%; color: #4d4d4d; margin: 0 }
.intro .pic { float: right; width: 535px; height: 254px }

.sm_banner {  background: #2271BE ; padding:40px 0; }
.sm_banner h2 a { display: block; text-align: center }
.sm_banner h2 span { display: inline-block; font-size: 36px; line-height: 58px; color: #fff; font-weight: 400 }
.sm_banner h2 img { display: inline-block; margin-left: 14px; vertical-align: -6px }
.sm_banner p{ text-align:center; color:#fff; font-size:20px; margin-top:10px;}

.project { padding-top: 76px; padding-bottom: 118px; background: #F1F5F8 }
.pro_nav { margin-bottom: 38px }
.pro_nav h2 { float: left }
.pro_nav h2 a { display: block; font-size: 24px; line-height: 100%; color: #333 }
.pro_nav h2 span { display: inline-block; font-size: 16px; line-height: 100%; color: #4d4d4d; font-weight: 400; text-transform: uppercase; position: relative; padding-left: 14px; margin-left: 11px }
.pro_nav h2 span:before { position: absolute; content: "/"; font-size: 16px; line-height: 100%; color: gray; left: 0 }
.pro_nav>div { float: right }
.pro_nav h3 { float: left; margin-right: 7px; padding-right: 17px; position: relative; margin-bottom:10px;}
.pro_nav h3 a { display: block; font-size: 15px; line-height: 100%; color: #4d4d4d; font-weight: 400; -o-transition: all .3s ease; transition: all .3s ease; padding-bottom: 4px }
.pro_nav h3:before { position: absolute; content: ""; right: 0; top: 0; width: 1px; height: 15px; background: #4D4D4D }
.pro_nav h3:first-child:before {  }
.pro_nav .more { float: right; margin-left: 27px; margin-top: -8px }
.pro_nav h3 a:hover { color: #faaa30; font-weight: 700; border-bottom: 3px solid #faaa30 }
.attitude { border-top: 2px solid #D0DBE5; height: 307px; background: #fff; margin-bottom: 44px }
.attitude dt { width: 599px; height: 307px; overflow: hidden; float: left }
.attitude dt img { width: 599px; height: 307px }
.attitude dd { width: 600px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 48px 68px 0 54px; float: right }
.attitude dd h4 { font-size: 22px; line-height: 100%; color: #2271be; font-weight: 400 }
.attitude dd>p { font-size: 15px; line-height: 24px; color: gray; margin: 15px 0 23px; letter-spacing: 1px }
.attitude dd .say { position: relative }
.attitude dd .say:after { position: absolute; content: ""; width: 283px; height: 1px; background: #D4DEE7; top: 23px; right: 16px }
.attitude dd .say img:first-child { float: left; width: 81px; height: 81px; border-radius: 50%; margin-right: 14px }
.attitude dd .say img:nth-child(2) { margin-top: 12px }
.attitude dd .say p { font-size: 14px; line-height: 18px; color: gray; margin-top: 6px }
.pro_list dl { width: 214px; height: 449px; float: left; margin-right: 17px; position: relative }
.pro_list dl:last-child { margin-right: 0 }
.pro_list dt { width: 214px; height: 449px; overflow: hidden }
.pro_list dd { width: 214px; height: 449px; background: rgba(0, 0, 0, .4); padding-top: 128px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: absolute; left: 0; bottom: 0; -o-transition: bottom .3s ease; transition: bottom .3s ease }
.pro_list dd img { display: block; width: 56px; height: 56px; background: #2271BE; border-radius: 50%; margin: 0 auto 23px }
.pro_list dd h3 { font-size: 22px; line-height: 100%; color: #fff; text-align: center; font-weight: 400 }
.pro_list dd h3 span { display: block; font-size: 14px; line-height: 100%; color: rgba(255, 255, 255, .5); text-transform: uppercase; margin-top: 19px }
.pro_list dd p { display: none; font-size: 15px; line-height: 24px; color: #4d4d4d; margin: 19px 0 18px }
.pro_list dd a>span { display: none; width: 105px; height: 24px; border: 1px solid #faaa30; border-radius: 13px; font-size: 14px; line-height: 24px; color: #faaa30; text-align: center; -o-transition: all .3s ease; transition: all .3s ease }
.pro_list dd a>span:hover { width: 120px }
.pro_list dl.on { width: 506px; height: 449px }
.pro_list dl.on dt { width: 506px; height: 449px }
.pro_list dl.on dt img:first-child { display:none;}
.pro_list dl.on dd { width: 448px; height: 230px; background: rgba(255, 255, 255, .98); box-shadow: 0 5px 35px 0 rgba(0, 0, 0, .11); border-bottom: 9px solid #faaa30; left: 29px; bottom: -30px; padding: 41px 53px 0 }
.pro_list dl.on dd img { display: none }
.pro_list dl.on dd h3 { color: #4D4D4D; text-align: left }
.pro_list dl.on dd h3 span { color: rgba(77, 77, 77, .4); margin-top: 8px }
.pro_list dl.on dd p, .pro_list dl.on dd a>span { display: block }

.other { padding-top: 79px; padding-bottom: 58px }
.other .pro_nav { margin-bottom: 0 }
.other_con { padding: 35px 10px; width: 1221px; margin: 0 auto; overflow: hidden }
.other_con .tempWrap, .other_con .other_list { overflow: visible !important }
.other_con dl { width: 387px; margin: 0 10px; float: left; -o-transition: all .3s ease; transition: all .3s ease }
.other_con dt { width: 387px; height: 229px; overflow: hidden }
.other_con dt img { width: 387px; }
.other_con dd { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 25px 33px 0; height: 201px; background: #F1F5F8; -o-transition: all .3s ease; transition: all .3s ease }
.other_con dd h3 { font-size: 22px; line-height: 100%; color: #2370be; font-weight: 400 }
.other_con dd h3 span { display: block; font-size: 14px; line-height: 100%; color: rgba(77, 77, 77, .4); text-transform: uppercase; margin-top: 8px }
.other_con dd p { font-size: 15px; line-height: 24px; color: gray; margin: 15px 0 }
.other_con dd a>span { display: block; width: 105px; height: 24px; border: 1px solid #2271BE; border-radius: 13px; font-size: 14px; line-height: 24px; color: #2271be; text-align: center; -o-transition: all .3s ease; transition: all .3s ease }
.other_con dd a>span:hover { width: 120px }
.other_con dl:hover { box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .11) }
.other_con dl:hover dd { background: rgba(255, 255, 255, .98); border-bottom: 9px solid #faaa30 }
.other_con dl:hover dd a>span { color: #faaa30; border-color: #faaa30 }
.other_switch { position: relative }
.other_switch div { position: absolute; top: -288px; width: 21px; height: 57px; padding: 0 20px; cursor: pointer }
.other_switch .other_prev { left: -110px }
.other_switch .other_next { right: -110px }

.why { background: #2271BE; height: 240px }
.why .content { position: relative }
.why h2 { margin-top: 82px }
.why h2 a { display: block; font-size: 30px; line-height: 1.4; color: #fff; font-weight: 400 }
.why h2 i { display: inline-block; font-size: 34px; text-transform: uppercase }
.why h2 span { display: block; font-size: 24px; line-height: 100%; color: #fff; margin-top: 21px }
.why .ask { width: 368px; height: 89px; background: #fff; border-radius: 2px; font-weight: 700; margin-top: 76px; margin-left: 68px }
.why .ask a { display: block; font-size: 28px; line-height: 30px; color: #2271be; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 14px 35px 0; height: 89px; letter-spacing: 1px }
.why .ask i { display: inline-block; font-size: 14px; line-height: 26px; color: #fff; text-align: center; width: 107px; height: 26px; background: #faaa30; border-radius: 13px; vertical-align: 5px; margin-left: 4px; -o-transition: all .3s ease; transition: all .3s ease }
.why .ask i:hover { width: 120px }
.why .ask span { display: block }
.why .pic { position: absolute; right: 0; top: 10px; z-index: 2 }

.power { padding: 79px 0 112px; background: #F1F5F8 }
.power h2 { padding-left: 458px; margin-bottom: 62px }
.power1 { overflow: hidden; margin-bottom: 82px }
.power1 dt { width: 858px; height: 506px; overflow: hidden; position: relative; float: left }
.power1 dt img { width: 858px; height: 506px }
.power1 dt .info { position: absolute; right: 0; bottom: 0; background: rgba(255, 255, 255, .98); width: 611px; height: 178px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 39px 28px 0 35px }
.power1 dt .info h4 { font-size: 22px; line-height: 100%; color: #4d4d4d; margin-bottom: 15px; font-weight: 400 }
.power1 dt .info p { font-size: 15px; line-height: 24px; color: gray }
.power1 dt .info:before { position: absolute; content: ""; width: 49px; height: 3px; background: #faaa30; left: 35px; top: 0 }
.power1 dd { width: 305px; height: 506px; background: #2271BE; float: right }
.power1 dd h3 { padding: 61px 61px 51px; font-weight: 400; line-height: 0 }
.power1 dd h3 strong { display: block; font-size: 30px; line-height: 100%; color: #fff; margin: 20px 0 12px; font-weight: 400 }
.power1 dd h3 span { display: block; font-size: 14px; line-height: 100%; color: rgba(255, 255, 255, .4); text-transform: uppercase }
.power2 { overflow: hidden }
.power2 dt { width: 528px; height: 395px; overflow: hidden; float: left }
.power2 dt img { width: 528px; height: 395px }
.power2 dd { float: left; margin-left: 57px; width: 549px; margin-top: 69px }
.power2 dd h3 { position: relative; line-height: 0; padding-bottom: 18px }
.power2 dd h3:after { position: absolute; content: ""; width: 49px; height: 3px; background: #faaa30; left: 0; bottom: 0 }
.power2 dd h3 img { float: left; margin-right: 15px }
.power2 dd h3 strong { display: block; font-size: 30px; line-height: 100%; color: #2271be; font-weight: 400; margin: 4px 0 9px }
.power2 dd h3 span { display: block; font-size: 14px; line-height: 100%; color: rgba(34, 113, 190, .4); text-transform: uppercase; font-weight: 400 }
.power2 dd h4 { font-size: 22px; line-height: 100%; color: #4d4d4d; font-weight: 400; margin: 18px 0 16px }
.power2 dd p { font-size: 15px; line-height: 24px; color: #4d4d4d }
.power3 { height: 397px; overflow: hidden; margin-top: -41px }
.power3 dt { float: right; width: 531px; height: 397px; position: relative; overflow: visible }
.power3 dt>img { width: 531px; height: 397px }
.power3 dt .ask { width: 292px; height: 189px; background: #faaa30; border-radius: 2px; position: absolute; left: -177px; bottom: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-top: 36px }
.power3 dt .ask img { width: 124px; height: 39px; display: block; margin-left: 99px; margin-bottom: 17px }
.power3 dt .ask p { background: url(img/p_tel.png) no-repeat left top; margin-left: 35px; width: 225px; padding-left: 64px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-bottom: 11px; border-bottom: 1px solid rgba(255, 255, 255, .5) }
.power3 dt .ask p span { display: block; font-size: 13px; line-height: 100%; color: #fff; margin: 5px 0 8px }
.power3 dt .ask p strong { display: block; font-size: 22px; line-height: 100%; color: #fff }
.power3 dd { margin-top: 155px; width: 435px; float: left; margin-left: 0 }

.case { background: url(img/case_bg.jpg) no-repeat center top; padding-top: 109px }
.case h2 a { color: #fff }
.case .content { position: relative }
.case_nav { position: absolute; top: -17px; right: 0 }
.case_nav li { width: 80px; height: 80px; float: left; margin-left: 32px; position: relative; -o-transition: all .3s ease; transition: all .3s ease; background: #fff; border-radius: 50% }
.case_nav li img { width: 80px; height: 80px; border-radius: 50%; position: relative; z-index: 2 }
.case_nav li:before { position: absolute; content: ""; width: 97px; height: 107px; background: url(img/cicon.png) no-repeat; top: -8px; left: -8px; -o-transition: all .3s ease; transition: all .3s ease; opacity: 0 }
.case_nav li.on img { box-shadow: 0 5px 35px 0 rgba(0, 0, 0, .11) }
.case_nav li.on:before { opacity: 1; z-index: 1 }
.case_nav div { width: 80px; height: 80px; float: left; margin-left: 32px; position: relative; -o-transition: all .3s ease; transition: all .3s ease; background: #fff; border-radius: 50% }
.case_nav div img { width: 80px; height: 80px; border-radius: 50%; position: relative; z-index: 2 }
.case_nav div:hover img { box-shadow: 0 5px 35px 0 rgba(0, 0, 0, .11) }
.case_con { margin-top: 73px; background: #fff }
.case_con dl { height: 362px; overflow: hidden }
.case_con dt { width: 600px; height: 362px; overflow: hidden; float: left }
.case_con dt img { width: 600px; height: 362px }
.case_con dd { float: right; background: #F1F5F8; width: 600px; height: 362px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 75px 92px 0 73px }
.case_con dd h4 { font-size: 22px; line-height: 34px; color: #4d4d4d; font-weight: 400; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; position: relative; padding-bottom: 24px; -o-transition: all .3s ease; transition: all .3s ease }
.case_con dd h4:after { position: absolute; content: ""; width: 49px; height: 3px; background: #faaa30; left: 0; bottom: 0 }
.case_con dd p { font-size: 15px; line-height: 24px; color: gray; margin-top: 25px }
.case_con dd p span:hover{color: #faaa30}
.case_con dl:hover h4 { color: #faaa30 }
.case_switch { position: absolute; z-index: 3; width: 110px; height: 45px; left: 543px; bottom: 0 }
.case_switch div { width: 55px; height: 45px; cursor: pointer; float: left }
.case_switch .case_prev { background: #faaa30 }

.news { padding: 92px 0 100px }
.news h2 { padding-left: 494px; margin-bottom: 53px }
.news h3 a { display: block; font-size: 28px; line-height: 100%; color: #333; font-weight: 400; padding-bottom: 14px; border-bottom: 1px solid #D1D1D1 }
.news h3 a span { font-size: 14px; color: #999; float: right; margin-top: 8px; font-family: Arial; -o-transition: all .3s ease; transition: all .3s ease }
.news h3 a span:hover { color: #2271be }
.company { width: 580px }
.company dl { margin-top: 30px; margin-bottom: 21px }
.company dt { width: 580px; height: 200px; overflow: hidden }
.company dt img { width: 580px; height: 200px;  }
.company dd h4 { font-size: 18px; line-height: 26px; color: #1a1a1a; -o-transition: all .3s ease; transition: all .3s ease; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin: 21px 0 11px; font-weight: 400 }
.company dd h4 span { display: inline-block; font-size: 16px; line-height: 24px; color: #2271be; width: 50px; height: 26px; border: 1px solid #2271be; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-radius: 3px; text-align: center; margin-right: 10px }
.company dd p { font-size: 14px; line-height: 24px; color: #666 }
.company dd p span { color: #1A1A1A }
.company dl:hover dd h4 { color: #2271be }
.company li { padding-left: 20px; position: relative; height: 35px }
.company li:before { position: absolute; content: ""; width: 6px; height: 6px; left: 0; top: 14px; background: #626262; -o-transition: all .3s ease; transition: all .3s ease; border-radius: 50% }
.company li h4 { display: inline-block; font-size: 18px; line-height: 35px; color: #626262; max-width: 400px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 400; position: relative; -o-transition: all .3s ease; transition: all .3s ease }
.company li h4:after { position: absolute; content: ""; width: 0; bottom: 8px; left: 0; height: 1px; background: #2271be; -o-transition: all .3s ease; transition: all .3s ease }
.company li span { float: right; font-size: 14px; line-height: 35px; color: #a1a1a1 }
.company li:hover:before { background: #2271be }
.company li:hover h4 { color: #2271be }
.company li:hover h4:after { width: 100% }
.wiki { width: 560px }
.wiki dl { padding-bottom: 22px; border-bottom: 1px solid #E8E8E8; margin-bottom: 17px; margin-top: 37px }
.wiki li h4 { font-size: 14px; line-height: 35px; color: #626262 }
.wiki li:before { top: 16px }
.news_more { margin-top: 41px }
.news_more img { width: 430px; height: 112px; float: left }
.news_more p { float: right; width: 130px; height: 112px; background: #2271be; font-size: 22px; line-height: 100%; color: #fff; display: table; text-align: center; -o-transition: all .5s ease; transition: all .5s ease }
.news_more p:hover { background: #1c5c9b }
.news_more span { display: table-cell; vertical-align: middle }
.news_more i { display: block; margin-top: 2px }

.about { height: 650px; background: url(img/about_bg.jpg) no-repeat center top; padding-top: 90px }
.about h2 { padding-left: 529px }
.about h2 a { color: #fff }
.about p { width: 671px; font-size: 14px; line-height: 24px; color: #fff; text-align: center; margin: 33px auto 49px }
.about p a { color: #faaa30; -o-transition: all .3s ease; transition: all .3s ease }
.about p a:hover { font-weight: 700 }
.about_con { height: 345px; background: #F1F5F8; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 45px 58px 47px }
.about_con .pic { width: 399px; height: 229px; margin-top: 12px; float: left; margin-right: 81px }
.about_con .pic img { width: 399px; height: 229px }
.about_con .album { float: left; width: 562px; height: 253px; background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 26px }
.about_con .album li { width: 147px; height: 208px; overflow: hidden; margin: 21px 11px }
.about_con .album li img { width: 147px; height: 208px }
.album_switch div { width: 55px; height: 45px; cursor: pointer; position: absolute; z-index: 3; top: 150px }
.album_switch .album_prev { background: #faaa30; left: 483px }
.album_switch .album_next { right: 45px }

.links { height: 84px; overflow: hidden; background: #333; clear: both }
.links .content { border-top: 1px solid #4a4a4b }
.links em { display: inline-block; font-style: normal; font-size: 14px; line-height: 83px; font-weight: 700; color: #A7A7A7; margin-right: 44px }
.links span { font-size: 16px }
.links a { font-size: 14px; color: #a7a7a7; line-height: 83px; display: inline-block; margin-right: 26px; transition: .3s ease; -o-transition: .3s ease }
.links a:hover { color: #fff }

@-webkit-keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown1 {
    from { opacity: 0; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown1 { -webkit-animation-name: fadeInDown1; animation-name: fadeInDown1 }
@-webkit-keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
@keyframes fadeInDown2 {
    from { opacity: 0; -webkit-transform: translate3d(0, -20%, 0); transform: translate3d(0, -20%, 0) }
    to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
}
.fadeInDown2 { -webkit-animation-name: fadeInDown2; animation-name: fadeInDown2 }
@-webkit-keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft1 {
    from { -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft1 { -webkit-animation-name: fadeInLeft1; animation-name: fadeInLeft1 }
@-webkit-keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInLeft2 {
    from { -webkit-transform: translate3d(-5%, 0, 0); transform: translate3d(-5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInLeft2 { -webkit-animation-name: fadeInLeft2; animation-name: fadeInLeft2 }
@-webkit-keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInRight1 {
    from { -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInRight1 { -webkit-animation-name: fadeInRight1; animation-name: fadeInRight1 }
@-webkit-keyframes fadeInRight2 {
    from { -webkit-transform: translate3d(5%, 0, 0); transform: translate3d(5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInRight2 {
    from { -webkit-transform: translate3d(5%, 0, 0); transform: translate3d(5%, 0, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInRight2 { -webkit-animation-name: fadeInRight2; animation-name: fadeInRight2 }
@-webkit-keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
@keyframes zoomLeft {
    from { -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3); opacity: 0 }
    50% { opacity: 1 }
}
.zoomLeft { -webkit-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
.zoomRight { -webkit-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-animation-name: zoomLeft; animation-name: zoomLeft }
@-webkit-keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp1 {
    from { -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp1 { -webkit-animation-name: fadeInUp1; animation-name: fadeInUp1 }
@-webkit-keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
@keyframes fadeInUp2 {
    from { -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0); opacity: 0 }
    to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 }
}
.fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2 }
@keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-moz-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-webkit-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}
@-o-keyframes myfirst {
    0% { top: 0; left: 0 }
    25% { top: 10px; left: 0 }
    50% { top: 0; left: 0 }
    100% { top: 0; left: 0 }
}



  .advantage {

overflow: hidden;

width: 100%;

background: url("../img/advantagebg.jpg") no-repeat center;

height: 843px;
}

.advantage .advantageList {

	width: 1200px;



	height: 385px;

	position: relative;
margin: 0 auto;
margin-top: 52px;

}

.advantage li {

	width: 176px;

	padding: 0 15px;

	background: url("../img/yslibg.png") no-repeat center top;

	position: absolute;

	text-align: center;

	height: 249px;

	color: #fff

}

.advantage li h3 {

	font-size: 24px;

	margin-top: 45px;

}

.advantage li p {

	margin-top: 20px;

	line-height: 22px;

	font-size: 14px;

}

.advantage li i {

	position: absolute;

	background: url("../img/advantageli.png") no-repeat center top;

	width: 25px;

	height: 25px;

	left: 50%;

	margin-left: -12px;

}

.advantage li.li01 {

	left: 0;

	top: 70px;

}

.advantage li.li02 {

	left: 265px;

	top: 0px;

}

.advantage li.li03 {

	right: 265px;

	top: 0px;

}

.advantage li.li04 {

	right: 0;

	top: 70px;

}

.advantage li.li01 i {

	bottom: -105px;

}

.advantage li.li02 i {

	bottom: -83px;

}

.advantage li.li03 i {

	bottom: -75px;

}

.advantage li.li04 i {

	bottom: -95px;

}

.advantage li:hover {

	background-position: bottom;

	color: #724217

}

.advantage li:hover i {

	background-position: bottom;

}
 .Principle {

overflow: hidden;

width: 100%;

background-color: #fff;

padding-bottom: 35px

}

.Principle .title {

margin-top: 55px;

}

.Principle .list {

overflow: hidden;

width: 1200px;

margin: 0 auto;

margin-top: 20px;

}

.Principle .list li {

float: left;

width: 220px;

padding: 0 10px;

text-align: center;

overflow: hidden

}

.Principle .list li h3 {

font-size: 24px;

color: #0e6cff;

font-weight: normal;

margin-top: 15px;

}

.Principle .list li p {

line-height: 22px;

font-size: 14px;

color: #666666;

height: 66px;

margin-top: 15px;

}

.Principle h4 {

color: #b8d3c4;

background: url("../img/principlephone.png") no-repeat center;

margin: 0 auto;

width: 360px;

height: 50px;

line-height: 50px;

margin-top: 25px;

text-align: center;

font-size: 26px;/* font-weight: normal */

}

.Principle h4 span {

font-size: 18px;

color: #fff;

font-weight: normal

}.cp-box{ width:1200px; overflow:hidden; margin:20px auto 0 auto;}
.cp-tit{ height:30px; line-height:30px; text-align:center; font-size:30px; background:url(../img/cp-tit.jpg) center no-repeat; overflow:hidden;}
.cp-tit span{ font-size:30px; color:#cfcfcf; margin:0 5px 0 0;}




/**fwtd_box**/

.fwtd_box{ width:1200px; height:445px; margin:30px auto;}
.h3title { padding:40px 0 0 0;}
.fwtd_box h3,.h3title h3{ width:850px; height:130px; margin:0px auto 30px; background:url(../img/fwtd_tit.jpg) no-repeat; text-align:center;}

.fwtd_box h3 a,.h3title  h3 a{ font-size:30px; color:#0094de; font-weight:bold; display:block; line-height:30px; padding-top:28px;}

.fwtd_box h3 span,.h3title  h3 span{ font-size:18px; color:#303030; display:block; line-height:18px; padding-top:26px;}

#tab1 .tab_menu1{ width:1200px; height:35px; text-align:center;}

#tab1 .tab_menu1 li{ display:inline-block; *display:inline; zoom:1; width:109px; height:35px; line-height:35px; font-size:15px; text-align:center; background:#2271BE; border-radius:5px; margin:0px 5px;}

#tab1 .tab_menu1 li a{ display:block; color:#fff;}

#tab1 .tab_menu1 .selected1{ background:#faaa30;}

#tab1 .hide{display:none;}

.tab_box1{width:1200px; height:220px; margin-top:30px;}

.tab_box1 ol li{ float:left; width:280px; height:220px; margin:0px 10px; text-align:center; position:relative;}

.tab_box1 ol li img {width:270px; height:210px; padding:4px; border:1px solid #ccc;}

.tab_box1 ol li span{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:280px; line-height:40px; background:url(../img/bg02.png); position:absolute; left:0px; bottom:0px; font-size:14px; color:#fff;}







/**al_box**/

.al_box{ width:1180px; height:832px; margin:auto;}

.al_box h3{ width:850px; height:130px; margin:0px auto 30px; background:url(../img/al_tit.jpg) no-repeat; text-align:center;}

.al_box h3 a{ font-size:30px; color:#0094de; font-weight:bold; display:block; line-height:30px; padding-top:28px;}

.al_box h3 span{ font-size:18px; color:#303030; display:block; line-height:18px; padding-top:26px;}

#tab2 .tab_menu2{ width:1180px; height:58px; text-align:center;}

#tab2 .tab_menu2 li{ display:inline-block; *display:inline; zoom:1; width:180px; height:58px; line-height:58px; font-size:18px; text-align:center; background:#0094de; margin-left:-3px;}

#tab2 .tab_menu2 li a{ display:block; color:#fff;}

#tab2 .tab_menu2 .selected2{ background:#00acef;}

#tab2 .hide{ display:none;}

#tab2 .tab_box2{ width:1180px; height:615px; position:relative;}

#tab2 .tab_box2 ol{ height:510px;}

#tab2 .tab_box2 ol li{ float:left; width:330px; height:250px; margin:10px 0px 0px 10px;}

#tab2 .tab_box2 ol li img{ display:block; width:330px; height:250px;}

#tab2 .tab_box2 ol li:first-child{ width:500px; height:500px; margin:10px 0px 0px;}

#tab2 .tab_box2 ol li:first-child img{ display:block; width:500px; height:500px;}

#tab2 .tab_box2 p{ height:105px; background:#f2f2f2; position:absolute; left:0px; top:510px;}

#tab2 .tab_box2 p span{ display:block; width:130px; height:109px; background:url(../img/al_bg.jpg); margin-top:-40px; float:left; text-align:center; padding-top:35px;}

#tab2 .tab_box2 p b a{ display:block; font-size:15px; color:#fff; line-height:20px; margin-bottom:30px; white-space:nowrap; overflow:hidden; padding: 0px 10px;}

#tab2 .tab_box2 p i a{ display:block; width:98px; height:30px; border:1px solid #fff; border-radius:30px; line-height:30px; color:#fff; margin:auto;}

#tab2 .tab_box2 p em{ display:block; width:990px; margin:22px 0px; padding:0px 30px; line-height:30px; height:60px; overflow:hidden; color:#666;}



/**fwhy_box**/

.fwhy_box{ height:428px; background:url(../img/fwhy_bg.jpg); margin:30px 0px;}

.fwhy_big{ width:1180px; height:428px; margin:auto;}

.fwhy_big h4{ width:850px; height:130px; margin:0px auto 30px; background:url(../img/fwhy_tit.png) no-repeat center 40px; text-align:center; padding-top:40px;}

.fwhy_big h4 b{ font-size:30px; color:#0094de; display:block; line-height:30px; padding-top:28px;}

.fwhy_big h4 span{ font-size:18px; color:#303030; display:block; line-height:18px; padding-top:26px;}

.fwhy_big ul li{ width:168px; height:190px; float:left; background:url(../img/fwhy_bg1.jpg) no-repeat top; cursor:pointer;}

.fwhy_big ul li img{ display:block; width:75px; height:60px; margin:30px auto;}

.fwhy_big ul li span{ display:block; font-size:14px; color:#666; text-align:center; background:url(../img/fwhy_titi.jpg) no-repeat center bottom; height:40px; line-height:40px; padding-top:25px;}

.fwhy_big ul li:hover{ background:url(../img/fwhy_bg2.jpg) no-repeat top;}