.container1 .top { height:520px; } .container1 .top img{ width:100%;height:520px; } .container1 .bottom{ background-color: #4A90E2;height:217px;display:flex;flex-direction: row; } .container1 .bottom>div{ width:50%; } .container1 .bottom .right{ display:flex;flex-direction: row;padding-top:35px; } .container1 .bottom .right .item{ width:222px;height:73px;background-color:#fff;display: flex;justify-content: center;align-items: center; flex-direction: column;margin-right:23px;transition: all 400ms; } .container1 .bottom .right .item .en{ font-size:14px;font-family:DINCondensed-Bold,DINCondensed,Microsoft Yahei;font-weight:bold;color: #6C4C2F;line-height:22px; } .container1 .bottom .right .item .cn{ font-size:16px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;font-weight:600;color:#4A4A4A;line-height:22px; } .container1 .bottom .right .item:hover{ cursor: pointer;background-color: #FAB747;transition: all 400ms; } .container1 .bottom .left{ display:flex;flex-direction: row;padding-top:23px;padding-left:123px; } .container1 .bottom .left>div{ width:100px;margin-right:10px;text-align: center; } .container1 .bottom .left img{ width:86px; height:86px; } .container1 .bottom .left div .title{ color:#fff;font-size:12px;font-family:PingFangSC-Semibold,PingFang SC,Microsoft Yahei;margin-top:8px; } .container1 .bottom .left .text{ vertical-align: bottom;height:86px;padding-top:60px; } .container1 .bottom .left .text div{ color:#fff;font-size:10px;font-family:PingFangSC-Medium,PingFang SC,Microsoft Yahei;font-weight:500; } .container1 .bottom .left .text div:first-child{ font-size:12px;margin-bottom:6px; } .container_jobs{ display:flex;flex-direction: row;margin-top:32px; } .container_jobs .left{ width:318px; } .container_jobs .left .intro{ width:318px;height:664px;padding:67px 52px 0 52px;box-sizing: border-box;background-color: #4A90E2; } .container_jobs .left .intro div{ text-align:center;color:#fff;text-align:center; } .container_jobs .left .intro .title { font-size:12px;font-family:PingFangSC-Medium,PingFang SC;font-weight:500;color:rgba(255,255,255,1); line-height:17px; } .container_jobs .left .intro .tip { font-size:10px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:rgba(255,255,255,1); line-height:22px; } .container_jobs .left .intro .icon{ margin-top:10px; } .container_jobs .left .intro .content,.container_jobs .left .intro .content1 { font-size:12px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:rgba(244,244,244,1); line-height:22px;text-align: left; text-align:justify; } .container_jobs .left .intro .content{ margin-top:60px; } .container_jobs .left .intro .content1{ margin-top:30px; } .container_jobs .right{ width:842px;background-color: #F4F4F4;padding:25px 23px 25px 23px; } .container_jobs .right .item{ background-color:#fff;border:1px solid rgba(207,203,203,1);margin-bottom:11px; height:112px;overflow:hidden;position:relative;padding:20px 30px;box-sizing: border-box; color:#9B9B9B;font-size:12px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400; } .container_jobs .right .item .title{ font-size:16px;font-family:PingFangSC-Medium,PingFang SC,Microsoft Yahei;font-weight:500;color:#777; } .container_jobs .right .item .addr{ background-image: url("../img/jobs/icon_addr.png");background-repeat: no-repeat; background-position: left center;background-size: 11px 16px;padding-left:16px; height:16px;line-height:16px;margin-top:20px; } .container_jobs .right .item .time{ background-image: url("../img/jobs/icon_time.png");background-repeat: no-repeat; background-position: left center;background-size: 13px 13px;padding-left:16px; height:16px;line-height:16px;margin-top:6px; } .container_jobs .right .item .title_req{ font-size:16px;font-family:PingFangSC-Medium,PingFang SC,Microsoft Yahei;font-weight:500;color:#777; margin-top:24px; } .container_jobs .right .item .content_req{ margin-top:10px;line-height:22px; } .container_jobs .right .item.active{ box-shadow:0px 0px 8px 1px rgba(149,129,129,0.5);height:247px; } .container_jobs .right .item .opt{ display: flex;flex-direction:column;justify-content: center;align-items: center; height:112px;position:absolute;right:0;top:0;width:112px; cursor: pointer; } .container_jobs .right .item .opt_detail img{ width:34px;height:30px; } .container_jobs .right .item .opt_strink img{ width:34px;height:34px; } .container_jobs .right .item .opt .text{ font-size:12px;font-family:PingFangSC-Regular,PingFang SC,Microsoft Yahei;font-weight:400;margin-top:6px; color: #777777; } .container_jobs .right .item.active .opt .text{ color:#fff; } .container_jobs .right .item .opt_detail{ display:flex;border-left:1px solid #CFCBCB;border-bottom:1px solid #CFCBCB;transition: all 400ms; } .container_jobs .right .item.active .opt_detail{ display:none;transition: all 400ms; } .container_jobs .right .item .opt_strink{ display:none;transition: all 400ms; } .container_jobs .right .item.active .opt_strink{ display:flex;background-color:#6d0ff2;transition: all 400ms; }