@charset "utf-8";
/* CSS Document */

*{margin:0; padding:0;}

img {
    vertical-align: middle;
	max-width:100%
}

html,body {font-family: 'Nunito';font-size:16px;width:100%;height:100%;}

.fl {float:left;}
.fr {float:right;}

.bgf{background-color:#fff;}
.bgblue{background-color:#1479c7;}
.bgred{background-color:#e64f3f;}
.bg-yellow{background-color:#f7be0c;}
.bggray{background-color:#cecece;}
.bggray2{background-color:#f5f4f4;}

.clf{color:#fff;}
.clblue{color:#1479c7;}
.clred{color:#e64f3f;}
.cloyellow{color:#f7be0c;}
.clorange{color:#f78b0c;}
.clgray{color:#cecece;}

.pt12{padding-top:12px;}
.pt24{padding-top:24px;}
.pb12{padding-bottom:12px;}
.pb24{padding-bottom:24px;}
.pl12{padding-left:12px;}
.pl24{padding-left:24px;}
.pr12{padding-right:12px;}
.pr24{padding-right:24px;}

.mt12{margin-top:12px;}
.mt24{margin-top:24px;}
.mb12{margin-bottom:12px;}
.mb24{margin-bottom:24px;}
.ml12{margin-left:12px;}
.ml24{margin-left:24px;}
.mr12{margin-right:12px;}
.mr24{margin-right:24px;}

.shadow{box-shadow:0px 0px 5px 1px #2626262b}

.s1407-full{width:100%;height:auto}
.s1407-center{width:100%;max-width:1200px;margin:auto;}

.share span{line-height: 46px;text-align:center;font-size:16px;background-size:contain;background-position:center;}
.span1 {width:90px;height:46px;background:url(../img/share.png);display:inline-block;padding-left:20px;background-repeat: no-repeat;color:#fff;float:right;}
.span2 {width:46px;height:46px;background:url(../img/share2.png);display:inline-block;background-repeat:no-repeat;color:#2a4a8a;float:right;}

.s1407-top-action{width:calc(100% - 348px);padding:0px 12px;}
.s1407-top-action li{list-style:none}
.s1407-top-action li a{padding:12px;display:inline-block;text-decoration:none;font-family: 'Roboto Slab';color:#e3684c;}
.s1407-top-action li img{transform:translateY(-2px);margin-right:6px;}

.s1407-banner{width:100%;height:auto;position:relative;background-image:url(../img/bg-banner.png);background-size:cover;overflow:hidden;text-align:center}
.btn-style{padding:8px 32px;display:inline-block;border-radius:100px;text-align:center;font-family: 'Roboto Slab';font-weight:700;text-decoration:none;font-size:50px;text-transform:uppercase;margin:24px auto}
.btn-good-news{border:3px solid #c83626;border-bottom:5px solid #c83626;color:#fff;}

.m-banner{display:none;}

.btn-edit{color:#8b8a8a;border:3px solid #cecece!important;border-bottom:5px solid #cecece!important;}

.s1407-video{background-image:url(../img/bg-video.png);background-size:cover;text-align:center}
.s-video{width:calc(60% - 24px);padding:24px 12px;margin:auto;position:relative}
.btn-video{display:block;}

.video{overflow:hidden;padding-bottom:56.25%;position:relative;height:0;}
.video iframe{left:0;top:0;height:100%;width:100%;position:absolute;}
.s-heading{padding:8px 12px;display:block;width:calc(100% - 24px);max-width:500px;margin:auto;position:relative;border-radius:0px 0px 100px 100px;font-family: 'Roboto Slab';text-align:center}

.btn-next{position:absolute;right:-40px;top:50%;transform:translateY(-50%)}
.btn-preview{position:absolute;left:-40px;top:50%;transform:translateY(-50%) rotate(180deg);}
.s-video a{opacity:0.5}  .s-video a:hover{opacity:1}

.bg-comment{background-image:url(../img/bg-comment.png);background-size:cover;overflow:hidden;background-position:bottom}
.s-list-comment{width:100%;height:auto}
.s-list-comment li{width:calc(50% - 36px);margin:12px;padding:6px;float:left;background-color:#fff;border-radius:200px;list-style:none;position:relative}
.avt-student{width:173px;height:173px;border-radius:50%;background-color:#f1f1f1;overflow:hidden}

.td-navbar-signup {position:relative;}
.td-navbar-signup ul{margin-top:8px;}
.td-navbar-signup ul li {float:left;padding-top:7px;}
.td-navbar-signup ul li a {padding:0px 7px;color:#3e508a;font-weight:bold;display:inline-block}
.fa-angle-double-down {color:#94bf00;}
.fa-globe {color:#3e508a;}
.td-navbar-signup ul li span {color:#ff6c5e;padding-left:5px;}
.avt-signup {width:29px;height:29px;float:left;margin-top:-5px;border-radius:50%;border:1px solid #e0e0e0;}
.avt-signup img {width:25px;height:25px;border-radius:50%;margin:2px;transform:translateX(0px)!important;}
.top-angle {position:absolute;top:25px;left:60px;visibility:hidden;opacity:0;z-index:10002;}
.top-angle img{width:100%!important;}
.td-navbar-signup ul li:hover .top-angle{visibility:visible;top:34px;opacity:1;width:16px;}
.top-angle i {color:#e0e0e0;font-size:16px;}
.td-info-acount {width:305px;height:auto;border-radius:5px;border:1px solid #e0e0e0;position:absolute;z-index:10001;background:#fff;top:52px;visibility:hidden;-webkit-transition:all ease 0.1s;opacity:0;}
.td-navbar-signup ul li:hover .td-info-acount{visibility:visible;top:47px;opacity:1;}
.info-acount-container {width:275px;height:auto;margin:15px;overflow:hidden}
.select-info-acount{width:calc(100% - 86px)}
.img-acount {width:86px;height:86px;margin-top:5px;}
.img-acount img {width:86px;height:86px;border-radius:50%;overflow:hidden}
.select-info-acount i {padding-right:0px;color:#3e508a;padding-left:10px;}
.select-info-acount ul{margin-top:0px!important;}
.select-info-acount ul li a {font-weight:400;}
.select-info-acount ul li img{width:6px;}

.td-button-acount {width:275px;height:auto;margin:12px 15px;}
.td-button-acount a {padding:7px 0px!important;border-radius:5px;width:100px;display:inline-block;text-align:center;}
.td-button-acount .td-button-add {background-color:#529839;color:#fff;}
.td-button-acount .td-button-out {background-color:#e0e0e0;color:#666;}

.info-student{width:calc(100% - 221px);padding:24px;}

.s-update-slide{width:calc(100% - 24px);padding:0px 12px;overflow:hidden}
.s-update-cm{width:2000px;}
.s-update-cm li{float:left;list-style:none;padding:12px 24px;color:#fff;}
.s-center{text-align:center;}

.s-tap-action{width:calc(100% - 24px);padding:0px 12px;}
.s-tap-action li{float:left;list-style:none;position:relative;vertical-align:bottom;}
.s-tap-action li a{padding:8px 24px;display:inline-block;border-radius:5px 5px 0px 0px;background-color:#cecece;border-top:4px solid #c1bfbf;text-decoration:none;color:#fff;}
.active{padding-top:14px!important;background-color:#f7a10c!important;border-top:4px solid #ea930b!important;}

.pc-list-user{width:100%;text-align:center;border-collapse:collapse;}
.pc-list-user th,tr{border:1px solid #e1e1e1;padding:6px;}
.pc-list-user td{padding:12px;border:1px solid #e1e1e1;}

.gift{width:40px;}
.name{padding:12px;}

.avt-user{width:45px;height:45px;overflow:hidden;border-radius:50%;display:inline-block;}

.next-list-user{width:100%;height:auto;position:relative}
.s-next{display: flex;
    justify-content: center;
    align-items: center;}
.s-next li{float:left;list-style:none;margin:12px 0px;}
.s-next li a{padding:12px;text-decoration:none;font-weight:800;color:#aaa;}
.cl-active{color:#262626!important;}

.s-end{background-image:url(../img/bg-banner.png);background-size:cover;background-position:bottom;overflow:hidden}
.s1407-col{width:calc(50% - 24px);margin:24px 12px;}
.s1407-col h1{font-size:36px;text-transform:uppercase;font-family: 'Roboto Slab';}
.s1407-col h3{font-size:24px;text-transform:uppercase;font-family: 'Roboto Slab';}

.s1407-col ul li{list-style:none;margin-top:12px;text-transform:uppercase}
.s1407-col ul li img{margin-right:6px;}

.btn-more{color:#fff;border:3px solid #0d62a4!important;border-bottom:5px solid #0d62a4!important;font-family: 'Nunito';font-size:24px;}
.btn-more p{font-size:14px;}

.m-table{display:none}

.info-user{width:80px;}

.morer-user{padding:8px 0px;display:block;border-radius:100px;text-align:center;width:calc(100% - 24px);margin:12px;}

.s1407-opacity{position:fixed;width:100%;height:100%;background-color:#000000cf;top:0px;visibility:hidden;}
.s1407-opacity-show{visibility:visible;}

.s1407-popup{position:fixed;width:50%;height:auto;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);z-index:9999;border-radius:15px;visibility:hidden;-webkit-transition:all ease 0.3s;overflow:hidden}
.s1407-popup-show{visibility:visible;transform:translate(-50%,-50%) scale(1);-transition:all ease 0.3s;}

.close-pop{position:absolute;top:12px;right:12px;}
.s1407-popup h3{text-align:center;text-transform:uppercase;color:#fff;background-color:#1479c7;padding:12px;}

.form-popup{width:calc(100% - 24px);padding:12px;}

.input-style{width:calc(100% - 24px);padding:12px;display:block;border-radius:5px;border:1px solid #e1e1e1;margin:12px 0px;}

.bd1{border:1px solid #e64f3f}

.list-input li{float:left;width:calc(25% - 12px);margin-right:12px;list-style:none;}
.list-input li:nth-child(4){margin-right:0px!important;}
.style4{width:calc(50% - 130px)!important;}
.form-popup textarea{width:calc(100% - 24px);padding:12px;border-radius:5px;border:1px solid #e1e1e1;height:80px}

.style1{width:calc(100% - 132px)!important;}
.style2{width:120px!important;margin-right:0px!important;}
.style2 strong{padding:10px;background-color:#000;display:block;margin:12px 0px;border-radius:5px;text-align:center;color:#fff;}
.style3{text-align:right;margin:6px;width:106px!important;
}
.style3 strong{padding:12px 0px;display:block}

.list-score{width:100%!important;display:block;position:relative;overflow:hidden}
.list-score li{float:left;list-style:none;width:97px;padding-right:12px;}


@media screen and (max-width: 960px){.avt-student{width:88px;height:88px;position:absolute;top:50%;transform:translateY(-50%)} .info-student{width:calc(100% - 112px);padding:6px;}
.btn-signin span{display:none!important;}
}

@media screen and (max-width: 768px) {.btn-call{display:none!important;} 
.m-banner{display:block}	.pc-banner{display:none}
.btn-style{padding:8px 24px;font-size:24px;margin:12px auto}
.s-video{width:calc(80% - 24px);padding:12px;margin:auto;}
.btn-next img{width:32px;}  .btn-next{right:-26px;}
.btn-preview img{width:32px;}  .btn-preview{left:-26px;}
.s-list-comment li{width:calc(100% - 36px);}
.s1407-col{width:calc(100% - 24px)}

.m-table{display:block}
.pc-table{display:none}
.s1407-popup{width:calc(100% - 24px);}
.form-popup textarea{height:40px}
.form-popup ul li{float:left;width:calc(25% - 6px);margin-right:0px;list-style:none;}
.style2 strong{padding:10px 0px;margin:6px 0px;}
.form-popup{max-height:280px;overflow:auto;}
.style3{width:100%!important;text-align:left}
.style3 strong{padding:0px;display:block}
.style4{width:100%!important;}
.style2{padding:6px;}

.style4 .input-style{margin:0px;}

.td-border2{display:none!important;}
.top-angle{left:8px!important;}
.td-info-acount{position:fixed;right:6px;}
.list-score{padding-top:12px;}
}

@media screen and (max-width: 640px) {.btn-signin img{margin-right:0px!important;}
.span2{display:none;}
.s1407-top-action {width: calc(100% - 302px);}

}

@media screen and (max-width: 480px){.span1{width:64px;} .logo{width:100px;padding-top:6px;} .s1407-top-action {width: calc(100% - 232px);}}

@media screen and (max-width: 420px){.s1407-top-action li a{padding:12px 6px;} .s1407-top-action{width: calc(100% - 220px);padding:0px 6px;} 
.avt-student{width:66px;height:66px}  .info-student{width:calc(100% - 84px);padding:6px;}
.s-list-comment li{border-radius:30px}
.s-heading{font-size:16px;}
}

@media screen and (max-width: 360px){.btn-style{padding:8px 24px;font-size:16px;margin:12px auto;border:2px solid #c83626;border-bottom:4px solid #c83626;}}

@media screen and (max-width: 335px){.btn-rules span{display:none}.s1407-top-action li a {padding:12px 6px;}}