@charset "utf-8";

/* 公用样式 */
* {
    padding               : 0;
    margin                : 0;
    -webkit-box-sizing    : border-box;
    -moz-box-sizing       : border-box;
    box-sizing            : border-box;
    -webkit-font-smoothing: antialiased;
    font-smoothing        : antialiased;
}

*:not(input) {
    -webkit-user-select: none;
    -moz-user-select   : none;
    -ms-user-select    : none;
    user-select        : none;
}

html {
    font-family: "SF Pro Display", "PingFang SC", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

a {
    text-decoration: none;
}

.swiper-pagination-bullets {
    bottom: 0 !important;
}

.swiper-pagination-bullet {
    width     : 0.08rem;
    height    : 0.08rem;
    background: #FA4B7E;
    opacity   : 1;

}

.swiper-pagination-bullet-active {
    background   : #FA4B7E;
    width        : 0.2rem !important;
    height       : 0.08rem;
    border-radius: 0.04rem;
}

.title {
    text-align : center;
    color      : #333333;
    font-size  : 0.34rem;
    font-weight: bold;
    line-height: 0.88rem;
}

.title .title-icon {
    display            : inline-block;
    vertical-align     : middle;
    width              : 0.16rem;
    height             : 0.18rem;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
}

.title .title-left {
    background-image: url(../img/title_left.png);
}

.title .title-right {
    background-image: url(../img/title_right.png);
}

.title .red {
    color: #FA4B7E;
}

.sub-title {
    text-align: center;
    font-size : 0.24rem;
    color     : #666666;
    margin-top: -0.2rem;
}

.cover {
    display         : none;
    position        : fixed;
    left            : 0;
    top             : 0;
    right           : 0;
    bottom          : 0;
    z-index         : 100;
    padding-top     : 40vh;
    background-color: rgba(0, 0, 0, .2);
}

.cover .label {
    text-align           : center;
    margin               : 0 auto;
    width                : 66.67vw;
    height               : 12vw;
    display              : flex;
    font-size            : 4.27vw;
    justify-content      : center;
    align-items          : center;
    background-color     : rgba(0, 0, 0, .5);
    color                : #fff;
    -webkit-border-radius: 6vw;
    -moz-border-radius   : 6vw;
    border-radius        : 6vw;
}

.loading {
    display         : none;
    position        : fixed;
    left            : 0;
    top             : 0;
    right           : 0;
    bottom          : 0;
    z-index         : 100;
    padding-top     : 40vh;
    background-color: rgba(0, 0, 0, .2);
}

.loading::after {
    display                : block;
    content                : '';
    position               : absolute;
    width                  : 12vw;
    height                 : 12vw;
    top                    : 50%;
    left                   : 50%;
    margin-left            : -6vw;
    margin-top             : -6vw;
    background             : url(../img/loading.png) no-repeat center;
    -webkit-background-size: contain;
    background-size        : contain;
    -webkit-animation      : loading 1s ease infinite;
    animation              : loading 1s ease infinite;
}

.success-ctn {
    position        : fixed;
    left            : 0;
    top             : 0;
    right           : 0;
    bottom          : 0;
    background-color: rgba(0, 0, 0, .2);
    display         : flex;
    justify-content : center;
    align-items     : center;
    z-index         : 10;
}

.bg-ctn {
    position             : relative;
    -webkit-border-radius: 10px;
    -moz-border-radius   : 10px;
    border-radius        : 10px;
    background-color     : #fff;
    width                : 300px;
    height               : 330px;
    padding              : 40px 50px 80px;
    text-align           : center;
    line-height          : 1.2;
}

.close-tag {
    position               : absolute;
    top                    : -11px;
    right                  : -11px;
    width                  : 23px;
    height                 : 23px;
    background             : url(../img/close-tag.png) no-repeat center;
    -webkit-background-size: contain;
    background-size        : contain;
}

.mb {
    margin-bottom: 0.8rem !important;
}

/* header */
.web-head {
    margin         : 0.2rem 0.3rem;
    display        : flex;
    justify-content: space-around;
    align-items    : center;
}

.web-head .logo {
    width              : 1.41rem;
    height             : 0.4rem;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
    background-image   : url(../img/logo.png);
}

.web-head .list {
    width              : 0.34rem;
    height             : 0.32rem;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
    background-image   : url(../img/list.png);
}

.web-head a {
    width        : 1.5rem;
    height       : 0.6rem;
    background   : rgba(48, 163, 255, 1);
    border-radius: 0.3rem;
    font-size    : 0.28rem;
    color        : #ffffff;
    text-align   : center;
    line-height  : 0.6rem;
}

a.login {
    margin-left: 1.5rem;
}

a.download {
    background-color: #FA4B7E;
    margin          : 0 0.3rem;
}

/* banner */
.swiper-banner .slide-img {
    width  : 6.9rem;
    height : 4rem;
    display: block;
    margin : 0 auto;
}

.swiper-banner .swiper-pagination-bullet {
    width     : 0.08rem;
    height    : 0.08rem;
    background: #ffffff;
    opacity   : 1;
}

.swiper-banner .swiper-pagination-bullet-active {
    background   : #ffffff;
    width        : 0.2rem;
    height       : 0.08rem;
    border-radius: 0.04rem;
}

/* sign */
.sign-container {
    width        : 6.9rem;
    height       : 4.6rem;
    background   : rgba(255, 255, 255, 1);
    box-shadow   : 0 0 0.12rem 0 rgba(0, 0, 0, 0.08);
    border-radius: 0.04rem;
    margin       : 0.4rem auto 0;
}

.registered-btn {
    display      : block;
    width        : 5.7rem;
    height       : 0.8rem;
    margin       : 0 auto 0.2rem;
    background   : rgba(249, 249, 249, 1);
    border-radius: 0.4rem;
    border       : none;
    color        : #999999;
    font-size    : 0.28rem;
    font-weight  : 400;
    padding-left : 0.4rem;
}

.tel {
    display        : flex;
    align-items    : center;
    justify-content: center;
    margin-bottom  : 0.2rem;
}

.tel input {
    width                    : 3.7rem;
    height                   : 0.8rem;
    background               : rgba(249, 249, 249, 1);
    border-bottom-left-radius: 0.4rem;
    border-top-left-radius   : 0.4rem;
    border                   : none;
    color                    : #999999;
    font-size                : 0.28rem;
    font-weight              : 400;
    padding-left             : 0.4rem;
}

.tel a {
    width        : 2rem;
    height       : 0.8rem;
    line-height  : 0.8rem;
    background   : rgba(250, 75, 126, 1);
    border-radius: 0 0.4rem 0.4rem 0;
    color        : #ffffff;
    font-size    : 0.28rem;
    text-align   : center;
}

.sign {
    display      : block;
    margin       : 0 auto 0.2rem;
    width        : 5.7rem;
    height       : 0.8rem;
    line-height  : 0.8rem;
    background   : rgba(250, 75, 126, 1);
    border-radius: 0.4rem;
    color        : #FFFFFF !important;
    font-size    : 0.34rem;
    text-align   : center;
    font-weight  : 600;
}

.get-sign {
    text-align: center;
    color     : #999999;
    font-size : 0.24rem;
}

.get-sign a {
    color: #FA4B7E;
}

/* why-oral-class */
.swiper-why-oral-class .title {
    text-align : center;
    font-size  : 0.35rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: bold;
    color      : rgba(51, 51, 51, 1);
}

.swiper-why-oral-class .sub-title {
    font-size    : 0.25rem;
    font-family  : PingFangSC-Regular, PingFang SC;
    font-weight  : 400;
    color        : rgba(102, 102, 102, 1);
    margin-bottom: 0.2rem;
}

.swiper-why-oral-class .swiper-slide {
    width       : 3.23rem !important;
    margin-right: 0.32rem;
}

.swiper-why-oral-class .swiper-slide p {
    text-align : center;
    font-size  : 0.23rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: bold;
    color      : rgba(51, 51, 51, 1);
    margin-top : 0.1rem;
}

.swiper-why-oral-class .swiper-slide img {
    width: 100%;
}

/* slidedown */
.slidedown {
    margin-top: 0.3rem;
    display   : none;
}

.slidedown .active {
    background-color: #30A3FF;
    color           : #ffffff;
}

.slidedown a {
    display         : inline-block;
    width           : 2.1rem;
    height          : 0.6rem;
    line-height     : 0.6rem;
    text-align      : center;
    font-size       : 0.28rem;
    background-color: #EEEEEE;
    color           : #999999;
    margin          : 0 0 0.3rem 0.3rem;
    border-radius   : 0.3rem;
}

/* textbook */
.textbook-img {
    width              : 6.9rem;
    height             : 2.7rem;
    margin             : 0 auto;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
}

.textbook-img-1 {
    background-image: url(https://qn-static.landi.com/uploadtool1416137df504c8085222e557a13bfab7.png);
}

.textbook-img-2 {
    background-image: url(https://qn-static.landi.com/uploadtoole39b9524776c4a7e02a84486953afd9b.png);
}

.textbook-img-3 {
    background-image: url(https://qn-static.landi.com/uploadtool16c59e84184f587f4d8d4de873df63d6.png);
}

.textbook-img-4 {
    background-image: url(https://qn-static.landi.com/uploadtoolab615104088557cb43b0a38311ce6342.png);
}

.textbook-container .swiper-wrapper {
    padding-bottom: 0.42rem;
    margin-top    : 0.21rem;
}

.textbook-text {
    width        : 6.9rem;
    background   : #F9F9F9;
    margin       : 0 auto;
    border-radius: 0px 0px 0.04rem 0.04rem;
    padding      : 0 0.21rem;
}

.textbook-text h2 {
    font-size  : 0.3rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: bold;
    color      : rgba(51, 51, 51, 1);
}

.textbook-text p {
    font-size  : 0.25rem;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color      : rgba(102, 102, 102, 1);
    line-height: 0.315rem;
}

/* teacher */
.card-list {
    display    : flex;
    align-items: center;
    margin     : 0.2rem 0.3rem 0;
    background : #F9F9F9;
}

.card-img {
    width              : 1.25rem;
    height             : 1.25rem;
    margin             : 0.2rem 0.2rem;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
}

.card-text {
    flex: 1;
}

.card-text .big {
    color      : #333333;
    font-size  : 0.28rem;
    font-weight: bold;
    margin-top : 0.2rem;
}

.card-text .small {
    font-size    : 0.22rem;
    color        : #666666;
    line-height  : 0.3rem;
    margin-bottom: 0.2rem;
}

.teachers-container .card-teacher-1 {
    background-image: url(https://qn-static.landi.com/uploadtool15df96c4b90d10b41d8e03eb6ddfe4a0.png);
}

.teachers-container .card-teacher-2 {
    background-image: url(https://qn-static.landi.com/uploadtoola9ca9b2f00379d5b031b14d4e4b8204b.png);
}

.teachers-container .card-teacher-3 {
    background-image: url(https://qn-static.landi.com/uploadtool7777db0ac201da4af9f51b7bfa481179.png);
}

.teachers-container .card-teacher-4 {
    background-image: url(https://qn-static.landi.com/uploadtool5651ff10abb1225e2ef0e936cad0270c.png);
}

/* supplement */
.supplement-container .items-imgs {
    display        : flex;
    justify-content: space-between;
    margin         : 0.2rem 0.3rem;
}

.supplement-container .items-imgs>div {
    width              : 2.2rem;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
}

.supplement-container .items-imgs>div>div {
    width : 100%;
    height: 2.5rem;
}

.supplement-container .img-1 {
    background-image: url(https://qn-static.landi.com/uploadtool9884ff62877a503b79120d6a7cf44858.png);
    background-size : contain;
}

.supplement-container .img-2 {
    background-image: url(https://qn-static.landi.com/uploadtool1a70f13326582fb6e4f03fcb965f62e8.png);
    background-size : contain;
}

.supplement-container .img-3 {
    background-image: url(https://qn-static.landi.com/uploadtool314fdfb15c7e68591384c3a97f8cd8ce.png);
    background-size : contain;
}

.supplement-container .items-imgs p {
    font-size  : 0.2rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: bold;
    color      : rgba(51, 51, 51, 1);
    text-align : center;
}


/* energy-ring */
.energy-ring-container .energy-ring-img {
    margin          : 0.21rem 0.315rem;
    margin-bottom   : 0;
    height          : 3.4rem;
    background-image: url(https://qn-static.landi.com/uploadtooldb7393d6fb1c3365defd1efebc5f6af6.png);
    background-size : contain;
}

.energy-ring-container .energy-ring-text {
    margin     : 0.21rem 0.315rem;
    margin-top : 0;
    padding    : 0.208rem 0.145rem;
    padding-top: 0;
    background : rgba(249, 249, 249, 1);
}

.energy-ring-container .energy-ring-text h1 {
    font-size  : 0.29rem;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: bold;
    color      : rgba(51, 51, 51, 1);
    padding-top: 0.208rem;
}

.energy-ring-container .energy-ring-text p {
    font-size  : 0.2;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color      : rgba(102, 102, 102, 1);
}

/* parents */
.swiper-parents .swiper-slide {
    width       : 3.833rem;
    height      : 5.201rem;
    margin-right: 0.315rem;
}

.swiper-parents .swiper-slide>div {
    width : 100%;
    height: 100%;
}

.swiper-parents .dialogue-img-1 {
    background-image: url(https://qn-static.landi.com/uploadtool96a90830458eaa03d25b3d5145f32ae8.png);
    background-size : contain;
}

.swiper-parents .dialogue-img-2 {
    background-image: url(https://qn-static.landi.com/uploadtoold01b5f56bb3a04c65d1dd3dadba6de11.png);
    background-size : contain;
}

.swiper-parents .dialogue-img-3 {
    background-image: url(https://qn-static.landi.com/uploadtoola155589ffaccf7ca9217ceea059ccb19.png);
    background-size : contain;
}

/* remark */
.remark p {
    font-size    : 0.2rem;
    padding      : 0 0.3125rem;
    font-family  : PingFangSC-Regular, PingFang SC;
    font-weight  : 400;
    color        : rgba(102, 102, 102, 1);
    line-height  : 0.26rem;
    margin-bottom: 0.52rem;
}

/* footer */
.footer {
    background-color: #272727;
    font-size       : 10px;
    text-align      : center;
    padding-bottom  : 1.4rem;
    color           : #999;
}

.footer p {
    line-height: .35rem;
}

.pages {
    display        : flex;
    justify-content: center;
}

.pages a {
    color          : #999;
    text-decoration: underline;
}

.pages a+a {
    margin-left: 0.25rem;
}

/* fixed */
.fixed {
    position               : fixed;
    z-index                : 10;
    bottom                 : 0;
    left                   : 0;
    width                  : 7.5rem;
    height                 : 1.4rem;
    background             : url(../img/banner.png) no-repeat center;
    -webkit-background-size: contain;
    background-size        : contain;
    -webkit-transition     : transform .3s ease;
    -moz-transition        : transform .3s ease;
    transition             : transform .3s ease;
    display                : none;
}

/* download */
.header-img {
    width : 7.5rem;
    height: 6rem;
}

.app-download {
    display      : block;
    width        : 3rem;
    height       : 0.9rem;
    background   : rgba(250, 75, 126, 1);
    border-radius: 0.45rem;
    text-align   : center;
    margin       : 0.8rem auto 0.3rem;
    color        : #fff;
    font-size    : 0.28rem;
    line-height  : 0.9rem;
}

.header p {
    text-align: center;
    color     : #333333;
    font-size : 0.26rem;
}

.underline {
    width     : 6.9rem;
    height    : 0.01rem;
    background: #E6E6E6;
    margin    : 0.4rem auto 0;
}

/* general */
.swiper-general {
    margin-top : .35rem;
    margin-left: .1rem;
}

.tip {
    color        : #3A3A3A;
    font-size    : 0.3rem;
    line-height  : 0.4rem;
    margin-left  : .2rem;
    margin-bottom: .3rem;
}

.swiper-general .swiper-slide {
    width              : 3rem;
    height             : 5.33rem;
    margin-left        : .2rem;
    background-repeat  : no-repeat;
    background-size    : cover;
    background-position: center;
}

.general-1 {
    background-image: url(../img/general_1.png);
}

.general-2 {
    background-image: url(../img/general_2.png);
}

.general-3 {
    background-image: url(../img/general_3.png);
}

.general-4 {
    background-image: url(../img/general_4.png);
}

.info {
    margin-top: .35rem;
}

.detail {
    width             : 6.9rem;
    height            : 1.23rem;
    margin            : 0 auto;
    color             : #3A3A3A;
    font-size         : .26rem;
    line-height       : .41rem;
    display           : -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow          : hidden;
}

.info .active {
    width      : 6.9rem;
    height     : 8.56rem;
    margin     : 0 auto;
    color      : #3A3A3A;
    font-size  : .26rem;
    line-height: .41rem;
}

.more {
    color     : #FA4B7E;
    text-align: right;
    font-size : .26rem;
    margin    : .1rem .2rem 0 0;
}

.info .record {
    margin: .5rem 0;
}

.record p {
    color     : #999999;
    font-size : .2rem;
    text-align: center;
}