.base_detail { padding-bottom: 200px; .header { img { width: 100%; } } .uni_text { width: 100%; background: #fff; padding: 24px 34px; box-sizing: border-box; .course_name { font-size: 34px; font-weight: bold; } .course_info { font-size: 24px; color: #999; margin-top: 16px; } .address { font-size: 24px; color: #999; margin-top: 16px; width: 100%; height: 88px; line-height: 88px; background: url('../../../assets/service/address_bg.png') 100%/100% no-repeat; box-sizing: border-box; margin-top: 20px; display: flex; justify-content: space-between; align-items: center; padding: 0 20px; .icon { color: #333; // color: #000; } } .rate { margin-top: 20px; display: flex; justify-content: space-between; div>span { font-size: 30px; color: #ffcc00; margin-left: 30px; } >span { font-size: 26px; } } .tag_box { padding-top: 10px; .tag { display: inline-block; margin-top: 10px; margin-right: 12px; color: #4092ff; font-size: 24px; border-radius: 8px; border: 2px solid #4092ff; padding: 2px 10px; } } } .content_box { position: relative; .content_all { overflow: hidden; font-size: 31px !important; line-height: 40px !important; letter-spacing: 1.6px; color: #666; img { display: block; max-width: 100%; margin: 0 auto; } &.active_box { white-space: nowrap; overflow: auto; &::-webkit-scrollbar { width: 0; } &::-webkit-scrollbar { display: none; } } .active_item { display: inline-block; width: 287px; cursor: pointer; background: #fff; transition: 0.3s ease; margin-right: 14px; &:last-of-type { margin-right: 0; } .bg_box { width: 287px; height: 216px; background-size: cover; background-position: center; } .text_box { padding: 10px; } .tag { display: inline-block; margin-top: 2px; margin-right: 12px; font-size: 20px; line-height: 32px; color: #65768c; background: #f3f7fd; border-radius: 2px; padding: 0 3px; } .count_box { display: flex; justify-content: space-between; align-items: center; .count { color: #999999; font-size: 20px; } .reserve_btn { font-size: 22px; color: #f03c3c; } } .title { font-size: 28px; font-weight: bold; line-height: 40px; margin: 0; height: 80px; color: #000; white-space: initial; } } .teacher_box { .teacher_item { padding: 14px; width: 702px; height: 240px; background: #F9F9F9; border-radius: 20px; box-sizing: border-box; margin-bottom: 16px; } .teacher_img_box { width: 168px; height: 212px; border-radius: 12px; position: relative; overflow: hidden; float: left; margin-right: 18px; } .teacher_img { height: 100%; position: absolute; top: 0; left: 50%; transform: translate(-50%); max-width: initial; } .teacher_name { font-size: 30px; line-height: 42px; } .teacher_info { font-size: 26px; line-height: 36px; color: #999; margin-top: 4px; } .teacher_level { font-size: 24px; line-height: 34px; margin-top: 10px; } .teacher_location { font-size: 24px; line-height: 34px; margin-top: 10px; } } } } .tag_item { padding: 22px; .tag_title { font-size: 34px; font-weight: bold; margin-bottom: 32px; } .tag_text { // font-size: 24px; // line-height: 40px; font-size: 28px !important; line-height: 44px !important; padding: 16px 0; } } .top_border { border-top: 16px solid #f6f7fa; ::v-deep.van-tab { .van-tab__text { font-size: 34px !important; } } } .Collection { position: fixed; bottom: 0; left: 0; width: 100%; padding: 28px 22px; box-sizing: border-box; padding-bottom: 50px; z-index: 500; box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.34); .box { background: url(../../../assets/btn.png) 100%/100% no-repeat; width: 702px; height: 92px; .btn { display: inline-block; width: 50%; height: 100%; } } } .share_mask { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.4); z-index: 999; } .share_des { position: absolute; top: 50px; right: 100px; width: 516px; } }