.head { height: 5.6rem; background-repeat: no-repeat; background-size: cover; background-position: center center; } .head_d1 { width: 1200px; margin: 0 auto; padding-top: 1.35rem; padding-bottom: 1.3rem; } .head_p1 { font-size: 0.46rem; color: white; line-height: 1; margin-bottom: 0.17rem; letter-spacing: 1px; font-weight: 500; } .head_p2 { font-size: 0.2rem; color: white; line-height: 1; margin-bottom: 0.36rem; letter-spacing: 4px; text-indent: 4px; font-family: arial; } .head_p3 { font-size: 0.14rem; color: white; line-height: 0.3rem; } .head_d2 { display: flex; align-items: center; margin-top: 0.55rem; cursor: pointer; } .head_d2 img { width: 0.7rem; height: 0.7rem; object-fit: contain; display: block; margin-right: 0.16rem; } .head_d2 p { font-size: 0.22rem; color: white; border-bottom: 1px solid white; letter-spacing: 1px; } .common_width { width: 1200px; margin: 0 auto; height: 100%; } .clearfix:after { content: ""; display: block; clear: both; } .clearfix { zoom: 1; } .shuke .head_ad { height: 560px; background: #fff url(../../newImage/fcSet/shuke_bg.png) center no-repeat; background-size: cover; } .shuke .head_ad h1 { height: 228px; line-height: 48px; font-size: 48px; padding-top: 180px; margin: 0 0 36px; color: #fff; font-weight: normal; } .shuke .head_ad p { height: 16px; line-height: 16px; font-size: 16px; color: #fff; margin-bottom: 70px; } .shuke .head_ad .play { height: 70px; cursor: pointer; } .shuke .head_ad .play img { display: inline-block; float: left; } .shuke .head_ad .play span { height: 70px; line-height: 70px; display: inline-block; float: left; font-size: 24px; color: #fff; padding-left: 24px; } .shuke .context { background: #fff; padding: 100px 0; } .shuke .context .common_width { padding-right: 623px; background: url(../../newImage/fcSet/centext_bg.png) right center no-repeat; } .shuke .context .common_width p { line-height: 2; font-size: 16px; font-weight: 400; color: #333947; } .shuke .context .common_width dt { margin-top: 0.38rem; height: 14px; line-height: 14px; font-size: 14px; color: #333947; position: relative; padding-left: 15px; } .shuke .context .common_width dt::after { content: ''; width: 4px; height: 4px; border-radius: 50%; margin-top: -2px; position: absolute; top: 50%; left: 2px; background: #84879A; } .shuke .context .common_width dd { font-size: 14px; line-height: 32px; margin-top: 0.08rem; color: #84879A; padding-left: 15px; } .shuke .number { background: #F7FAFF; } .shuke .number h2 { text-align: center; line-height: 32px; font-size: 32px; font-weight: 500; color: #333947; padding-top: 100px; padding-bottom: 23px; position: relative; } .shuke .number h2::after { content: ''; width: 44px; height: 3px; margin-left: -22px; position: absolute; top: 152px; left: 50%; background: #366CFC; } .shuke .number .num_box { padding: 100px 0; display: flex; justify-content: space-between; } .shuke .number .num_box div { text-align: center; flex: 1; } .shuke .number .num_box div p { height: 58px; line-height: 58px; color: #366CFC; font-size: 18px; margin-bottom: 20px; } .shuke .number .num_box div p em { font-weight: bold; font-size: 55px; font-family: ArialHebrewScholar, "思源黑体 CN"; line-height: 58px; letter-spacing: 3px; font-style: normal; padding-right: 8px; vertical-align: top; } .shuke .number .num_box div p span { line-height: 76px; display: inline-block; vertical-align: top; } .shuke .number .num_box div > span { height: 18px; font-size: 18px; font-weight: 400; color: #333947; line-height: 18px; } .shuke .enterprise { background: #F7FAFF; } .shuke .enterprise h2 { text-align: center; line-height: 32px; font-size: 32px; font-weight: 500; color: #333947; padding-top: 100px; padding-bottom: 23px; position: relative; } .shuke .enterprise h2::after { content: ''; width: 44px; height: 3px; margin-left: -22px; position: absolute; top: 152px; left: 50%; background: #366CFC; } .shuke .enterprise .item_box { padding: 100px 0; display: flex; justify-content: space-evenly; } .shuke .enterprise .item_box div { width: 250px; text-align: center; } .shuke .enterprise .item_box div p { font-size: 16px; color: #333947; line-height: 16px; margin-top: 33px; } .shuke .enterprise .item_box div img { margin: 0 auto; display: block; } .shuke .enterprise .hot_jobTit { height: 280px; background: url(../../newImage/fcSet/hot_job1.png) no-repeat; background-position: center; display: flex; justify-content: center; position: relative; } .shuke .enterprise .hot_jobTit a { padding: 0 31px; background: #366CFC; color: #fff; font-size: 18px; height: 44px; line-height: 44px; border-radius: 44px; position: absolute; top: 50%; margin-top: -22px; box-shadow: 0 20px 35px 5px #afbfea; } .shuke .product { padding-bottom: 124px; } .shuke .product h2 { text-align: center; line-height: 32px; font-size: 32px; font-weight: 500; color: #333947; padding-top: 100px; padding-bottom: 23px; position: relative; } .shuke .product h2::after { content: ''; width: 44px; height: 3px; margin-left: -22px; position: absolute; top: 152px; left: 50%; background: #366CFC; } .shuke .product .introduction { padding-top: 100px; } .shuke .product .introduction .txt { float: left; width: 555px; min-height: 603px; } .shuke .product .introduction .txt > div { border-radius: 10px; border: 1px solid #EDEDED; background: transparent; padding: 32px; } .shuke .product .introduction .txt > div h5 { height: 18px; font-size: 18px; font-weight: 500; color: #333333; line-height: 18px; padding-left: 30px; background: url(../../newImage/fcSet/si1big.png) left center no-repeat; background-size: 18px; margin-bottom: 30px; } .shuke .product .introduction .txt > div p { height: 16px; font-size: 16px; color: #333947; line-height: 16px; padding-left: 17px; position: relative; margin-top: 25px; } .shuke .product .introduction .txt > div p::after { content: ''; width: 4px; height: 4px; display: block; position: absolute; top: 50%; left: 1px; background-color: #333333; margin-top: -2px; border-radius: 50%; } .shuke .product .introduction .txt > div span { font-size: 14px; line-height: 25px; color: #84879A; height: 0; overflow: hidden; display: block; max-height: 0; transition: all 0.4s ease-in; } .shuke .product .introduction .txt > div + div { margin-top: 32px; } .shuke .product .introduction .txt > div:nth-child(2) h5 { background: url(../../newImage/fcSet/si2big.png) left center no-repeat; background-size: 18px; } .shuke .product .introduction .txt > div:nth-child(3) h5 { background: url(../../newImage/fcSet/si3.png) left center no-repeat; background-size: 18px; } .shuke .product .introduction .txt > div.active { box-shadow: 0px 0px 40px 0px rgba(30, 105, 255, 0.1); } .shuke .product .introduction .txt > div.active span { height: auto; max-height: 80px; padding-top: 10px; display: block; } .shuke .product .introduction .pic { float: right; width: 600px; height: 100%; min-height: 603px; display: flex; position: relative; } .shuke .product .introduction .pic img { position: absolute; top: 50%; margin-top: -301.5px; } .shuke .pub_title::after { background: #366CFC; } .shuke .case_btn { color: #7097FF; width: 140px; height: 44px; background: #EFF4FF; border-radius: 22px; } .shuke .case .pub_title { font-weight: 500; } @media screen and (max-width: 800px) { .head_d1, .matrix_l, .edit_l, .edit_img img { width: 90%; margin: 0 auto; } .common_width { width: 90%; } .head_ad h1, .head_ad p { text-shadow: 0 0 5px #333333; } .shuke .enterprise .item_box { flex-wrap: wrap; padding-bottom: 25px; } .shuke .enterprise .item_box div { width: 100%; } .shuke .enterprise .item_box div + div { padding-top: 25px; } .shuke .number .num_box { flex-wrap: wrap; padding-top: 58px; } .shuke .number .num_box div { flex: 1 100%; } .shuke .number .num_box div + div { padding-top: 38px; } .shuke .product .introduction > div { width: 100% !important; margin-right: 0 !important; height: auto !important; min-height: auto !important; } .shuke .product .introduction .pic { padding-top: 30px; justify-content: center; } .shuke .product .introduction .pic img { width: 65%; height: auto; margin-top: 0; position: unset; } .shuke .context .common_width { padding: 0 0 465px; background: url(../../newImage/fcSet/centext_bg.png) center bottom 20px no-repeat; background-size: 100%; } .shuke .product .introduction .txt > div { box-shadow: none !important; } .shuke .product .introduction .txt > div span { height: auto; padding-top: 20px; max-height: 160px; } .shuke .head_ad { height: auto; padding-bottom: 1.3rem; } .shuke .head_ad h1 { padding-top: 2.35rem; font-size: 0.48rem; margin-bottom: 0.17rem; letter-spacing: 1px; height: auto; } .shuke .head_ad p { font-size: 0.2rem; line-height: 0.3rem; margin-bottom: 0.4rem; } .shuke .head_ad .play { height: auto; margin-top: 0.25rem; } .shuke .head_ad .play img { width: 0.7rem; height: 0.7rem; } .shuke .head_ad .play span { height: 0.7rem; line-height: 0.7rem; padding-left: 0.16rem; font-size: 0.24rem; } .shuke .enterprise h2, .shuke .product h2, .shuke .number h2 { padding-top: 0.5rem; } .shuke .enterprise h2::after, .shuke .product h2::after, .shuke .number h2::after { top: 1.2rem; } .shuke .product .introduction { padding-top: 38px; } .shuke .context { padding-top: 0.5rem; } .shuke .context .common_width p, .shuke .product .introduction .txt > div h5, .shuke .number .num_box div p { font-size: 0.22rem; } .shuke .context .common_width dt, .shuke .context .common_width dd, .shuke .enterprise .hot_jobTit a, .shuke .enterprise .item_box div p, .shuke .product .introduction .txt > div p, .shuke .product .introduction .txt > div span, .shuke .number .num_box div span { font-size: 0.2rem; } .shuke .number .num_box div p em { font-size: 0.6rem; } .shuke h2 { font-size: 0.32rem !important; } .shuke .product { padding-bottom: 50px; } } @media screen and (max-width: 415px) { .shuke .context .common_width { padding: 0 0 300px; } }