.banner { height: 26.25rem; background: url(https://xiaoyidushu.oss-cn-zhangjiakou.aliyuncs.com/huiwen/banner-2.png) no-repeat; text-align: center; line-height: 26.25rem; font-size: 3.125rem; color: #fff; font-weight: 600; } .branch-title-box { position: relative; height: 11.6875rem; padding-top: 4.625rem; background-color: #fff; } .branch-title-number { position: absolute; top: 2.222222rem; left: 22.222222rem; width: 9.25rem; height: 5.25rem; } .branch-title { font-size: 2.222222rem; font-weight: 600; color: #333; margin-bottom: 1.875rem; } .branch-explain { display: inline-block; width: 58rem; font-size: 1.111111rem; font-weight: 400; color: #888; line-height: 1.3; } .operate { position: relative; height: 38.944444rem; background: url(https://xiaoyidushu.oss-cn-zhangjiakou.aliyuncs.com/huiwen/saas/beijing.png) no-repeat; } .fenguan { position: relative; height: 17.45rem; } .operate .title:first-child { position: absolute; top: 7rem; left: 20rem; width: 8.888889rem; height: 2.777778rem; border-radius: 1.388889rem; text-align: center; line-height: 2.777778rem; background-color: #4190f6; color: #fff; font-size: 1.25rem; font-weight: 400; } .shujudapan { position: absolute; top: 3.333333rem; left: 33.333333rem; display: flex; flex-direction: column; align-items: center; width: 15.555556rem; } .fenguan_img { width: 1.666667rem; height: 1.666667rem; } .fenguan_title { font-size: 1.111111rem; color: #fff; font-weight: 400; margin-top: 1.25rem; } .fenguan_content { width: 15.555556rem; color: #fff; font-size: 0.777778rem; font-weight: 400; margin-top: 1.875rem; line-height: 1.25rem; } .xitongshezhi { position: absolute; top: 3.75rem; left: 52.222222rem; display: flex; flex-direction: column; align-items: center; } .zongguan { position: relative; height: 27.5rem; } .operate .title2 { position: absolute; left: 20rem; top: 72%; transform: translateY(-50%); width: 8.888889rem; height: 2.777778rem; border-radius: 1.388889rem; text-align: center; line-height: 2.777778rem; background-color: #4190f6; color: #fff; font-size: 1.25rem; font-weight: 400; } .yunxingzhongxin { position: absolute; top: 18.75rem; left: 33.333333rem; display: flex; flex-direction: column; align-items: center; } .tushuguanli { position: absolute; top: 18.75rem; left: 52.222222rem; display: flex; flex-direction: column; align-items: center; } .yonghuguanli { position: absolute; top: 18.75rem; left: 71.111111rem; display: flex; flex-direction: column; align-items: center; } .liutongguanli { position: absolute; top: 29rem; left: 33.333333rem; display: flex; flex-direction: column; align-items: center; } .shebeiguanli { position: absolute; top: 29rem; left: 52.222222rem; display: flex; flex-direction: column; align-items: center; } .xitongshezhi2 { position: absolute; top: 29rem; left: 71.111111rem; display: flex; flex-direction: column; align-items: center; } .saas { height: 92rem; } .modular-container { display: flex; flex-wrap: wrap; justify-content: space-between; width: 66.666667rem; } .modular-item { position: relative; box-sizing: border-box; width: 21.111111rem; height: 8.333333rem; background-color: #fff; box-shadow: 0 0.125rem 1.875rem 0 rgba(104, 104, 104, 0.07); margin-top: 1.666667rem; border-radius: 0.625rem; padding: 1.875rem; text-align: left; line-height: 1.3; } .modular-item:hover { border-radius: 0.625rem; box-shadow: 0 0.125rem 1.875rem 0 rgba(104, 104, 104, 0.3); } .modular-item:hover::before { position: absolute; top: 0; left: 0; content: ''; display: inline-block; width: 21.111111rem; height: 0.375rem; background-color: #4190f6; border-radius: 0.625rem; } .modular-item-icon { display: inline-block; width: 0.625rem; height: 0.625rem; border: 0.125rem solid #4190f6; border-radius: 50%; } .modular-item-title { font-size: 1.111111rem; font-weight: 500; color: #333; margin-left: 0.5rem; } .modular-item-content { margin-top: 1.4375rem; margin-left: 1.5625rem; font-size: 0.777778rem; font-weight: 400; color: #888; } .book_system { position: relative; height: 60.611111rem; background-color: #fff; } .topmarks { position: absolute; top: 9.388889rem; left: 23.333333rem; width: 4.833333rem; height: 4.222222rem; } .book_system_title { position: absolute; top: 13.611111rem; left: 33.333333rem; font-size: 2.222222rem; color: #333; font-weight: 600; } .book_system_content { position: absolute; top: 17.777778rem; left: 20rem; width: 35rem; font-size: 1.111111rem; color: #888; font-weight: 400; line-height: 1.3; } .book_system_img { position: absolute; top: 1.777778rem; left: 56.111111rem; width: 32.222222rem; height: 30.5rem; } .book_system_img_bottom { position: absolute; top: 39.888889rem; left: 20rem; width: 28.888889rem; height: 16.277778rem; } .book_system_title_bottom { position: absolute; top: 41.444444rem; left: 55.555556rem; font-size: 2.222222rem; color: #333; font-weight: 600; } .bottommarks { position: absolute; top: 37.166667rem; left: 81.833333rem; width: 4.833333rem; height: 4.222222rem; } .book_system_content_bottom { position: absolute; top: 46.833333rem; left: 55.555556rem; width: 31.111111rem; font-size: 1.111111rem; color: #888; font-weight: 400; line-height: 1.3; } @media screen and (max-width: 750px) { .operate { width: 100vw; height: 44rem; background: url(https://xiaoyidushu.oss-cn-zhangjiakou.aliyuncs.com/huiwen/saas/bg.png) no-repeat center; background-size: 100% 100%; } .operate .title:first-child { top: 1rem; left: 1rem; } .fenguan { box-sizing: border-box; height: 13.25rem; padding-top: 5rem; } .fenguan .title { left: 1.5rem; top: 1.5rem; width: 6rem; height: 2.125rem; border-radius: 1.625rem; line-height: 2.125rem; font-size: 1rem; } .shujudapan { position: static; width: 12.222222rem; } .liutongguanli, .shebeiguanli, .tushuguanli, .xitongshezhi, .xitongshezhi2, .yonghuguanli, .yunxingzhongxin { position: static; width: 12.222222rem; margin-bottom: 1rem; } .fenguan_title { margin-top: 0.3rem; } .fenguan_content { width: 12.222222rem; margin-top: 0.3rem; } .zongguan { padding-top: 5rem; box-sizing: border-box; height: 30.65rem; } .zongguan .title { top: 2.222222rem; left: 1.5rem; width: 6rem; height: 2.125rem; border-radius: 1.625rem; line-height: 2.125rem; font-size: 1rem; } .saas { width: 100vw; height: 45rem; } .modular-container { width: 100vw; justify-content: space-around; } .modular-item1 { position: relative; box-sizing: border-box; width: 30%; height: 3rem; padding: 0.875rem; background-color: #fff; box-shadow: 0 0.125rem 1.875rem 0 rgba(104, 104, 104, 0.07); margin-top: 1.875rem; border-radius: 0.625rem; text-align: left; color: #333; } .modular-item-icon { width: 0.3rem; height: 0.3rem; border: 0.25rem solid #4190f6; } .book_system { padding-top: 1rem; height: 75.1875rem; } .book_system_title { position: static; text-align: center; font-size: 2rem; margin-bottom: 1rem; } .book_system_content { position: static; width: 90vw; } .book_system_img { position: static; width: 80vw; height: auto; } .book_system_title_bottom { position: static; margin-top: 3rem; font-size: 2rem; margin-bottom: 2rem; } .book_system_content_bottom { position: static; width: 90vw; text-align: left; } .book_system_img_bottom { position: static; width: 80vw; margin-top: 3rem; } }