@charset "UTF-8"; $width:750px; @function rem($px){ @return $px/($width/10)*1rem; } .box,.boxbg{ position: relative; width: 100%; max-width: 750px; min-width: 320px; margin: 0 auto; } .title_bm{ width: rem(320px); font-size: rem(24px); color: #fff; margin: 0 auto; margin-top: 11vh; p{ text-align: center; line-height: rem(38px); font-weight: 400; span{ font-size: rem(28px); display: inline-block; margin-top:rem(10px); } } } .boxbg{ position: fixed; height: 100vh; background: url(../image/bg_online.png) no-repeat; background-size: 100% 100%; left: 0; right: 0; } .bm_list{ width:100%; overflow: hidden; margin-top: rem(144px); .list_a{ width:50%; height:rem(485px); float: left; text-align: center; color: #ffffff; position: relative; img{ width:rem(254px); height:rem(254px); margin:0 auto; } h1,h2{ font-size: rem(30px); } h1{ margin: rem(20px) 0; } h3{ position: absolute; bottom: 0; left:.9rem; width:rem(235px); height:rem(76px); background: url("../image/btn_bm.png") no-repeat; background-size: 100% 100%; a{ display: block; height:100%; } } } } .study_car_top{ width:10rem; height:rem(400px); img{ width:100%; height:100%; } } .study_car_content{ width:100%; overflow: hidden; h1{ font-size: rem(36px); color: #000; font-weight: 400; margin-top: rem(50px); text-align: center; margin-bottom: rem(55px); } p{ width:rem(665px); margin: 0 auto; font-size: rem(24px); color: #000; line-height: rem(48px); text-indent: rem(48px); padding-bottom: rem(55px); } } .btn_bm{ width:rem(357px); height:rem(82px); background: url("../image/btn_bm1.png") no-repeat; background-size: 100% 100%; margin:0 auto; margin-top: rem(70px); margin-bottom: rem(100px); } .write_info_box{ width:rem(710px); height:97vh; margin-top: rem(20px); margin-left:rem(20px); background-color: #ffffff; } .write_list_box{ } .write_list{ width:100%; height:rem(97px); overflow: hidden; .icon_tory{ font-size: rem(24px); width:rem(50px); margin-right: rem(6px); text-align: right; color: #53a6fa; line-height: 1.4rem; display: block; float: left; } .info_content{ width:rem(600px); height:rem(97px); border-bottom: rem(1px) solid #eeeeee; float: left; position: relative; i{ display: inline-block; line-height: rem(97px); padding-left:rem(10px); } input{ /*line-height:rem(97px);*/ } .user_code{ width:rem(180px); } #dateSelectorTwo{ width: 50%; } em{ width:rem(21px); height:rem(14px); display: inline-block; background: url("../image/down.png") no-repeat; background-size: 100% 100%; float: right; margin-top: rem(41.5px); } u{ text-decoration: none; width:rem(178px); text-align: center; height:rem(78px); line-height: rem(78px); border:rem(1px) solid #53a6fa; color: #53a6fa; border-radius: rem(22.5px); font-size: rem(30px); display: inline-block; margin-top: rem(8.5px); position: absolute; right:0; } } } .choose_sex{ display: inline-block; float: right; margin-top: rem(25px); margin-left: rem(44px); b{ width:rem(26px); height:rem(26px); display: inline-block; background: url("../image/off.png") no-repeat; background-size: 100% 100%; vertical-align: super; margin-right: rem(30px); } img{ width:rem(42px); height:rem(47px); display: inline-block; } } .sex_active b{ background: url("../image/on.png") no-repeat; background-size: 100% 100%; } .is_agree{ width: 100%; height: rem(28px); text-align: center; margin-top: rem(64px); .btn_dui{ width: rem(28px); height: rem(28px); display: inline-block; background: url("../image/dui_off.png") no-repeat; background-size: 100% 100%; vertical-align: middle; } .dui_active{ background: url("../image/dui_on.png") no-repeat; background-size: 100% 100%; } b{ color: #686868; line-height: rem(28px); font-size: rem(24px); span{ font-size: rem(24px); color: #53a6fa; } } } .hetong_box{ width: 100%; height: 100%; z-index: 9; position: absolute; top:-200%; background-color: #fff; h1{ color: #000; font-size: rem(36px); font-weight: 400; text-align: center; margin-top: rem(57px); margin-bottom: rem(55px); } p{ width: rem(665px); line-height: rem(48px); font-size: rem(24px); margin: 0 auto; text-indent: rem(48px); } } .agree_none{ width: 100%; height: rem(150px); } .btn_agree,.btn_next{ width: rem(576px); height: rem(82px); background: url("../image/btn_agree.png") no-repeat; background-size: 100% 100%; margin: 0 auto; margin-top: rem(200px); display: none; } .btn_next{ bottom: rem(196px); background: url("../image/next_off.png") no-repeat; background-size: 100% 100%; display: block; } .next_active{ background: url("../image/next_on.png") no-repeat; background-size: 100% 100%; } //确认订单 .orderTop{ width:100%; height:rem(400px); overflow: hidden; img{ width:100%; height:100%; } } .goodsName{ height:rem(30px); line-height: rem(30px); padding:0 rem(35px); margin-top: rem(35px); margin-bottom:rem(30px); b{ float: left; color: #000; font-size: rem(30px); } i{ float: right; color: #868686; font-size:rem(24px); } } .goodsPrice{ padding:0 rem(35px); height:rem(36px); line-height: rem(36px); color: #e60012; font-size: rem(36px); padding-bottom: rem(20px); border-bottom: rem(2px) solid #dcdcdc; } .orderBox{ width:100%; overflow: hidden; background-color: #f6f6f6; } .orderInfo{ width:rem(708px); height:rem(511px); margin:0 auto; margin-top: rem(20px); border:rem(1px) solid #eeeeee; border-radius: rem(4px); background-color: #fff; } .order_info_tab{ width:100%; height:rem(75px); overflow: hidden; b{ width:rem(27px); height:rem(30px); display: inline-block; background: url("../image/info_icon.png") no-repeat; background-size: 100% 100%; margin:0 rem(15px); margin-top: rem(22.5px); vertical-align: middle; float: left; } i{ font-size: rem(28px); color: #000; line-height: rem(75px); display: inline-block; vertical-align: middle; float: left; } } .infoList{ width:7.8rem; margin:0 auto; li{ height:rem(76px); line-height: rem(76px); border-bottom: rem(1px) solid #e0e0e0; b{ display: block; float: left; font-size: rem(26px); color: #5a5a5a; } i{ display: block; float: right; font-size: rem(25px); color: #1f92ef; } } } .orderFooter_none{ width:100%; height:rem(120px); } .orderFooter{ width:100%; height:rem(100px); position: fixed; bottom: 0; background-color: #fff; i{ display: inline-block; font-size: rem(26px); color: #000; line-height: rem(100px); margin-left: rem(55px); span{ color: #e60012; } } .btn_buy{ width:rem(200px); height:rem(100px); line-height: rem(100px); text-align: center; background-color: #e60012; color: #fff; font-size: rem(26px); float: right; } } .success_img{ width:100%; height:rem(530px); overflow: hidden; margin-top: rem(87px); img{ width:100%; height:100%; } } .pay_money{ width:100%; height:rem(35px); line-height: rem(35px); text-align: center; color: #707070; font-size: rem(24px); } .menu_two{ width:100%; overflow: hidden; margin-top: rem(136px); a{ width:rem(268px); height:rem(82px); display: block; float: left; img{ width:100%; height:100%; } } a:first-child{ margin-left: rem(60px); } a:last-child{ float: right; margin-right:rem(60px); } } .login_title{ padding-left: rem(75px); padding-top: rem(123px); margin-bottom: rem(166px); font-size: rem(60px); font-weight: 400; } .login_list{ width:rem(600px); height:rem(155px); margin:0 auto; border-bottom: rem(1px) solid #eeeeee; b{ width:rem(130px); line-height: rem(155px); display: block; float: left; color: #53a6fa; font-size: rem(30px); } .login_phone,.login_code{ border:0; outline: 0; font-size:rem(30px); height:rem(155px); float: left; background-color:transparent; } .login_code{ width:rem(180px); } .get_code{ width:rem(180px); height:rem(80px); border:1px solid #53a6fa; border-radius: rem(22.5px); text-align: center; line-height: rem(80px); font-size: rem(26px); color: #53a6fa; display: block; float: right; margin-top:rem(36.5px); text-decoration: none; } } .btn_login{ width:rem(576px); height:rem(82px); /*position: fixed; bottom:rem(196px); left:rem(87px);*/ margin: 0 auto; margin-top:4rem; img{ width:100%; height:100%; } } .login_tab{ width:rem(600px); margin:0 auto; margin-top:rem(35px); overflow: hidden; display: none; b{ width:rem(34px); height:rem(34px); background: url("../image/icon_warn.png") no-repeat; background-size: 100% 100%; display: inline-block; vertical-align: middle; } i{ color: #e60012; font-size: rem(30px); font-weight: 400; display: inline-block; vertical-align: bottom; } } .percenterTop{ width: 100%; height: rem(432px); background: url("../image/per_bg.png") no-repeat; background-size: 100% 100%; position: relative; .perHead{ width: rem(200px); padding-top:rem(125px); margin: 0 auto; text-align: center; img{ width: rem(101px); height: rem(101px); border-radius: rem(101px); display: block; text-align: center; margin: 0 auto; } b{ font-size: rem(30px); color: #22a9f9; background-color: #fff; border-radius: rem(24px); padding: rem(5px) rem(20px); display: inline-block; margin-top: rem(15px); } } .study_time{ width:2rem; position: absolute; right: 1rem; top:rem(162px); text-align: center; b{ display: block; font-size: rem(60px); font-weight: 400; color: #fff; } i{ font-size: rem(24px); font-weight: 400; color: #fff; margin-top:rem(15px); display: inline-block; } } } .percenterMenu{ width: 100%; border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; background-color: #fff; margin-top:rem(20px); li{ width: rem(710px); height: rem(110px); margin: 0 auto; border-bottom: 1px solid #ebebeb; a{ width: 100%; height: 100%; display: block; } img{ width:rem(56px); height: rem(56px); display: inline-block; margin:rem(25px) rem(50px) 0 rem(28px); } i{ font-size: rem(34px); line-height: rem(110px); color: #000; font-weight: 400; display: inline-block; vertical-align: top; } em{ width: rem(16px); height: rem(28px); background: url("../image/icon_next.png") no-repeat; background-size: 100% 100%; float: right; margin-top:rem(41px); margin-right:rem(15px); } } li:last-child{ border-bottom: 0; } } .per_footer{ position: fixed; bottom: 0; width: 100%; max-width: 750px; min-width: 320px; height: rem(100px); border-top: rem(2px) solid #EEEEEE; background-color: #fff; li{ width: 50%; float: left; .foot_img{ width: rem(45px); height: rem(45px); background: url("../image/foot_icon01.png") no-repeat; background-size: 100% 100%; display: block; margin: rem(10px) auto; } .foot_item{ text-align: center; font-size: rem(24px); color: #cccccc; } .foot_img_1{ background: url("../image/foot_icon02.png") no-repeat; background-size: 100% 100%; } .foot_img_2{ background: url("../image/foot_icon01_1.png") no-repeat; background-size: 100% 100%; } .foot_img02_1{ background: url("../image/foot_icon02_1.png") no-repeat; background-size: 100% 100%; } .foot_item_1{ color: #1e89eb; } } } .perInfo{ width: 100%; height: 100%; overflow: hidden; } .headImg{ margin: 0 rem(20px); height: rem(130px); line-height:rem(130px); background-color: #fff; border-radius: 4px; border: 1px solid #eeeeee; b{ width: rem(197px); display: inline-block; font-size: rem(30px); color: #000; margin-left: rem(40px); } .genggai_head{ width: rem(68px); height: rem(68px); border-radius: rem(68px); position: relative; float: right; margin-top: rem(31px); margin-right: rem(20px); } img{ width: 100%; height: 100%; border-radius: rem(68px); position: absolute; top: 0; right: 0; z-index: 1; } #file{ width: rem(68px); height: rem(68px); opacity: 0; position: absolute; top:0; right: 0; z-index: 2; } i{ width: rem(12px); height: rem(22px); display: inline-block; background: url("../image/icon_next_1.png") no-repeat; background-size: 100% 100%; float: right; margin-right: rem(30px); margin-top: rem(54px); } .xiugaiName{ font-size: rem(30px); color: #626262; font-weight: 400; border: 0; outline: none; } .user_code{ width:rem(180px); font-size:rem(30px); } u{ width: rem(178px); height: rem(78px); border-radius: rem(22.5px); color: #53a6fa; font-size: rem(30px); text-align: center; line-height: rem(78px); display: inline-block; float: right; border: 1px solid #53a6fa; text-decoration: none; margin-top: rem(26px); } } .perInfo:first-child .headImg{ margin-top:rem(40px); margin-bottom: rem(36px); } .perInfo:nth-of-type(3) .headImg,.perInfo:nth-of-type(4) .headImg{ border-top: 0; } .btn_keep{ width: rem(576px); height:rem(82px); margin: 0 auto; margin-top:rem(70px); img{ width: 100%; height: 100%; } } .yuyueTop{ width: 100%; height: rem(300px); background: url("../image/yuyue_top.png") no-repeat; background-size: 100% 100%; } .head_left{ width: rem(263px); float: left; margin-top: rem(70px); text-align: center; img{ width: rem(101px); height: rem(101px); border-radius: rem(101px); margin: 0 auto; display: block; } .uesr_name{ font-size: rem(24px); color:#22a9f9; background-color: #fff; padding: rem(5px) rem(10px); border-radius: rem(16px); margin-top: rem(20px); display: inline-block; } } .study_right{ width: 2rem; float: right; overflow: hidden; margin-right: .9rem; text-align: center; .study_num{ font-size: rem(60px); font-weight: 400; color: #fff; display: block; margin-top:rem(88px); } i{ font-size: rem(24px); color: #fff; margin-top: rem(20px); display: block; font-weight: 400; } } .yuyueMenu{ width: 100%; height: 100%; overflow: hidden; background-color: #fff; li{ width: 25%; height: rem(96px); line-height:rem(96px); float: left; text-align: center; b{ font-size: rem(30px); color: #000; font-weight: 400; display: inline-block; } } .yuyue_cur b{ color: #53a6fa; padding: 0 rem(10px); border-bottom: rem(4px) solid #53a6fa; } } .no_yuyue,.btn_yuyue{ width: rem(305px); height: rem(328px); margin: 0 auto; margin-top: rem(108px); display: none; img{ width: 100%; height: 100%; } } .btn_yuyue{ width: rem(576px); height: rem(82px); margin-top: rem(85px); } .hide{ display: none; } .yuyue-content{ width: 100%; height: 100%; margin-top: rem(20px); } .yuyueList{ width: rem(710px); margin: 0 auto; border: 1px solid #eeeeee; border-radius: 4px; background-color: #fff; } .yList_top{ width:100%; height: rem(80px); line-height: rem(80px); border-bottom: 1px solid #EEEEEE; b{ float: left; margin-left: rem(40px); color: #313131; font-size:rem(26px); display: inline-block; } i{ float: right; color: #a0a0a0; font-size: rem(24px); display: inline-block; margin-right:rem(40px); } } .yList_info{ width: 100%; height: 100%; overflow: hidden; padding: rem(45px) 0; border-bottom: 1px solid #EEEEEE; .yu_user_head{ width:rem(80px); height: rem(80px); border-radius: rem(80px); float: left; margin-left: rem(40px); } .yu_user_info{ float: left; margin-left: rem(36px); .user_name{ font-size: rem(30px); color: #000; display: block; } .user_fun{ font-size: rem(24px); color: #626262; display: block; margin-top: rem(5px); } } .yu_date{ float: right; margin-right: rem(40px); text-align: right; .yu_week{ font-size: rem(26px); color: #000; display: block; } .yu_times{ font-size: rem(24px); color: #1b1b1b; display: block; margin-top:rem(10px); } } } .yuyue_btn{ width: 100%; height: rem(80px); .click_yuyue,.click_jindu{ width: rem(138px); height: rem(58px); margin-top: rem(10px); border-radius: rem(30px); text-align: center; line-height: rem(60px); float: right; margin-right: rem(25px); background-color: #53a6fa; color: #fff; font-size:rem(26px); border: 1px solid #53a6fa; } .click_jindu{ background-color: #fff; border: 1px solid #53a6fa; color: #53a6fa; } } .full_bg{ background-color: gray; left: 0; opacity: 0.5; position: fixed; top: 0; z-index: 10; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; } .yu_tan{ width:rem(560px); height:rem(660px); position: absolute; display: none; z-index:11; .yu_tan_box{ width: rem(560px); height: rem(500px); border-radius: rem(20px); background-color: #fff; text-align: center; position: relative; .tan_car{ width: rem(406px); height: rem(268px); margin-top:rem(10px); } .tan_text{ width: rem(415px); margin: 0 auto; text-align: center; font-size: rem(36px); font-weight: 400; color: #000; margin-top: rem(40px); } .btn_qr{ width: 100%; height: rem(98px); line-height: rem(98px); text-align: center; border-bottom-left-radius: rem(20px); border-bottom-right-radius: rem(20px); color: #fff; background-color: #4ca8f2; font-size: rem(36px); font-weight: 400; position: absolute; bottom: 0; } } .cancel{ width: rem(70px); height: rem(70px); margin: 0 auto; background: url("../image/cancel.png") no-repeat; background-size: 100% 100%; margin-top:rem(90px); } } .choose_ping_box{ width: 100%; height: 100%; padding-top: rem(20px); } .choose_ping{ width: rem(706px); height: rem(396px); margin: 0 auto; background-color: #fff; border: rem(2px) solid #eeeeee; li{ width: rem(352px); text-align: center; float: left; border-right: rem(2px) solid #EEEEEE; margin-top: rem(77px); img{ width: rem(118px); height: rem(118px); display: block; margin: 0 auto; } b{ font-size: rem(30px); color: #000; display: block; margin-top: rem(20px); } } li:last-child{ border-right: 0; } } .ping_content{ width: rem(706px); margin: 0 auto; background-color: #fff; border: rem(2px) solid #eeeeee; } .ping_title{ width: 100%; height: rem(90px); line-height: rem(90px); border-bottom: rem(2px) solid #EEEEEE; img{ width: rem(32px); height: rem(32px); display: inline-block; vertical-align: sub; margin-left: rem(28px); margin-right: rem(20px); } b{ font-size: rem(30px); font-weight: 400; color: #000; } } .pingList{ border-bottom: rem(2px) solid #EEEEEE; overflow: hidden; padding-bottom:rem(40px); span{ width: rem(196px); height: rem(56px); line-height: rem(60px); border: rem(2px) solid #24b5ff; font-size: rem(30px); font-weight: 400; color: #24b5ff; display: inline-block; border-radius: rem(30px); text-align: center; margin-left: rem(44px); float: left; margin-top:rem(40px); } span:first-child,span:nth-of-type(4){ margin-left:rem(10px); } .ping_active{ background-color: #24b5ff; color: #fff; } } .cha_cur{ display: none; } .ping_area{ height: rem(300px); position: relative; #wordtext{ width: rem(666px); height: rem(230px); padding: rem(35px) rem(20px); color:#b5b5b5; resize: none; } #wordage{ position: absolute; right: rem(20px); bottom: .05rem; font-weight: 400; color: #b5b5b5; font-size:rem(30px); } } .btn_tijiao{ width: rem(576px); height: rem(82px); margin: 0 auto; margin-top: rem(33px); img{ width: 100%; height:100%; } } .topbg{ width: 100%; height: rem(20px); background-color: #f6f6f6; } .ping_deatil{ width: 100%; height: 100%; overflow: hidden; border-top: 1px solid #EEEEEE; border-bottom: 1px solid #EEEEEE; h1{ width:rem(700px); height: rem(85px); line-height: rem(85px); border-bottom:2px solid #EEEEEE; margin: 0 auto; span{ color: #000; font-size: rem(30px); font-weight: 400; margin-left: rem(24px); display: inline-block; } } } .ping_info{ width:rem(700px); margin: 0 auto; border-bottom: 0; .yu_user_head{ width:rem(119px); height: rem(119px); border-radius: rem(119px); margin-left: rem(24px); } .yu_user_info .user_name,.yu_date .yu_week{ margin-top:rem(15px); } .yu_user_info .user_fun,.yu_date .yu_times{ margin-top: rem(10px); } } .ping_show{ width: rem(706px); margin: 0 auto; } .ping_text{ padding: rem(50px) rem(30px); p{ font-size: rem(30px); color: #b5b5b5; line-height:rem(54px); text-indent:rem(60px); } } .Myorder{ width: 100%; height: 100%; padding-top: rem(20px); .orderList{ width: rem(710px); border: 1px solid #EEEEEE; border-radius: 4px; background-color: #fff; margin: 0 auto; h1{ width: 100%; height: rem(80px); line-height: rem(80px); border-bottom: 1px solid #EEEEEE; b{ color: #53a6fa; display: block; float: left; font-size: rem(26px); margin-left: rem(40px); } i{ color: #a0a0a0; font-size: rem(24px); float: right; margin-right: rem(40px); display: block; } } .order_head{ width: 100%; height: rem(80px); line-height: rem(80px); padding: rem(47px) 0; border-bottom: 1px solid #EEEEEE; img{ width: rem(80px); height: rem(80px); border-radius: rem(80px); float: left; margin-left: rem(40px); } b{ font-size: rem(30px); color: #000; display: block; float: left; margin-left: rem(36px); } i{ color: #1b1b1b; font-size: rem(24px); display: block; float: right; margin-right: rem(40px); } .coach_intro{ width: rem(480px); float: left; margin-left:rem(38px); u{ display: block; text-decoration: none; font-size: rem(30px); color: #000; } h3{ margin-top: rem(15px); overflow: hidden; span{ width: rem(132px); color: #626262; font-size: rem(24px); display: inline-block; float: left; } em{ width: rem(345px); color: #b5b5b5; display: inline-block; float: left; font-size: rem(24px); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height: .51rem; } } } } .order_details,.tell_jiaolian{ width: 100%; height: rem(80px); img{ width: rem(140px); height: rem(60px); margin-top: rem(10px); margin-right: rem(40px); float: right; } } .tell_jiaolian{ img{ width: rem(220px); height: rem(60px); } } } } .order_info_tab em{ width: rem(217px); height: rem(60px); line-height: rem(60px); border-radius: rem(10px); text-align: center; color: #53a6fa; font-size: rem(28px); float: right; display: block; border: 1px solid #53a6fa; margin-top: rem(7px); margin-right: rem(28px); a{ color: #53a6fa; font-size: rem(28px); } } .btn_back{ width: rem(576px); height: rem(82px); margin: 0 auto; margin-top:rem(115px); img{ width: 100%; height:100%; } } .shouceBox{ width: 100%; height: 100%; padding-top: rem(20px); } .ceList{ width: rem(710px); height: rem(180px); margin: 0 auto; padding: rem(40px) 0; background-color: #fff; border-radius: 4px; margin-bottom: rem(20px); overflow: hidden; a{ width: 100%; height: 100%; display: block; } img{ width: rem(225px); height: rem(180px); border-radius: 4px; float: left; margin-left: rem(47px); margin-right: rem(43px); } .ce_content{ width: rem(350px); float: left; h1{ font-size: rem(30px); font-weight: 400; color: #000; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; padding: rem(12px) 0; } p{ font-size: rem(26px); color: #898989; line-height: rem(38px); overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; } } } .detailsTop{ width: 100%; height: rem(400px); overflow: hidden; img{ width: 100%; height: 100%; } } .ce_title{ font-size: rem(36px); font-weight: 400; color: #000; text-align: center; padding: rem(50px) 0; } .ce_editor{ padding: 0 rem(40px); font-size: rem(24px); color: #000; overflow: hidden; margin-bottom: rem(35px); b{ float: left; } i{ float: right; } } .ce_con{ padding: 0 rem(40px); font-size: rem(24px); color: #000; line-height: rem(48px); text-indent: rem(48px); } .btn_ping{ width: rem(576px); height: rem(82px); margin: 0 auto; margin-top: rem(35px); img{ width: 100%; height: 100%; } } .study_detail{ width: 100%; background-color: #fff; border-top: 1px solid #EEEEEE; margin-top: rem(20px); .ping_title{ width: auto; margin: 0 rem(20px); img{ margin-left:rem(38px); } } } .studyList{ margin:0 rem(20px); border-bottom: 1px solid #EEEEEE; h1{ font-size: rem(30px); color: #1b1b1b; padding: rem(30px) rem(20px); } h2{ margin: 0 rem(20px); padding-bottom:rem(35px); overflow: hidden; b{ float: left; font-size: rem(24px); color: #626262; } i{ float: right; font-size: rem(24px); color: #7d7d7d; } } } //预约学车 .yu_menu{ width: 100%; height: rem(88px); background-color: #fff; border-bottom:rem(2px) solid #EEEEEE; li{ width: 50%; height: rem(86px); line-height:rem(86px); float: left; text-align:center; a{ width: 100%; height: 100%; display: block; } b{ display: inline-block; color: #bfbfbf; font-size: rem(28px); font-weight: 400; } .yu_cur{ color: #53a6fa; border-bottom: rem(4px) solid #53a6fa; } } } .day_list{ width: rem(88px); margin: 0 auto; height: rem(110px); text-align: center; font-size:rem(24px); margin:rem(7px); overflow: hidden; b{ display: block; margin: rem(15px) 0; } } .day_bg{ width: rem(88px); height: rem(96px); border-radius: 4px; background-color: #53a6fa; color: #fff; } .yu_container{ width: rem(710px); background-color: #fff; overflow: hidden; border: 1px solid #eee; padding-top:rem(36px); margin: 0 auto; } .time_list{ width: rem(196px); height: rem(76px); line-height: rem(78px); text-align: center; font-size: rem(24px); border-radius: rem(6px); color: #626262; border: rem(2px) solid #626262; margin-left:rem(28px); float: left; margin-bottom: rem(20px); position: relative; } .time_bor{ color: #53a6fa; border: rem(2px) solid #53a6fa; } .time_bg_icon{ color: #fff; background-color: #53a6fa; border: rem(2px) solid #53a6fa; i{ } } .coachBox{ margin:rem(20px); background-color: #fff; border: 1px solid #EEEEEE; .yu_time{ width: rem(648px); height: rem(84px); line-height: rem(84px); margin: 0 auto; border-bottom: 1px solid #EEEEEE; overflow: hidden; h1{ color: #000; font-size: rem(30px); } } .coachList{ width: rem(648px); margin: 0 auto; border-bottom: 1px solid #EEEEEE; padding: rem(40px) 0; overflow: hidden; a{ width: rem(119px); height: rem(119px); float: left; margin-right: rem(25px); img{ width: 100%; height: 100%; } } .coach_title{ width: rem(340px); float: left; b{ font-size: rem(30px); color: #000; display: block; margin: rem(15px) 0; } h1{ width: 100%; font-size: rem(24px); color: #626262; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; } } .coach_yu{ width: rem(160px); height: rem(60px); line-height: rem(60px); text-align: center; background-color: #53a6fa; color: #fff; font-size: rem(30px); border-radius: rem(30px); margin-top:rem(26px); float: right; } } .coachList:last-child{ border-bottom: 0; } } .none{ width: 100%; height: 100%; overflow: hidden; } .coach_tab{ width: rem(710px); margin: 0 auto; border-bottom: rem(2px) solid #EEEEEE; overflow: hidden; padding-bottom:rem(40px); span{ width: rem(200px); height: rem(60px); line-height: rem(60px); font-size: rem(30px); font-weight: 400; color: #fff; display: inline-block; border-radius: rem(30px); text-align: center; margin-left: rem(37.5px); float: left; margin-top:rem(40px); background-color: #24b5ff; } span:nth-of-type(3n+1){ margin-left: rem(17.5px); } } .ping_list{ width: rem(710px); margin: 0 auto; overflow: hidden; border-bottom: 1px solid #EEEEEE; h1{ padding: 0 rem(30px); font-size: rem(30px); color: #000; margin: rem(50px) 0; } h2{ padding: 0 rem(30px); overflow: hidden; padding-bottom: rem(20px); b,i{ display:inline-block; float: left; font-size: rem(24px); color: #6c6c6c; } i{ float: right; } } } .ping_list:last-child{ border-bottom: 0; } .btn_yuyue_none{ width: 100%; height: rem(142px); background-color: #f6f6f6; } .btn_yuyue1{ width:100%; height: rem(82px); position: fixed; bottom: rem(30px); text-align: center; img{ width: rem(576px); height: rem(82px); } }