.join-linian { background-image: url(../images/join-linian-bg.jpg); min-height: 937px; background-position: center; background-repeat: no-repeat; } .join-linian-header { padding: 80px 0px; } .join-linian-header h4 { font-size: 24px; text-align: center; line-height: 38px; width: 680px; margin: 0px auto 20px auto; } .join-linian-header p { font-size: 15px; color: #CCCCCC; text-align: center; width: 850px; margin: 0px auto; line-height: 28px; } .join-linian-body { display: flex; align-items: center; justify-content: space-around; } .join-linian-body .col { min-height: 470px; background-color: #fff; border-radius: 10px; padding: 40px; margin-right: 50px; } .join-linian-body .col .iconfont { width: 95px; height: 95px; border-radius: 50%; color: #fff; font-size: 50px; } .join-linian-body .col .iconfont.icon-pinpaiguanli{ background: linear-gradient(149deg, #6BB2F5 0%, #145EDC 100%); } .join-linian-body .col .iconfont.icon-huangguan3{ background: linear-gradient(149deg, #EC956F 0%, #EE2626 100%); font-size: 43px; } .join-linian-body .col .iconfont.icon-swticonjiaoyu{ background: linear-gradient(149deg, #B0E9D4 0%, #12CE70 100%); } .join-linian-body .col h4 { font-size: 22px; margin-bottom: 40px; margin-top: 40px; } .join-linian-body .col p { font-size: 16px; text-align: center; line-height: 32px; } .join-fengcai{ display: flex; flex-flow: wrap; } .join-fengcai .col { width: 31%; float: left; margin-right: 3%; overflow: hidden; border: 1px solid #e5e5e5; margin-bottom: 50px; } .join-fengcai .col .thum{ position: relative; overflow: hidden; } .join-fengcai .col:nth-child(3n) { margin-right: 0%; } .join-fengcai .col .pic { background: center center no-repeat; background-size: cover; -webkit-transition: all .5s; } .join-fengcai .col a:hover .pic{ -webkit-transform: scale(1.05); } .join-fengcai .col img { display: block; width: 100%; max-width: 100%; } .join-fengcai .col h2 { font-size: 16px; margin: 15px; font-weight: normal; line-height: 26px; text-align: center; } .join-fengcai .col a { color: #333; } .job-youshi li { display: flex; flex-direction: column; justify-content: center; align-items: center; color: #333; font-size: 18px; line-height: 52px; } .job-youshi li .iconfont { font-size: 35px; color: #1252D4; } .job-lianxi { background-image: url(../images/job-lianxi-bg.jpg); min-height: 248px; background-repeat: no-repeat; margin: 50px 0px; } .job-lianxi ul{ min-height: 248px; } .job-lianxi li { display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; } .job-lianxi li .iconfont { width: 85px; height: 85px; border-radius: 50%; background: #fff; margin-bottom: 20px; text-align: center; line-height: 85px; font-size: 38px; color: #1252D4; } .job-lianxi li p { font-size: 16px; } .job-lianxi li p.t{ font-size: 22px; margin-bottom: 20px; font-weight: bold; } .job-zhiwei { margin: 50px 0px; } .job-zhiwei .item { margin-bottom: 20px; } .job-zhiwei .item .zhiwei-title { line-height: 75px; background: #E9F0FA; display: flex; justify-content: space-between; padding: 0px 20px; font-size: 18px; font-weight: 400; cursor: pointer; } .job-zhiwei .item .zhiwei-title .iconfont { font-size: 28px; -webkit-transition: all .5s; } .job-zhiwei .item.active .zhiwei-title .iconfont { -ms-transform:rotate(45deg); /* IE 9 */ -webkit-transform:rotate(45deg); /* Safari and Chrome */ transform:rotate(45deg); } .job-zhiwei .item .zhiwei-title:hover,.job-zhiwei .item.active .zhiwei-title { background: #1252D4; color: #fff; } .job-zhiwei .item .zhiwei-title:hover .iconfont { color: #fff; } .job-zhiwei .item .zhiwei-info { display: none; } .job-zhiwei .item.active .zhiwei-info { display: flex; flex-flow: wrap; } .job-zhiwei .item .zhiwei-info ol{ width: 45%; display: flex; align-items: flex-start; padding: 10px; margin-left: 30px; } .job-zhiwei .item .zhiwei-info ol dt { width: 100px; color: #333; font-size: 16px ; font-weight: bold; } .job-zhiwei .item .zhiwei-info ol dd { flex: 1; color: #999; } .job-zhiwei .item .zhiwei-info ol dd ol { display: flex; flex-direction: column; line-height: 28px; width: 100%; } .job-zhiwei .item .zhiwei-info ol dd ol li { margin-bottom: 10px; } @media screen and (max-width: 768px) { .join-linian { background-color: #ebeff1; background-image: url(../images/m-join-linian-bg.jpg); min-height: 937px; background-position: center bottom; background-repeat: no-repeat; background-size: 100%; } .join-linian-header { padding: 50px 0px; } .join-linian-header h4 { font-size: 20px; width: auto; margin: 0px auto 20px auto; } .join-linian-header p { width: auto; } .join-linian-body { flex-direction: column; } .join-linian-body .col { margin-right: 0px; margin-bottom: 30px; padding: 30px; } .join-fengcai .col { width: 100%; margin-right: 0%; } .job-youshi ul { white-space: nowrap; overflow-x: scroll; position: static; width: 100%; justify-content: flex-start; } .job-youshi ul li { margin-right: 20px; font-size: 16px; } .job-lianxi ul{ white-space: nowrap; overflow-x: scroll; position: static; width: 100%; padding: 20px; justify-content: flex-start; } .job-lianxi ul li { margin-right: 30px; } .job-zhiwei .item .zhiwei-info ol { width: 100%; margin-left: 10px; } }