@charset "utf-8";

body { font-family: "微软雅黑", Arial; background: #fff }

.scale_img dl img, .scale_img li img { -o-transition: all 1s linear 0s; transition: all 1s linear 0s }

.scale_img dl: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 { text-align: center; display: block; font-size: 18px; color: #333; line-height: 100%;font-weight: bold; }

h2.main_title span { display: block; text-align: center; font-size: 12px; color: #333; line-height: 100%; margin-top: 11px; font-weight: 400 }

h2.main_title a:hover { color: #333 }



.banner { width: 100%; position: relative; z-index: 1; clear: both; margin-top: -97px; margin-bottom: -124px; line-height: 0; overflow: hidden }

.banner .bd { width: 100% !important; height: 800px }

.banner .bd li { width: 100% !important; position: relative }

.banner .bd li a { display: block; height: 800px }

.banner .bd li img { position: absolute; left: 50%; top: 0; margin-left: -960px }

.banner p { position: absolute; top: 50%; width: 80px; height: 80px; z-index: 9; opacity: .8; text-align: center; margin-top: -40px }

.banner .prev2 { left: 3% }

.banner .next2 { right: 3% }



.seabox { position: relative; z-index: 3; height: 108px }

.s_contact { width: 352px; height: 108px; background: rgba(255, 255, 255, .9) }

.s_contact p { margin: 32px 0 0 50px; padding-left: 60px; background: url(../images/h_tel1.png) no-repeat left center }

.s_contact p span { display: block; font-size: 16px; color: #000; line-height: 18px }

.s_contact p em { display: block; font-size: 26px; color: #000; line-height: 100%; font-weight: 700; margin-top: 5px }

.s_info { width: 848px; height: 108px; background:rgba(225, 96, 30, .9); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 24px 124px 0 104px }

.s_info .slogan { font-size: 18px; color: #fff; line-height: 100% }

.s_info .slogan em { display: block; font-size: 28px; color: #fff; line-height: 100%; font-weight: 700; margin-bottom: 9px }

.s_search { width: 298px }

.s_search .sea_inp { height: 30px; border-bottom: 1px solid #fff }

.s_search .sea_inp input { background: 0 0; border: 0; outline: 0 }

.s_search .sea_inp #keywords { width: 260px; float: left; color: #fff }

.s_search .sea_inp .sub { width: 38px; float: right; cursor: pointer; background: url(../images/s_btn.png) no-repeat right 3px }

.k_word { color: rgba(255, 255, 255, .5); font-size: 14px; line-height: 100%; white-space: nowrap; margin-top: 14px }

.k_word a { color: rgba(255, 255, 255, .5); padding-right: 8px }



.intro {height: 526px;}

.intro dd {  margin-top: 102px; padding-top: 64px; width: 695px; height: 269px; float: left }

.intro dd h2 a { display: block; font-size: 40px; color: #e1601e; line-height: 100%; padding-bottom: 16px; margin-bottom: 36px; position: relative }

.intro dd h2 a:before { position: absolute; content: ""; width: 83px; height: 1px; background: #626262; left: 0; bottom: 0 }

.intro dd h2 a span { display: block; font-size: 26px; color: #e1601e; line-height: 100%; margin-bottom: 8px; font-weight: 400 }

.intro dd p { font-size: 16px; color: #333; line-height: 30px }

.intro dt { width: 444px; height: 444px; margin-top: 39px; border: 1px dashed rgba(83, 83, 83, .4); float: right; border-radius: 50%; position: relative }

.intro dt img { width: 422px; height: 422px; border-radius: 50%; position: absolute; top: 14px; left: 26px }





.sm_banner { height: 374px; background: url(../images/sm_bg.jpg) no-repeat center top }

.sm_banner h2 { margin-top: 72px; width: 412px; float: left }

.sm_banner .sm_con { width: 586px; float: right; margin-top: 94px }

.sm_banner .sm_con h3 { height: 59px; border-top: 2px solid #fff; border-bottom: 2px solid #fff; text-align: center; font-size: 34px; color: #fff; line-height: 59px; background: url(../images/sm_tbg.png) no-repeat center }

.sm_banner .sm_con p { font-size: 18px; color: rgba(255, 255, 255, .7); line-height: 100%; margin: 12px 0 41px; white-space: nowrap }

.sm_banner .sm_con .more a { display: block; width: 282px; height: 55px; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #F7B406; border-radius: 28px; font-size: 18px; color: #333; line-height: 55px; text-align: center }

.sm_banner .sm_con .more a:last-child { float: right; background: rgba(255, 255, 255, .25); border: 1px solid rgba(255, 255, 255, .5); font-size: 18px; color: #fff; line-height: 53px }

.sm_banner .sm_con a:hover { font-weight: 700 }



.case { background: url(../images/case_bg.jpg) no-repeat center top; padding-top: 30px; height: 797px }

.case h2 { padding-top: 35px;margin-bottom: 39px }

.case h2 a, .case h2 span { color: #fff }

.case h2 a:hover { color: #fff }

.case_con { position: relative; margin-bottom: 41px }

.case_con .tempWrap { width: 1200px !important; overflow: hidden }

.case_con dl { width: 362px; height: 441px; background: #fff; padding: 11px; margin-right: 24px }

.case_con dl dt { width:100%;  }

.case_con dl dt img { max-width: 100%; }

.case_con dl dd { padding: 20px 26px 0 }

.case_con dl dd h4 { font-size: 20px; color: #333; line-height: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400 }

.case_con dl dd p { font-size: 14px; color: #666; line-height: 24px; margin: 22px 0 36px }

.case_con dl dd span { display: block; text-align: right; padding-right: 25px; background: url(../images/ci.png) no-repeat right center; font-size: 16px; color: #e1601e; line-height: 100% }

.switch div { position: absolute; width: 69px; height: 69px; opacity: .4; -o-transition: all .3s ease; transition: all .3s ease; top: 197px; cursor: pointer }

.switch .prev { left: -119px }

.switch .next { right: -119px }

.switch div:hover { opacity: .8 }

.info a { display: block; width: 283px; height: 55px; background: #e1601e url(../images/more.png) no-repeat 170px center; border-radius: 28px; margin: 0 auto; text-indent: 87px; font-size: 18px; color: #fff; line-height: 55px; -o-transition: all .3s ease; transition: all .3s ease }

.info a:hover { background-position-x: 300px; text-indent: 0; text-align: center }



.news { padding-top: 36px; }

.news h2 a {margin-bottom: 44px }

.news h2 a, .news h2 span { color: #333; }

.news h3 a { display: block; font-size: 24px; color: #333; line-height: 100%; font-weight: 400; position: relative; padding-bottom: 17px }

.news h3 a:before { position: absolute; content: ""; width: 10px; height: 24px; background: #e1601e; left: -28px; top: 0 }

.news h3 a span { float: right; font-size: 12px; text-transform: uppercase; line-height: 100%; margin-top: 12px }

.brand { width: 379px; height: 493px; background: #fbf5ed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 38px 26px 0 28px ;}

.brand dt { width: 325px; height: 183px; overflow: hidden }

.brand dt img { max-width:100%; height: 183px; }

.brand dd { padding: 28px 8px 0 }

.brand dd h4 { font-size: 18px; color: #333; line-height: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 400 }

.brand dd h4 span { display: block; font-size: 12px; color: #333; line-height: 100%; margin-top: 7px }

.brand dd p { font-size: 14px; color: #999; line-height: 24px; margin: 16px 0 29px }

.brand dd i { display: block; font-size: 14px; color: #e1601e; line-height: 100%; padding-right: 27px; background: url(../images/ci.png) no-repeat right center; text-align: right }

.brand dl:hover h4 { color: #e1601e }

.news_con { width: 807px; height: 493px; background: #fbf5ed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 38px 31px 0 32px }

.news_con h3 a { border-bottom: 1px solid rgba(98, 98, 98, .25) }

.news_con h3 a:before { left: -32px }

.news_con .tl li { padding: 21px 0 36px 8px; float: left; width: 336px }

.news_con .tl li h4 { font-size: 18px; color: #0e0b0a; line-height: 100%; font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 19px }

.news_con .tl li p { font-size: 14px; color: #999; line-height: 24px }

.news_con .tl li:first-child { margin-right: 46px }

.news_con .tl li:hover h4 { color: #e1601e }

.news_con .jc li { width: 239px; height: 147px; overflow: hidden; position: relative; float: left; margin-right: 13px; margin-top: 16px }

.news_con .jc li img { width: 239px; height: 147px }

.news_con .jc li h4 { position: absolute; width: 239px; height: 34px; background: rgba(0, 0, 0, .6); text-align: center; font-size: 14px; color: #fff; line-height: 18px; font-weight: 400; left: 0; bottom: 0; padding: 5px 28px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }

.news_con .jc li:last-child { margin-right: 0 }



.about { padding-top: 33px }



.about_con { width:90%; text-align: center; margin: 34px auto 25px; font-size: 14px; color: #333; line-height: 24px }

.about .info a { width: 218px; height: 50px; background: #e1601e url(../images/more.png) no-repeat 138px center; border-radius: 25px; text-indent: 55px; font-size: 18px; color: #fff; line-height: 50px }

.about .info a:hover { background-position-x: 260px }

.about .pic { border: 5px solid #fff; width: 1190px; height: 430px; margin-top: 42px }

.about .pic img { width: 1190px; height: 430px }



.links { height: 68px; overflow: hidden;background: #333; font-size: 0; clear: both }

.links em { display: inline-block; font-style: normal; color: rgba(255, 255, 255, .5); font-size: 14px; line-height: 100%; font-weight: 700; line-height: 68px }

.links a { font-size: 14px; color: rgba(255, 255, 255, .5); line-height: 100%; display: inline-block; line-height: 68px; padding-left: 39px; transition: .3s ease; -o-transition: .3s ease }

.links a:hover { color: rgba(255, 255, 255, .8) }



@-webkit-keyframes fadeInLeft1 {

  from { opacity: 0; -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

@keyframes fadeInLeft1 {

  from { opacity: 0; -webkit-transform: translate3d(-10%, 0, 0); transform: translate3d(-10%, 0, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

.fadeInLeft1 { -webkit-animation-name: fadeInLeft1; animation-name: fadeInLeft1 }

@-webkit-keyframes fadeInRight1 {

  from { opacity: 0; -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

@keyframes fadeInRight1 {

  from { opacity: 0; -webkit-transform: translate3d(10%, 0, 0); transform: translate3d(10%, 0, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

.fadeInRight1 { -webkit-animation-name: fadeInRight1; animation-name: fadeInRight1 }

@-webkit-keyframes zoomLeft {

  from { opacity: 0; -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3) }

  50% { opacity: 1 }

}

@keyframes zoomLeft {

  from { opacity: 0; -webkit-transform: scale3d(0.3, .3, .3); transform: scale3d(0.3, .3, .3) }

  50% { opacity: 1 }

}

.zoomLeft { -webkit-animation-name: zoomLeft; animation-name: zoomLeft; transform-origin: 0 50%; -webkit-transform-origin: 0 50% }

.zoomRight { -webkit-animation-name: zoomLeft; animation-name: zoomLeft; transform-origin: 100% 50%; -webkit-transform-origin: 100% 50% }

@-webkit-keyframes fadeInUp1 {

  from { opacity: 0; -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

@keyframes fadeInUp1 {

  from { opacity: 0; -webkit-transform: translate3d(0, 10%, 0); transform: translate3d(0, 10%, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

.fadeInUp1 { -webkit-animation-name: fadeInUp1; animation-name: fadeInUp1 }

@-webkit-keyframes fadeInUp2 {

  from { opacity: 0; -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

@keyframes fadeInUp2 {

  from { opacity: 0; -webkit-transform: translate3d(0, 2%, 0); transform: translate3d(0, 2%, 0) }

  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }

}

.fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2 }

@keyframes myfirst {

  0% { left: 0; top: 0 }

  25% { left: 0; top: 10px }

  50% { left: 0; top: 0 }

  100% { left: 0; top: 0 }

}

@-moz-keyframes myfirst {

  0% { left: 0; top: 0 }

  25% { left: 0; top: 10px }

  50% { left: 0; top: 0 }

  100% { left: 0; top: 0 }

}

@-webkit-keyframes myfirst {

  0% { left: 0; top: 0 }

  25% { left: 0; top: 10px }

  50% { left: 0; top: 0 }

  100% { left: 0; top: 0 }

}

@-o-keyframes myfirst {

  0% { left: 0; top: 0 }

  25% { left: 0; top: 10px }

  50% { left: 0; top: 0 }

  100% { left: 0; top: 0 }

}

