.popup{width:100%;height:100vh;height:100dvh;z-index:-3;opacity:0;visibility:hidden;transition:opacity .2s cubic-bezier(0.2,0.4,0.6,1),visibility .2s cubic-bezier(0.2,0.4,0.6,1),z-index .2s cubic-bezier(0.2,0.4,0.6,1);position:fixed;top:0;left:0;display:flex;align-items:center;justify-content:center}
.popup.active{transition:opacity .3s cubic-bezier(0.2,0.4,0.6,1),visibility .3s cubic-bezier(0.2,0.4,0.6,1),z-index .3s cubic-bezier(0.2,0.4,0.6,1);opacity:1;visibility:visible;z-index:99}
.popup.active .popup-container{transition:scale .3s cubic-bezier(0.2,0.4,0.6,1);scale:1}
.popup.active .popup-container.no-padding{padding:0}
@media(max-width:767px){.popup.active .popup-container.no-padding .text-container{padding:20px 20px 0}
}
.popup.active .popup-container.no-padding button:last-of-type{margin-bottom:40px}
@media(max-width:767px){.popup.active .popup-container.no-padding button:last-of-type{margin-bottom:30px}
}
.popup .overlay{position:fixed;left:0;top:0;width:100%;height:100%;background-color:#000;opacity:.6}
.popup .popup-container{scale:0;transition:scale .2s cubic-bezier(0.2,0.4,0.6,1);width:598px;height:auto;background-color:#fff;border-radius:32px;padding:80px 60px 60px;position:relative;display:flex;flex-direction:column;align-items:center;overflow:hidden}
@media(max-width:1219px){.popup .popup-container{border-radius:24px}
}
@media(max-width:767px){.popup .popup-container{max-width:calc(100vw - 40px);width:320px;border-radius:12px;padding:50px 20px 30px}
}
.popup .popup-container .image-container{width:100%;height:338px;background:#e8d8d7}
.popup .popup-container .text-container{padding:40px 60px 0}
.popup .popup-container .text-container .title-container{text-align:center;margin:0 auto 20px}
.popup .popup-container .popup-text{text-align:center;color:#000}
.popup .popup-container .popup-button{margin:20px 0}
@media(max-width:767px){.popup .popup-container .popup-button{padding:10px 16px}
}
.popup .popup-container>.close-button{cursor:pointer;display:block;position:absolute;right:20px;top:20px;width:40px;height:40px;z-index:1}
@media(max-width:767px){.popup .popup-container>.close-button{width:24px;height:24px}
}
.popup .popup-container .tag-list-container{position:relative;margin-top:calc(30px - 10px)}
.popup .popup-container .tag-list-container .overlay{position:absolute;top:160px;width:100%;height:40px;left:0;background:linear-gradient(360deg,#fff 0,rgba(255,255,255,0) 100%)}
.popup .popup-container .tag-list-container .tag-list{padding-right:4px;display:flex;flex-wrap:wrap;max-height:200px;overflow-x:hidden;overflow-y:hidden;justify-content:center;position:relative;overflow-y:auto;margin-right:-4px}
.popup .popup-container .tag-list-container .tag-list::-webkit-scrollbar{width:4px}
.popup .popup-container .tag-list-container .tag-list::-webkit-scrollbar-thumb{background:transparent;border-radius:4px}
.popup .popup-container .tag-list-container .tag-list.active::-webkit-scrollbar-thumb{background:#757575}
.popup .popup-container .tag-list-container .tag-list>.tag-item{transition:background .3s,border.3s;display:flex;align-items:center;padding:6px 6px 6px 10px;margin-top:10px;margin-right:10px;border-radius:32px;color:#757575;border:1px solid #f2f2f2;background:#f2f2f2;font-family:'Roboto';font-weight:400;font-size:12px;line-height:14px;cursor:pointer}
.popup .popup-container .tag-list-container .tag-list>.tag-item .tag-name{margin-right:3px}
.popup .popup-container .tag-list-container .tag-list>.tag-item:hover{border:1px solid #ccc}
.popup .popup-container .tag-list-container .tag-list>.tag-item.selected{padding:6px 10px 6px 6px;color:#fff;border:1px solid #00626b;background-color:#00626b}
.popup .popup-container .tag-list-container .tag-list>.tag-item.selected .tag-name{margin-right:0;margin-left:3px}
.popup .popup-container .tag-list-container .tag-list>.tag-item>svg{width:20px;height:20px}
.popup svg{height:100%;width:100%;visibility:visible}
.topic-page .popup .popup-container .image-container,.quiz-page .popup .popup-container .image-container{background-color:#cadbd4;height:338px;width:598px;display:flex;justify-content:center;align-items:center}
@media(max-width:767px){.topic-page .popup .popup-container .image-container,.quiz-page .popup .popup-container .image-container{height:auto;width:100%}
}
.topic-page .popup .popup-container .image-container img,.quiz-page .popup .popup-container .image-container img,.topic-page .popup .popup-container .image-container video,.quiz-page .popup .popup-container .image-container video{width:100%;height:100%;object-fit:contain}
.topic-page .popup .popup-container .text-container .popup-text a:link,.quiz-page .popup .popup-container .text-container .popup-text a:link,.topic-page .popup .popup-container a:visited,.quiz-page .popup .popup-container a:visited{color:#00626b}
.topic-page .popup .popup-container .download-one-button,.quiz-page .popup .popup-container .download-one-button{display:flex;align-items:center}
.topic-page .popup .popup-container .download-one-button .download-icon,.quiz-page .popup .popup-container .download-one-button .download-icon{margin-left:8px;width:18px;height:18px}
.topic-page .popup .popup-container .download-one-button:hover .download-svg,.quiz-page .popup .popup-container .download-one-button:hover .download-svg{transition:.3s;fill:#00707a}
.academy-banner-component .popup:not(.user-container){position:absolute;height:auto}
.academy-banner-component .popup:not(.user-container).active .popup-container{scale:1}
.academy-banner-component .popup:not(.user-container) .overlay{display:none !important}
.academy-banner-component .popup:not(.user-container) .popup-container{box-shadow:0 -4px 20px rgba(0,0,0,0.2);padding:0;margin-top:16px;width:320px;position:absolute;top:100px;right:40px;border-radius:24px;overflow:hidden;transform-origin:right top}
@media(max-width:1219px){.academy-banner-component .popup:not(.user-container) .popup-container{border-radius:12px}
}
@media(max-width:767px){.academy-banner-component .popup:not(.user-container) .popup-container{top:60px;right:20px;margin-top:8px;width:calc(100vw - 40px)}
}
.academy-banner-component .popup:not(.user-container) .popup-container>.close-button{position:absolute;top:20px;right:20px;height:24px;width:24px;cursor:pointer;z-index:3}
.academy-banner-component .popup:not(.user-container) .popup-container>.video-container{height:233px;width:100%}
.academy-banner-component .popup:not(.user-container) .popup-container>.video-container>video{object-fit:cover;width:100%;height:100%}
.academy-banner-component .popup:not(.user-container) .popup-container>.text-and-button-container{padding:20px 20px 30px 20px;text-align:center}
.academy-banner-component .popup:not(.user-container) .popup-container>.text-and-button-container>.text{max-height:72px;overflow:hidden;color:#000}
.academy-banner-component .popup:not(.user-container) .popup-container>.text-and-button-container>button{margin:20px auto 0}
.academy-banner-component .popup:not(.user-container) .popup-container>.text-and-button-container>.academy-text-btn-right-md-black,.academy-banner-component .popup:not(.user-container) .popup-container>.text-and-button-container>.academy-text-btn-right-lg-black{background-color:unset;border:unset;margin-top:20px;justify-content:center}