*{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}
@font-face{font-family:Nunito;src:url(../../../font/Nunito-Regular.woff2) format('woff2');font-weight:400;font-style:normal}
@font-face{font-family:NunitoBold;src:url(../../../font/Nunito-Black.woff2) format('woff2');font-weight:700;font-style:normal}
@font-face{font-family:Junegull;src:url(../../../font/junegull.woff2) format("woff");font-weight:700;font-style:normal}
section{padding:40px 0}
b{font-family: NunitoBold;}
body,html{font-size:18px;color:#262626;font-family:Nunito,sans-serif}
h3 span,h3.title{font-family:Junegull;text-align:center;font-size:50px!important}
#demoLesson .title h3,h3.title:not(.edu-section h3.title,.sliderMsg h3.title){color:#7e4ed4}
.sliderMsg h3.title{color:#fff;text-shadow:0 2px #8e8e8e}
.edu-section h3.title{margin-bottom:24px;color:#fbe142}
.container{max-width:1200px;margin:0 auto;padding:0 15px}
#normalHeader.png{background:bottom left/30% no-repeat url(../img/cloud-left.webp),bottom right/40% no-repeat url(../img/cloud-right.webp),top center/cover no-repeat url(../img/backgroundPC.png)}
#normalHeader.webp{background:bottom left/30% no-repeat url(../img/cloud-left.webp),bottom right/40% no-repeat url(../img/cloud-right.webp),top center/cover no-repeat url(../img/backgroundPC.webp)}
#normalHeader .header>div>ul .hotline a{background:no-repeat left url(../img/hotline-icon.png)}
#normalHeader .header>div>ul .loginGroup .login a:first-child{background:no-repeat left url(../img/user-icon.png)}
#normalHeader .header ul .hotline a,#normalHeader .header>div>ul .loginGroup .login>a{color:#026ddb}
#normalHeader .header{background:#fff;border-bottom:1px solid #dcdcdc}
#normalHeader .header>div>ul .logo{background:0 0}
#normalHeader .wrapperBanner{align-items: flex-start;}
#normalHeader .wrapperBanner .headerForm .formTitle{color:#8854da;font-size:18px;font-weight:700}
#normalHeader .wrapperBanner .headerForm{background:rgba(255,255,255,.622);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
#normalHeader .wrapperBanner .headerForm form input,#normalHeader .wrapperBanner .headerForm form select,#normalHeader .wrapperBanner .headerForm form textarea{border:1px solid #6e55b059;background:#fff}
#normalHeader .wrapperBanner .headerForm form>div .btnHeaderFormSubmit{font-size:18px;padding:12px 30px;background:#f4524f;color:#fff;border-color:#b30101}
#videoLeftStyle3 .wrapperVideo{background:#424242}
.intro{background:top left/30% url(../img/texture-intro.png)}
.edu-section{background:no-repeat bottom left/20% url(../img/cloud-left.webp),no-repeat bottom right/20% url(../img/cloud-right.webp),#7e4ed4}
.edu-section .edu-list{display:flex;justify-content:space-between;align-items:center;gap:12px}
.edu-section .edu-item{width:34.33%;max-width:383px;position:relative;padding:30px 0 55px}
.edu-section .card{width:90%;height:100%;background:#ff7a89;position:absolute;top:0;left:24px;border-radius:0 30px 0 30px;z-index:2;border:3px solid #22222a}
.edu-section .edu-item .edu-title,.edu-section .edu-item img{position:relative;z-index:4}
.edu-section .edu-item img{width:92%;border:3px solid #22222a;background:#fbe142;border-radius:20px;margin-bottom:10px}
.edu-section .edu-item .edu-title{width:92%;text-align:center;font-size:23px;color:#fff;font-family:Junegull;font-weight:900;background:#91e1ff;padding:12px 0;clip-path:polygon(0 0,90% 0,100% 50%,90% 100%,0 100%);border-left:3px solid #22222a;}
.edu-section .edu-desc{text-align:center;font-size:20px;font-style:italic;color:#fff;font-weight:700;margin-top:20px}
.samQuangCao{background:top left/30% url(../img/texture-intro.png);overflow:hidden}
.samQuangCao .wrap{position:relative}
.samQuangCao .sam{width:90%;max-width:400px;margin:0 auto;display:block}
.samQuangCao .desc-left,.samQuangCao .desc-right{position:absolute;top:0;list-style:none;width:327px;height:100%;display:grid;align-items:center}
.samQuangCao .desc-left{left:0}
.samQuangCao .desc-right{right:55px}
.samQuangCao .wrap ul li{text-align:center;background:#6d5993ed;color:#fff;border-radius:15px;width:100%;height:124px;font-size:20px;place-content:center;padding:0 12px}
.samQuangCao .desc-left li:nth-child(1),.samQuangCao .desc-left li:nth-child(3){margin-left:55px}
.samQuangCao .desc-right li:nth-child(2){margin-left:55px}
.demoLesson{background:url(../img/texture-demo-lession.png),#fbdf4c}
#demoLesson .title>div{top:unset;bottom:0}
#demoLesson .title>div ul{position:absolute;background:#fff;border:1px solid #3d3d3d60}
#demoLesson .content{background:#fff4b0}
#demoLesson .content .lessons ul li a.active{background:#f7d21f}
#demoLesson .title>div>a{background:#533a82}
#demoLesson .title>div ul li a{color:#3d3d3d}
#demoLesson .title>div ul li a.active,#demoLesson .title>div ul li a:hover{background:#ffa126}
#listSubject .content>div ul li{margin:0}
#listSubject .content>div ul{gap:12px;margin-top:12px;margin-bottom:12px}
#listSubject .content>div ul li a{padding:5px 0;border-radius:99px;background:#fbdf4c}
#listSubject .content>div{padding:0;display:flex;flex-direction:column;gap:12px;background:0 0}
#listSubject .content>div>div{padding:12px;background:#7e4ed4;border-radius:10px}
.sliderMsg{position:relative;background:bottom left/30% no-repeat url(../img/cloud-left.webp),bottom right/40% no-repeat url(../img/cloud-right.webp),top 8% left/30% no-repeat url(../img/cloud.png),top 8% right/30% no-repeat url(../img/cloud.png),#91e1ff}
.sliderMsg .noteBook{position:absolute;z-index:1;max-width:600px;width:100%;bottom:48px;left:50%;margin-left:-400px;transform:rotate(-5deg);cursor:move}
.sliderMsg .wrapperContentSlider{z-index:3;width:100%;max-width:320px!important;text-align:center;margin:30px 0 0 50%;background:#058b8f;padding:5px 5px 2px;border:18px solid #00b3b8;border-radius:14px;position:relative}
.sliderMsg .wleft{position:relative;z-index:3}
.sliderMsg .bxsliderMsg{display:grid;margin:28px auto 0;text-align:center}
.sliderMsg img{cursor:move!important;max-width:301px;width:100%}
.baoChiNoiGi .achievement{margin-top:40px}

@media (max-width:991px){
#demoLesson .title h3{width: 100%;}
.edu-section .edu-item .edu-title{font-size:18px}
.samQuangCao .desc{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));justify-content:center;gap:12px}
.samQuangCao .desc-left,.samQuangCao .desc-right{position:static;gap:12px;margin:0 auto}
.samQuangCao .wrap ul li{margin:0!important;min-height:100px!important;height:auto}
}
@media all and (max-width:768px){
#normalHeader.png{background:bottom left/30% no-repeat url(../img/cloud-left.webp),bottom right/40% no-repeat url(../img/cloud-right.webp),top center/cover no-repeat url(../img/backgroundPC.png)}
#normalHeader.webp{background:bottom left/30% no-repeat url(../img/cloud-left.webp),bottom right/40% no-repeat url(../img/cloud-right.webp),top center/cover no-repeat url(../img/backgroundPC.webp)}
h3 span,h3.title{font-size:30px!important}
section{padding:20px 0}
.edu-list-wrapper{display:flex;justify-content:center}
.edu-list-wrapper .bx-wrapper{position:relative}
.edu-list-wrapper .bx-controls{position:absolute;top:50%;transform:translateY(-15%);width:100%}
.edu-list-wrapper .bx-controls-direction{display:flex;justify-content:space-between}
.edu-section .edu-desc{font-size:16px}
.samQuangCao .sam{width:50%}
.sliderMsg .wrapperContentSlider{margin:20px auto 0}
.sliderMsg{overflow:hidden}
.sliderMsg .noteBook{display:none}
}
@media (max-width:575px){
body,html{font-size:14px}
.edu-section .edu-desc{font-size:14px}
h3 span,h3.title{font-size:24px!important}
.samQuangCao .wrap ul li{font-size:14px}
.samQuangCao .sam{width:80%}
.samQuangCao .wrap ul li{min-height:80px!important}
}
@supports (-webkit-touch-callout: none) {
  /* CSS chỉ chạy trên iOS */
  select {
    height: 42px;
    font-size: 16px;
    padding: 12px;
  }
  @media (max-width:575px){
    select {
        font-size: 14px;
        padding: 12px;
        color: #262626;
    }
  }
}