/* -------------------------------- Primary style -------------------------------- */ *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font-size: 100%; font-family: "Roboto", sans-serif; color: #4d4d4d; background-color: white; } body, html { /* important */ height: 100%; } a { color: #4d4d4d; text-decoration: none; } /* -------------------------------- Modules - reusable parts of our design -------------------------------- */ .cd-container { /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */ width: 90%; max-width: 900px; /* margin: 0 auto; */ margin: 0 auto; font-size: 15px; } .cd-container::after { /* clearfix */ content: ""; display: table; clear: both; } .cd-container h2, .cd-container h3 { max-height: 50px; font-size: 1.5em; border-bottom: 1px #ccc solid; display: inline-block; width: 100%; margin: 1em 0 0 0; } .cd-container h3 { border: none; font-size: 1.2em; } .cd-container h4 a { font-size: 1.2em; font-color: #ff3b3f; display: inline-block; width: 100%; } .cd-container ul { margin: 1em auto 0; } /* 企业数字 */ .csdn-digitalinfo { float: left; margin: 24px 0; width: 50%; text-align: center; padding: 0 24px; min-height: 80px; } .csdn-digitalinfo .title { font-size: 18px; line-height: 24px; } .csdn-digitalinfo .content { font-size: 14px; line-height: 22px; min-height: 70px; } /* 企业数字 */ .digitalinfo2-container { display: flex; justify-content: space-between; flex-wrap: wrap; } .csdn-digitalinfo2 { /* float: left; */ margin: 24px 0; width: 50%; text-align: center; padding: 0 24px; min-height: 80px; } .csdn-digitalinfo2 .title { font-size: 18px; line-height: 24px; } .csdn-digitalinfo2 .content { font-size: 14px; line-height: 22px; min-height: 70px; } /* 新媒体矩阵 */ .newmedia { float: left; width: 95px; margin: 0 5px 0 0; text-align: center; height: 142px; } .newmedia .content { line-height: 20px; } .newmedia .QR { background: #fff; } .newmedia img { width: 95px; height: 95px; } @media only screen and (min-width: 768px) { .csdn-digitalinfo { width: 20%; padding: 0 8px; min-height: 45px; } .csdn-digitalinfo .title { font-size: 24px; line-height: 30px; } .csdn-digitalinfo .content { font-size: 14px; line-height: 24px; } .csdn-digitalinfo2 { width: 12%; padding: 0 0px; min-height: 45px; } .csdn-digitalinfo2 .title { font-size: 24px; line-height: 30px; } .csdn-digitalinfo2 .content { font-size: 14px; line-height: 24px; } } /* .cd-container a{ font-weight: 400; } */ .cd-container a:hover { color: #fc5531; } h1, h2, h3 { font-weight: 400 !important; } /* -------------------------------- Main components -------------------------------- */ .cd-header { position: fixed; top: 0; left: 0; width: 100%; height: 40px; background: #223544; padding: 0 16px; /* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); */ z-index: 2; } .cd-header:after { content: ""; display: table; clear: both; } .cd-header #cd-logo { float: left; display: flex; height: 100%; align-items: center; margin-right: 40px; } .cd-header #cd-logo img { display: block; height: 24px; } .csdnchart { width: 100%; /* text-align: center; */ margin: 24px 0 0 0; background-repeat: no-repeat; background-size: 100%; } .CSDN-chart01 { background-image: url(../img/meeting@2x.png); background-position: center 80%; } .CSDN-chart01 span { font-size: 12px; text-align: center; width: 100%; margin: 30% 0 0 0; display: inline-block; } .container-nav .menu { padding: 4px; box-sizing: border-box; overflow: hidden; height: 100%; } .container-nav .menu li { float: left; font-size: 14px; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; min-width: 88px; padding: 0 8px; box-sizing: border-box; text-align: center; height: 100%; border-radius: 4px; cursor: pointer; } .partner { display: flex; justify-content: flex-start; flex-wrap: wrap; margin-left: -20px; } .partner span { margin-left: 20px; } @media screen and (max-width: 768px){ .m-d-none { display: none !important; } .container-nav .menu li { min-width: unset; } .cd-header #cd-logo { margin-right: 6px; } } .container-nav .menu .input_box { width: 200px; height: 100%; border-radius: 4px; overflow: hidden; } .container-nav .menu input { padding: 0 0 0 10px; width: 100%; outline: none; border: none; height: 100%; color: #fff; background: rgba(209, 209, 240, 0.2); } .container-nav .menu input::placeholder { color: rgba(209, 209, 240, 0.8); } .container-nav .menu input:focus { background: #fff; color: #606266; } .container-nav .menu li:hover { background-color: rgba(209, 209, 240, 0.2); } .container-nav .menu li a { color: #fff; width: 100%; height: 100%; line-height: 32px; } @media only screen and (min-width: 375px) { .CSDN-chart01 span { margin: 24% 0 0 0; } .medias .newmedia { width: 45% !important; height: 192px; } } @media only screen and (min-width: 768px) { /* .cd-header { height: 60px; } */ /* .cd-header #cd-logo { margin: 14px 0 0 0px; } .CSDN-chart01 span{ margin: 18% 0 0 0; } */ } .cd-main-nav { float: right; width: 44px; margin-right: 18px; height: 100%; background: url("../img/cd-icon-menu.svg") no-repeat center center; background-size: 44px 44px; cursor: pointer; } .cd-main-nav ul { position: absolute; top: 0; left: 0; width: 100%; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); } .cd-main-nav ul.is-visible { -webkit-transform: translateY(50px); -moz-transform: translateY(50px); -ms-transform: translateY(50px); -o-transform: translateY(50px); transform: translateY(50px); } .cd-main-nav a { display: block; height: 50px; line-height: 50px; padding-left: 5%; background: #2f292a; border-top: 1px solid #453c3d; color: #8e7d7f; } @media only screen and (min-width: 768px) { .cd-main-nav { width: auto; height: auto; background: none; cursor: auto; } .cd-main-nav ul { position: static; width: auto; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); line-height: 60px; } .cd-main-nav ul.is-visible { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); } .cd-main-nav li { display: inline-block; /* margin-left: 0.1em; */ } .cd-main-nav a { display: inline-block; height: auto; line-height: normal; background: transparent; padding: 0.3em 0.7em; border-top: none; color: #4d4d4d; text-transform: uppercase; /* font-size: 14px; */ font-size: 0.875rem; } .no-touch .cd-main-nav a:hover { color: #1c1d30; font-weight: 500; } } .cd-main-content { /* you need to assign a min-height to the main content so that the children can inherit it*/ height: 100%; position: relative; z-index: 1; margin-top: 40px; } /* 这里定义图片上的文字样式 */ .picinfo { max-width: 900px; margin: 0 auto; font-size: 30px; font-size: 1.875rem; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); color: white; padding: 40px 20px; box-sizing: border-box; } /* 图片文字简介 */ .picinfo span { display: inline-block; line-height: 24px; padding: 10px 0 0 0; margin: 10px 0 0 0; font-size: 16px; border-top: 0.5px #ccc solid; } .cd-fixed-bg { position: relative; min-height: 40%; background-size: cover; background-repeat: no-repeat; background-position: center center; z-index: 1; } .cd-footer-bg { position: relative; height: 500px; background-size: cover; background-repeat: no-repeat; background-position: center center; z-index: 1; } /* .cd-fixed-bg h1, .cd-fixed-bg h2 { position: absolute; left: 10%; top: 75%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 90%; max-width: 1170px; text-align: center; font-size: 30px; font-size: 1.875rem; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); color: white; } */ .cd-fixed-bg.cd-bg-1 { background-image: url("../img/cd-background-1-new.jpg"); } .cd-fixed-bg.cd-bg-2 { background-image: url("../img/cd-background-2.jpg"); } .cd-fixed-bg.cd-bg-3 { background-image: url("../img/cd-background-3.jpg"); } .cd-fixed-bg.cd-bg-4 { background-image: url("../img/cd-background-4.jpg"); } .cd-fixed-bg.cd-bg-5 { background-image: url("../img/cd-background-5.jpg"); } .cd-fixed-bg.cd-bg-6 { background-image: url("../img/cd-background-6.jpg"); } .cd-footer-bg.cd-bg-7 { background-image: url("../img/cd-background-7.jpg"); } @media only screen and (min-width: 768px) { .cd-fixed-bg h1, .cd-fixed-bg h2 { font-size: 36px; } .recruit li { width: 20% !important; } .newmedia { width: 15% !important; } .recruit { justify-content: flex-start !important; } } @media only screen and (min-width: 1170px) { .cd-fixed-bg { background-attachment: fixed; background-attachment: scroll\9; } .cd-fixed-bg h1, .cd-fixed-bg h2 { font-size: 48px; font-weight: 300; } } .cd-scrolling-bg { position: relative; /* min-height: 100%; */ padding: 1em 0; line-height: 1.6; /*box-shadow: 0 0 50px rgba(0, 0, 0, 0.5);*/ z-index: 2; } .cd-scrolling-bg.cd-color-1 { color: #4d4d4d; } .cd-scrolling-bg.cd-color-2 { background-color: #fff; color: #4d4d4d; } .cd-scrolling-bg.cd-color-3 { color: #3d3536; } @media only screen and (min-width: 768px) { .cd-scrolling-bg { padding: 1em 0; font-size: 20px; font-size: 1.25rem; line-height: 2; font-weight: 300; } } .recruit { width: 90%; margin-left: 20px; } .recruit-index { width: auto; } .recruit li { text-align: center; margin: 25px 0 0; height: 185px; float: left; width: 50%; } .recruit a { display: block; width: 120px; height: 120px; border-radius: 100%; background: #0e5791; font-family: Arial-Black; font-size: 26px; color: #ffffff; text-align: center; line-height: 120px; margin: 0 auto; } /*.recruit a:hover{ color: #fff; text-decoration: underline; } .recruit a[attr^="bianji"]{ background:#B966FF; } .recruit a[attr^="suanfa"]{ background:#ED8400; } .recruit a[attr^="yunying"]{ background:#4283CE ; } .recruit a[attr^="shichang"]{ background:#81C9D0 ; } .recruit a[attr^="jizhe"]{ background:#DF6DBC ; } .recruit a[attr^="qudao"]{ background:#60BD8F ; } .recruit a[attr^="xiangmu"]{ background:#D9A666 ; } .recruit a[attr^="guwen"]{ background:#B2BF64 ; } .recruit a[attr^="qianduan"]{ background:#D1C080 ; } .recruit a[attr^="jiaohu"]{ background:#4D862C ; }*/ .job-n { max-width: 120px; margin: 5px auto 0; text-align: center; } .newmedias { width: 90%; max-width: 800px; overflow: hidden; margin: 2em auto 0; } .programmer p { margin-top: 1em; } .mod-b { height: 160px; position: relative; margin-top: 24px; display: flex; } .mob-ctt { position: relative; float: right; width: 720px; margin: 0 16px 0; } .mob-ctt span { font-size: 10px; color: red; } .mod-b .mod-thumb { height:120px; } .mod-thumb img { height:120px; width: 216px; border-radius: 8px; } .online-application { width: 158px; height: 24px; border-radius: 2px; border: 1px solid rgba(224, 224, 224, 1); font-size: 14px; color: rgba(51, 153, 234, 1); line-height: 20px; padding: 2px 8px; margin-left: 10px; } .chart-1 { display: block; width: 100%; max-width: 800px; margin: 2em auto 0; } /*job*/ .job-title { width: 100%; background: url(../img/php.png) no-repeat center center; height: 240px; margin-top: 60px; background-size: cover; } .job-title h2 { font-size: 24px; color: #ffffff; line-height: 24px; text-align: center; padding-top: 70px; } .job-recruit { display: flex; width: 100%; margin-left: 0; flex-wrap: wrap; } .job-recruit-hot { width: 100%; height: 406px; overflow: hidden; margin-left: 0; } .job-recruit p { margin-top: 10px; } .job-recruit a, .job-recruit-hot a { margin: 0; display: inline-block; background: none; line-height: inherit; width: auto; height: auto; text-align: left; font-size: 24px; color: #2d2d2d; } .job-recruit-hot a { font-size: 16px; color: #3d3d3d; line-height: 25px; } .job-recruit a:hover { color: #2d2d2d; text-decoration: none; } .job-contain h2 { font-size: 18px; color: #2e2e2e; line-height: 25px; font-weight: 500; margin: 0 0 16px; } .job-contain .job_name_area { margin: 0; overflow: hidden; } .job-contain .job_name_area img { vertical-align: middle; margin-right: 16px; float: left; width: 48px; height: 48px; border-radius: 4px; border: none; } .job-contain h2.job-name-dec { float: left; width: calc(100% - 72px); margin-top: 3px; font-size: 24px; color: #2d2d2d; margin-bottom: 6px; } .job-contain .job_name_area span { display: inline-block; margin-top: 3px; margin-bottom: 30px; color: #6b6b6b; font-size: 12px; } .job-contain h2.gwzz { background: url("../img/icon_gw-new.png") no-repeat left center; padding-left: 27px; background-size: 20px; } .job-contain h2.rzyq { background: url("../img/icon_rz-new.png") no-repeat left center; padding-left: 27px; background-size: 20px; } .job-contain h2.jfx { background: url("../img/icon_jf-new.png") no-repeat left center; padding-left: 27px; background-size: 20px; } .job-contain h2.tgzl { background: url("../img/icon_tg.png") no-repeat left center; padding-left: 27px; background-size: 20px; } .job-contain h2.lxfs { background: url("../img/icon_lx-new.png") no-repeat left center; padding-left: 27px; background-size: 20px; } .jobs_other h2.qtzw { font-size: 18px; color: #2d2d2d; line-height: 25px; font-weight: 500; margin-bottom: 20px; } .job-contain li, .job-contain p { color: #909090; line-height: 30px; font-size: 14px; font-weight: 400; } .job-recruit li, .job-recruit-hot li { text-align: left; width: 100% !important; float: none; height: auto; margin: 0; } .job-recruit-hot li { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #e0e0e0; } .job-recruit p.jobs_area_dec, .job-recruit-hot p.jobs_area_dec, .recruit-index p.jobs_area_dec { margin: 3px 0 0; color: #6b6b6b; font-size: 12px; } .job-recruit p.job-d { margin: 18px 0 0; color: #4d4d4d; font-size: 14px; line-height: 25px; display: none; } .job-recruit li, .recruit-index li { padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #e0e0e0; } .recruit-index li { overflow: hidden; } .job-recruit li img, .recruit-index li img { margin-right: 12px; float: left; width: 48px; height: 48px; } .jobs_right { float: left; width: calc(100% - 60px); height: auto; } .job-recruit { height: 515px; overflow: hidden; } .btn_box { text-align: center; margin-top: 32px; } .btn_box a { display: block; font-size: 24px; color: #1c1d30; line-height: 33px; } .send-resume { display: block; width: 120px; height: 40px; background: #fc5531; border-radius: 20px; font-size: 14px; color: #ffffff; text-align: center; line-height: 40px; margin: 20px auto 0; } .container-nav, .container, .footer-logo { width: 100%; max-width: 900px; margin: 0 auto; overflow: hidden; height: 100%; } .jobs_dec, .jobs_other { background-color: #fff; } .jobs_other { margin-top: 8px; } .job-describe .container { max-width: 1180px; padding: 15px 20px; } .container-nav { max-width: 1200px; } .footer-img { display: block; width: 192px; margin: 23px auto 0; } .job-contain ol { list-style: decimal inside; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #e0e0e0; } .medias .newmedia { width: 162px; height: 192px; } .medias .newmedia img { width: 100%; max-width: 162px; height: 100%; max-height: 155px; } .persion_article { width: 300px; margin: 0 auto 0; } .hot_jobs { display: none; } .hot_jobs h3 { margin-bottom: 16px; padding-bottom: 32px; border-bottom: 1px solid #e0e0e0; color: #2e2e2e; font-size: 18px; } @media only screen and (min-width: 768px) { .medias .newmedia { width: 22% !important; } .persion_article { float: right; margin-top: 7px; margin-right: 20px; } .footer-img { display: inline; margin: 213px 0 0 85px; } .job-title h2 { font-size: 36px; padding-top: 50px; line-height: 50px; } .job-contain .job_name_area span { margin-bottom: 44px; } .job-describe .jobs_dec, .job-describe .jobs_other { padding: 40px; background-color: #fff; margin-top: -60px; border-radius: 4px; } .job-describe .jobs_other { margin-top: 16px; } .job-contain { float: left; width: calc(100% - 308px); } .hot_jobs { display: block; float: left; width: 250px; margin-left: 58px; } .job-contain ol { margin-left: 72px; margin-bottom: 32px; padding-bottom: 32px; } .job-contain li { line-height: 25px; font-size: 16px; } .job-contain p { margin-left: 72px; line-height: 25px; font-size: 16px; } /* .job-contain p span{margin-right: 80px} */ .job-contain h2.gwzz, .job-contain h2.rzyq, .job-contain h2.jfx, .job-contain h2.tgzl, .job-contain h2.lxfs, .job-contain h2.qtzw { margin-left: 45px; } .send-resume { margin-left: 72px; } .jobs_other h2.qtzw { margin-bottom: 40px; } .send-resume { font-size: 18px; margin: 32px 0 0px 72px; } .job-recruit p.job-d { display: block; } .job-recruit li img, .job-contain .job_name_area img { width: 56px; height: 56px; margin-right: 16px; } .jobs_right { width: calc(100% - 72px); padding-bottom: 32px; margin-bottom: 32px; height: auto; border-bottom: 1px solid #e0e0e0; } .job-recruit li, .recruit-index li { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .recruit-index { overflow: hidden; } .recruit-index li { float: left; width: 33.33%; } .recruit-index li:nth-last-child(1) .jobs_right, .recruit-index li:nth-last-child(2) .jobs_right, .recruit-index li:nth-last-child(3) .jobs_right, .recruit-index li:nth-last-child(4) .jobs_right { border-bottom: none; } .recruit-index .jobs_right { padding-bottom: 16px; margin-bottom: 16px; } } @media only screen and (min-width: 992px) { .recruit-index li { width: 25%; } } .layer-img { float: right; margin-top: 15px; } .layer-p { font-size: 1.5em; } .job-recruit .job-n, .job-recruit-hot .job-n, .recruit-index .job-n { margin: 3px 0 0; text-align: left; max-width: inherit; line-height: 33px; } .recruit-index .job-n { line-height: 22px; margin-top: 0; } .job-recruit .job-n { font-size: 18px; font-weight: 600; } .cd-fixed-bg h1, .cd-fixed-bg h2 { /* padding-top: 168px; */ } .csdn-pub-footer { padding: 24px 0 0; }