.banner { min-width: 1230px; height: 500px; text-align: center; color: #fff; overflow: hidden; text-shadow: 0px 1px 2px 0pxrgba 0, 0, 0, 0.15; background: #3a6dff url(../image/banner_bg1.png) no-repeat center center; }
.banner-title { font-size: 50px; letter-spacing: 3px; margin-top: 130px; }
.banner-subtitle { font-size: 26px; }

.section { padding-top: 35px; padding-bottom: 35px; }
.section-title, .section-subtitle { text-align: center; }
.section-title { font-size: 36px; margin-bottom: 0.5em; color: #464646; }
.section-subtitle { font-size: 20px; color: #666; margin-bottom: 1em; }
.section-content .desc { color: #666; text-indent: 2em; }
.section-content .jobs { position: relative; padding-top: 63px; padding-bottom: 145px; z-index: 1; }
.section-content .jobs .bg:before, .section-content .jobs .bg:after { content: ''; position: absolute; }
.section-content .jobs .bg:before { top: 20px; left: 78px; z-index: -1; width: 1044px; height: 394px; background: #ebf0fc; background: rgba(58, 109, 225, 0.1); border-radius: 3px; }
.section-content .jobs .bg:after { bottom: 29px; left: 50%; z-index: -1; width: 1467px; height: 168px; margin-left: -733px; background: url(../image/TIANXINGKE1.png) no-repeat center center; }
.section-content .jobs dl { float: left; width: 224px; height: 304px; padding-top: 30px; text-align: center; background-color: #ffffff; box-shadow: 0px 3px 7px 0px rgba(22, 69, 204, 0.35); border-radius: 3px; -moz-transition: box-shadow 0.3s ease-out; -o-transition: box-shadow 0.3s ease-out; -webkit-transition: box-shadow 0.3s ease-out; transition: box-shadow 0.3s ease-out; }
.section-content .jobs dl + dl { margin-left: 20px; }
.section-content .jobs dl:hover { box-shadow: 0px 3px 15px 0px rgba(22, 69, 204, 0.45); }
.section-content .jobs dt { font-size: 26px; letter-spacing: 1px; margin-bottom: 0.5em; }
.section-content .jobs dt img { display: block; margin: 0 auto 10px; }
.section-content .jobs dd li + li { margin-top: 0.3em; }
.section-content .jobs dd a { font-size: 18px; color: #999; }
.section-content .jobs dd a:hover { color: #3a6dff; }
.section-content .team { margin-top: 20px; background-color: #f3f6ff; }
.section-content .team-content { margin-left: 595px; margin-right: 73px; overflow: hidden; }
.section-content .team-content-title { font-size: 36px; margin-top: 50px; margin-bottom: 1em; }
.section-content .team-content-subtitle { position: relative; font-size: 20px; color: #999; margin-bottom: 1.5em; padding-bottom: 0.5em; border-bottom: 1px solid #3a6dff; }
.section-content .team-content-subtitle:after { content: ''; position: absolute; left: 0; bottom: 0; width: 82px; height: 3px; background-color: #3a6dff; }
.section-content .team-content-desc { font-size: 20px; line-height: 1.8; color: #666; }

.company-head { position: relative; margin-bottom: 15px; padding-left: 120px; padding-bottom: 25px; font-size: 20px; border-bottom: 2px solid #e7e7e7; background: url(../image/floor.png) no-repeat left top; background: url(../image/floor.png) no-repeat left 20px top 5px; }
.company-head:after { content: ''; position: absolute; left: 0; bottom: 0; height: 3px; width: 82px; background: #e7e7e7; }
.company-head p { font-size: 26px; color: #3a6dff; }
.company-body > div { padding-left: 65px; line-height: 32px; font-size: 18px; }
.company-body > div + div { margin-top: 7px; }
.company-body .addr { background: url(../image/address.png) no-repeat left center; }
.company-body .tel { background: url(../image/telephone.png) no-repeat left center; }
.company-body .lab { position: relative; font-size: 20px; margin-right: 2em; }
.company-body .lab:after { content: '|'; margin-left: 2em; color: #b5b5b5; }
.company-body .val { color: #999; }

.welfare { margin-top: 50px; margin-bottom: 140px; }
.welfare-logo { width: 560px; height: 475px; background: url(../image/logo3.png) no-repeat center center; }
.welfare-item { position: relative; width: 320px; height: 145px; }
.welfare-item + li { margin-top: 20px; }
.welfare-item-inner { width: 320px; height: 145px; padding: 15px 30px 0; background-color: #fff; box-shadow: 1px 1px 7px 0px rgba(0, 0, 0, 0.21); border-radius: 8px; display: none; }
.welfare-item-index { position: absolute; top: 50%; z-index: 9; font-size: 20px; width: 50px; height: 50px; margin-top: -25px; text-align: center; line-height: 50px; color: #fff; background-color: #3a6dff; border-radius: 50%; display: none; }
.welfare-item-index.lft { left: -25px; }
.welfare-item-index.rgt { right: -25px; }
.welfare-item-title { font-size: 20px; margin-bottom: 0.2em; }
.welfare-item-desc { font-size: 18px; color: #999; text-indent: 2em; }
.welfare-item .line { position: absolute; display: none; background: url(../image/Line1.png) no-repeat; }
.welfare-item .line-straight { width: 166px; height: 2px; }
.welfare-item .line-poly { width: 199px; height: 72px; }
.welfare-item .line-1 { right: -196px; bottom: 0; background-image: url(../image/Line1.png); }
.welfare-item .line-2 { right: -166px; top: 69px; background-image: url(../image/Line2.png); }
.welfare-item .line-3 { right: -196px; top: 0; background-image: url(../image/Line3.png); }
.welfare-item .line-4 { left: -192px; bottom: 0; background-image: url(../image/Line4.png); }
.welfare-item .line-5 { left: -166px; top: 69px; background-image: url(../image/Line5.png); }
.welfare-item .line-6 { left: -192px; top: 0; background-image: url(../image/Line6.png); }
.welfare-item .dot { position: absolute; width: 14px; height: 14px; background: url(../image/dot.png) no-repeat; -moz-transform: scale(0); -ms-transform: scale(0); -webkit-transform: scale(0); transform: scale(0); }
.welfare-item .dot-4, .welfare-item .dot-5, .welfare-item .dot-6 { background-image: url(../image/dot2.png); }
.welfare-item .dot.on { -moz-animation: dot 0.5s forwards; -webkit-animation: dot 0.5s forwards; animation: dot 0.5s forwards; }
.welfare-item .dot-1 { right: -199px; bottom: -6px; }
.welfare-item .dot-2 { right: -173px; top: 63px; }
.welfare-item .dot-3 { right: -199px; top: -6px; }
.welfare-item .dot-4 { left: -199px; bottom: -6px; }
.welfare-item .dot-5 { left: -173px; top: 63px; }
.welfare-item .dot-6 { left: -199px; top: -6px; }

@keyframes dot { from { transform: scale(0); }
  to { transform: scale(1); } }
@keyframes line { from { transform: scale(0); }
  to { transform: scale(1); } }