weixin/src/main/resources/static/extension/css/style.css

@charset "UTF-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;font-family:"微软雅黑";-webkit-tap-highlight-color:transparent}
table {border-collapse:collapse;border-spacing:0}
fieldset,img{border:0;vertical-align: middle;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-weight:400}
q:before,q:after{content: ''}
abbr,acronym{border:0}
a{text-decoration:none}
html{font-family: sans-serif;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;}
html,body{margin: 0 auto;width: 100%;height: 100%;background: #fff;}
body{position: relative;
    font: 28px/1.2 sans-serif;
    -webkit-tap-highlight-color: transparent;
    -webkit-overflow-scrolling: touch;
    -webkit-text-size-adjust: 100%;
    -webkit-user-select: none;}
i{font-style:normal}
.clear:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
.clear{display:inline-table}
* html .clear{height:1%}
a{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none}
.fl{float:left}
.fr{float:right}
.pr{position:relative}
.pa{position:absolute}
.dn{display:none}
.vn{visibility:hidden}
.center{text-align:center}
.tr{text-align:right}
.tl{text-align:right}
a:hover,a:focus{color:#16191e}
a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset: -2px}
.swiper-container{width:100%;height:100%}
section{overflow:hidden}
.img-box {position:absolute;width:100%;height:100%}
.img-box img{position:absolute}
html.no-scroll {
    overflow-y: scroll !important;
    overflow: hidden !important;
    height: 100% !important;
}

#container{position: absolute;top: 0;width: 100%;height: 100%;overflow: hidden;}
.wrap_header{position: fixed;top:0;left:50%;transform:translate(-50%,0);width: 100%;height: calc(100% - 2rem);overflow: auto;}
.wrap_index{width: 100%;height: auto;font-size:0;vertical-align:top;display: flex;flex-direction: column;align-items: flex-start;}
.index_pic{width: 7.5rem;}
.index_pic1{height:11.32rem;background:url(https://img.sharingschool.com/activity/images/index_a1.png?v=2) no-repeat center/ 100% 100%;}
.index_pic2{height:4.85rem;margin-top:0.02rem;background:url(https://img.sharingschool.com/activity/images/index_a2.png?v=2) no-repeat center/ 100% 100%;}
.index_pic3{height:5.98rem;margin-top:0.11rem;background:url(https://img.sharingschool.com/activity/images/index_a3.png?v=2) no-repeat center/ 100% 100%;}

.index_pic4{height:36.52rem;margin-top:0.38rem;background:url(https://img.sharingschool.com/activity/images/index_long.png?v=2) no-repeat center/ 100% 100%,#e12d39;}
/* .index_pic4{height:5.12rem;margin-top:0.38rem;background:url(https://img.sharingschool.com/activity/images/index_a4.png?v=2) no-repeat center/ 100% 100%,#e12d39;}
.index_pic5{height:16.9rem;background:url(https://img.sharingschool.com/activity/images/index_a5.png?v=2) no-repeat center/ 100% 100%,#e12d39;}
.index_pic6{height:14.55rem;background:url(https://img.sharingschool.com/activity/images/index_a6.png?v=2) no-repeat center/ 100% 100%;} */

.index_pic5{margin-top: -0.02rem;height:6.05rem;background:url(https://img.sharingschool.com/activity/images/index_a7.png?v=2) no-repeat center/ 100% 100%,#fff;}
.index_pic6{height:7.8rem;margin-top:0.31rem;background:url(https://img.sharingschool.com/activity/images/index_a8.png?v=2) no-repeat center/ 100% 100%,#fff;}
.index_pic7{height:10.5rem;margin-top:0.27rem;background:url(https://img.sharingschool.com/activity/images/index_a9.png?v=2) no-repeat center/ 100% 100%;}
.index_pic0{height:1.94rem;background: #FFF;}

/*跑马灯*/
.index_pic1_marquee{width: 4.12rem;height: .46rem;top:.33rem;right:.2rem;background: rgba(62,3,19,.35);border-radius: .23rem;font-size: .24rem;line-height:.46rem;font-weight: 400;color: #FFFFFF;text-align: center;overflow: hidden;}
.index_pic1_marquee ul{}
.index_pic1_marquee ul li{width: 100%;height: .46rem;line-height:.46rem;}


/*底部免费报名*/
.wrap_footer{position: fixed;width: 7.5rem;height: 1.94rem;bottom:0;left:50%;transform:translate(-50%,0);background: #FFF;box-shadow: 0 0 .16rem 0 rgba(113, 53, 9, 0.4);}
.wrap_footer_text{width: 100%;height: 0.3rem;top:.29rem;left:50%;transform:translate(-45%,0);font-size: 0.3rem;font-weight: bold;color: #E22331;line-height: 0.3rem;text-align: center;letter-spacing: 0.02rem;
}
.wrap_footer_icon{width: .62rem;height: .62rem;bottom: .71rem;left:.51rem;}
.wrap_footer_icon img{width: 100%;line-height: .62rem;vertical-align: top;}
#wrap_footer_btn{width: 5.02rem;height: .88rem;bottom: .6rem;left:50%;transform:translate(-45%,0);background: linear-gradient(187deg, #E12331, #E22331);border-radius: .44rem;text-align: center;letter-spacing: 0.02rem;cursor: pointer;}
#wrap_footer_btn.disabled{background: #BFBFBF;opacity: .9;}
.wrap_footer_btn h3{font-size: .32rem;font-weight: 400;color: #FFF;}
.wrap_footer_btn h3 span{font-size: .42rem;font-weight: bold;color: #FFF;}
.wrap_footer_btn p{font-size: .2rem;font-weight: 400;color: #FFFFFF;}
.wrap_footer_btn_tip{width: 1.84rem;height: .4rem;background: #FFB500;border-radius: .21rem .2rem .2rem 0;top:-.08rem;right:-.6rem;font-size: .24rem;font-weight: bold;color: #FFFFFF;line-height: .4rem;text-align: center;}

/* 选择练习册 */
.wrap_select{width: 100%;height: 100%;background: #F2F5F8;left: 0;top: 0;display: none;}
.wrap_select_top{position: fixed;top:0;left:50%;transform:translate(-50%,0);width: 100%;height: calc(100% - 1.4rem);overflow: auto;}
.wrap_select_register{width: 6.22rem;height: auto;padding:.3rem;background: #fff;margin:0 auto;margin-top: .3rem;box-shadow: 0 0 .18rem 0 rgba(199, 216, 232, 0.15);border-radius: .2rem;overflow: hidden;}
.wrap_select_workbook{width: 6.22rem;height: auto;padding:.3rem;background: #FFF;margin:0 auto;margin-top: .2rem;box-shadow: 0 0 .18rem 0 rgba(199, 216, 232, 0.15);border-radius: .2rem;overflow: auto;}
.wrap_select_payment{width: 100%;height: 1.38rem;background: #FFF;box-shadow: 0 -0.02rem 0.24rem 0 rgba(199, 216, 232, 0.54);position: fixed;bottom: 0;left:50%;transform:translate(-50%,0);z-index: 99;}
.select_register_tel{width: 100%;height: 1.4rem;border-bottom: 0.01rem solid #E6E6E6;position: relative;}
.select_register_yzm{width: 100%;height: 1rem;margin-top:.2rem;position: relative;}
.select_register_tel span, .select_register_yzm span{float:left;display:inline-block;height:1rem;margin-right:.15rem;font-size: .36rem;font-weight: 500;color: #333;line-height: 1rem;}
.select_register_tel input, .select_register_yzm input{float:left;height:.6rem;padding:.2rem 0;background: transparent;border: 0;outline: none;text-align: left;font-size: .3rem;font-weight: 400;color: #1A1A1A;line-height: .6rem;cursor: pointer;}
.select_register_tel input:focus, .select_register_yzm input:focus{background: none;}
.select_register_tel input{width:3.3rem;}
.select_register_yzm input{width:2.5rem;}
.select_register_yzm_tip1{width: 1.6rem;height: .3rem;font-size: .24rem;font-weight: 400;color: #3DBA40;line-height: .3rem;position: absolute;right: 0;top:36%;transform: translateY(-50%);display: none;}
.select_register_yzm_tip2{width: 100%;height: .3rem;font-size: .24rem;font-weight: 400;color: #3DBA40;line-height: .3rem;position: absolute;left: 0;bottom: 0.05rem;}
.select_register_yzm_tip1 i,.select_register_yzm_tip2 i{float:left;display: inline-block;width: .26rem;height: .26rem;margin:0.02rem 0;background:url(https://img.sharingschool.com/activity/images/tel_icon.png?v=2) no-repeat center/ 100% 100%;}
.select_register_yzm_btn{width: 2.3rem;height: .78rem;background: #FFF;position:absolute;right:0;top:.1rem;border: 0.02rem solid #EA3844;border-radius: .39rem;text-align: center;font-size: .28rem;font-weight: 400;color: #EA3844;line-height: .78rem;cursor: pointer;}

.wrap_select_payment p{float:left;width:30%;height:1.38rem;line-height:1.38rem;font-size: .58rem;font-weight: bold;color: #EA3844;text-align: center;}
.wrap_select_payment p span{font-size: .36rem;}

.select_payment_btn{float:right;width: 3rem;height: .88rem;line-height:.88rem;background: #EA3844;border-radius: .44rem;margin:.25rem .3rem .25rem 0;text-align: center;font-size: .38rem;font-weight: 500;color: #FFF;cursor: pointer;border:0;outline: none;}
.select_payment_btn:disabled{background: #F5A4A9;}

.select_wrokbook_title{width: 100%;height: .5rem;line-height: .5rem;}
.select_wrokbook_title p{font-size: .36rem;font-weight: 500;color: #333;}
.select_wrokbook_title p span{font-size: .28rem;font-weight: 400;color: #CCC;}
.select_wrokbook_content{width: 100%;height: auto;margin:.3rem auto 0 auto;overflow: hidden;}
.select_wrokbook_content_tit{width: calc(100% - 0.04rem);height: .78rem;background: #FFF;margin-bottom:.25rem;border: .02rem solid #EA3844;border-radius: .4rem;}
.select_wrokbook_content_tit ul li{float: left;width: 30%;height: .78rem;line-height:.78rem;font-size: .32rem;font-weight: 400;color: #EA3844;text-align: center;border-radius: .39rem;}
.select_wrokbook_content_tit ul li+li{margin-left: 5%;}
.select_wrokbook_content_tit ul li.ton{background: #EA3844;color: #fff;position: relative;}
.select_wrokbook_content_tit ul li.ton::before{content: '';width: 0;height: 0;border-left: .2rem solid transparent;border-right: .2rem solid transparent;border-top: .2rem solid #EA3844;position: absolute;bottom: -.14rem;left: 50%;transform: translateX(-50%);}

.select_dlist_box{width: 100%;padding-top: 0.16rem;height: auto;overflow: hidden;}
.select_dlist_box2,.select_dlist_box3{display: none;}
.select_dlist_box ul li{float: left;width: auto;height: .68rem;padding: 0 .24rem;margin-right: .14rem;margin-bottom:.16rem;background: #FFFFFF;box-sizing:border-box;border: .02rem solid #EA3844;border-radius: .34rem;text-align: center;font-size: .28rem;font-weight: 400;color: #EA3844;line-height: .68rem;position: relative;}
.select_dlist_box ul li input{position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;cursor: pointer;}

/* 选中的元素添加一个 √ 的箭头 */
/* #select_tlist_ul li.ok::after, */
.select_dlist_box li input:checked + .select_dlist_name::after{
  content: '';
  position: absolute;
  display:inline-block;
  width:.28rem;
  height: .28rem;
  bottom: 0.04rem;
  right: 0.04rem;
  background: url(https://img.sharingschool.com/activity/images/select_tick.png?v=2) no-repeat center/ 100% 100%;
  z-index: 2;
}

/* 支付成功页面 */
.wrap_success{width: 100%;height: 100%;background: #EA3844;left: 0;top: 0;display: none;}
.success_toppic{width:5.98rem;height:3.75rem;margin:0 auto;background:url(https://img.sharingschool.com/activity/images/success_top.png?v=2) no-repeat center/ 100% 100%;position: relative;}
.success_toppic_tick{width: .77rem;height: .67rem;background:url(https://img.sharingschool.com/activity/images/success_tick.png?v=2) no-repeat center/ 100% 100%;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.success_toppic p{width: 100%;height: .4rem;line-height:.4rem;font-size: .33rem;font-weight: 500;color: #FFF;text-align: center;position: absolute;left: 50%;top: 66%;transform: translate(-50%, -50%);}
.success_baibox{width: 6.63rem;height: 6.17rem;padding-top:.5rem;margin:0 auto;background: #FFF;border-radius: .2rem;}
.success_next_text1{width: 100%;height: .5rem;font-size: .4rem;font-weight: 500;color: #313131;line-height: .5rem;text-align: center;}
.success_next_text2{width: 100%;height: .5rem;margin-top:.17rem;font-size: .4rem;font-weight: bold;color: #313131;line-height: .5rem;text-align: center;}
.success_next_ercode{width: 2.6rem;height: 2.6rem;margin:0 auto;margin-top:.51rem;text-align:center;line-height:2.68rem;overflow:hidden;}
.success_next_ercode img{width: 100%;-webkit-touch-callout: none;}
.success_next_text3{width: 100%;height: .5rem;margin-top:.5rem;font-size: .38rem;font-weight: bold;color: #EA3844;line-height: .5rem;text-align: center;}

@media screen and (max-width:320px){
    html{font-size:10px;}
}
@media screen and (min-width:321px)and(max-width:750px){
    html{font-size:12px;}
}
@media screen and (min-width:751px){
    html{font-size:14px;}
}