*,:before,:after{box-sizing:border-box;background-repeat:no-repeat}:before,:after{text-decoration:inherit;vertical-align:inherit}:where(:root){cursor:default;line-height:1.5;overflow-wrap:break-word;-moz-tab-size:4;tab-size:4;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}:where(body){margin:0}:where(h1){font-size:2em;margin:.67em 0}:where(dl,ol,ul) :where(dl,ol,ul){margin:0}:where(hr){color:inherit;height:0}:where(nav) :where(ol,ul){list-style-type:none;padding:0}:where(nav li):before{content:"\200b";float:left}:where(pre){font-family:monospace,monospace;font-size:1em;overflow:auto}:where(abbr[title]){text-decoration:underline;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(audio,canvas,iframe,img,svg,video){vertical-align:middle}:where(iframe){border-style:none}:where(svg:not([fill])){fill:currentColor}:where(table){border-collapse:collapse;border-color:inherit;text-indent:0}:where(button,input,select){margin:0}:where(button,[type=button i],[type=reset i],[type=submit i]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){margin:0;resize:vertical}:where([type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(details>summary:first-of-type){display:list-item}:where([aria-busy=true i]){cursor:progress}:where([aria-controls]){cursor:pointer}:where([aria-disabled=true i],[disabled]){cursor:not-allowed}:where([aria-hidden=false i][hidden]){display:initial}:where([aria-hidden=false i][hidden]:not(:focus)){clip:rect(0,0,0,0);position:absolute}@font-face{font-family:bgrB;src:url(../font/binggrae-Bold.woff2) format("woff2")}@font-face{font-family:ckB;src:url(../font/CookieRun\ Bold.ttf) format("truetype")}@font-face{font-family:agrB;src:url(../font/SBAggroB.ttf) format("truetype")}@font-face{font-family:nsrEB;src:url(../font/NanumSquareRoundOTFEB.otf) format("opentype")}@font-face{font-family:jalnan;src:url(../font/jalnan.woff2) format("woff2")}body{position:fixed;left:0;top:0;width:100%;height:100%;-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-moz-tap-highlight-color:rgba(0,0,0,0);-ms-tap-highlight-color:rgba(0,0,0,0);-o-tap-highlight-color:rgba(0,0,0,0);width:1280px;height:720px;overflow:hidden}.root{position:absolute;left:0;top:0;width:1280px;height:720px;overflow:hidden}.content{position:absolute;left:0;top:0;width:100%;height:100%}div>img{width:100%;height:auto;max-width:100%}.remove{display:none!important}.hide{visibility:hidden!important}.disable{opacity:.5;pointer-events:none}.eng.on,.example-eng.on,.eng.on *,.example-eng.on *{color:#0134cd!important}.eng .emp,.example-eng .emp{color:#f36}input[type=checkbox]{appearance:none;cursor:pointer;background-color:transparent}button{border:none}.semester{position:absolute;left:0;top:0}.semester:after{content:url(../image/lesson_bg/img_0_on.png) url(../image/lesson_bg/img_1_on.png) url(../image/lesson_bg/img_2_on.png) url(../image/lesson_bg/img_3_on.png) url(../image/lesson_bg/img_4_on.png) url(../image/lesson_bg/img_5_on.png) url(../image/lesson_bg/img_6_on.png) url(../image/lesson_num/lesson01_on.svg) url(../image/lesson_num/lesson02_on.svg) url(../image/lesson_num/lesson03_on.svg) url(../image/lesson_num/lesson04_on.svg) url(../image/lesson_num/lesson05_on.svg) url(../image/lesson_num/lesson06_on.svg) url(../image/lesson_num/lesson07_on.svg) url(../image/lesson_num/lesson08_on.svg) url(../image/lesson_num/lesson09_on.svg) url(../image/lesson_num/lesson10_on.svg) url(../image/lesson_num/lesson11_on.svg) url(../image/lesson_num/lesson12_on.svg) url(../image/lesson_num/lesson13_on.svg) url(../image/lesson_num/lesson14_on.svg);display:block;position:absolute;width:0;height:0;overflow:hidden;z-index:-1}.btn-lesson{position:absolute}.btn-lesson label,.btn-lesson input{position:absolute;left:0;top:0;width:100%;height:100%}.btn-lesson label{pointer-events:none}.btn-lesson-0{left:42px;top:130px;width:121px;height:111px}.btn-lesson-0 input{background:url(../image/lesson_bg/img_0.png) no-repeat 0 0 / cover}.btn-lesson-0 label{background:url(../image/lesson_num/lesson01.svg) no-repeat 0 0 / cover}.btn-lesson-0.mouse-over input{background:url(../image/lesson_bg/img_0_on.png) no-repeat 0 0 / cover}.btn-lesson-0.mouse-over label{background:url(../image/lesson_num/lesson01_on.svg) no-repeat 0 0 / cover}.btn-lesson-1{left:156px;top:130px;width:109px;height:123px}.btn-lesson-1 input{background:url(../image/lesson_bg/img_1.png) no-repeat 0 0 / cover}.btn-lesson-1 label{background:url(../image/lesson_num/lesson02.svg) no-repeat 0 0 / cover}.btn-lesson-1.mouse-over input{background:url(../image/lesson_bg/img_1_on.png) no-repeat 0 0 / cover}.btn-lesson-1.mouse-over label{background:url(../image/lesson_num/lesson02_on.svg) no-repeat 0 0 / cover}.btn-lesson-2{left:41px;top:244px;width:109px;height:123px}.btn-lesson-2 input{background:url(../image/lesson_bg/img_2.png) no-repeat 0 0 / cover}.btn-lesson-2 label{background:url(../image/lesson_num/lesson03.svg) no-repeat 0 0 / cover}.btn-lesson-2.mouse-over input{background:url(../image/lesson_bg/img_2_on.png) no-repeat 0 0 / cover}.btn-lesson-2.mouse-over label{background:url(../image/lesson_num/lesson03_on.svg) no-repeat 0 0 / cover}.btn-lesson-3{left:144px;top:244px;width:121px;height:111px}.btn-lesson-3 input{background:url(../image/lesson_bg/img_3.png) no-repeat 0 0 / cover}.btn-lesson-3 label{background:url(../image/lesson_num/lesson04.svg) no-repeat 0 0 / cover}.btn-lesson-3.mouse-over input{background:url(../image/lesson_bg/img_3_on.png) no-repeat 0 0 / cover}.btn-lesson-3.mouse-over label{background:url(../image/lesson_num/lesson04_on.svg) no-repeat 0 0 / cover}.btn-lesson-4{left:41px;top:358px;width:121px;height:111px}.btn-lesson-4 input{background:url(../image/lesson_bg/img_4.png) no-repeat 0 0 / cover}.btn-lesson-4 label{background:url(../image/lesson_num/lesson05.svg) no-repeat 0 0 / cover}.btn-lesson-4.mouse-over input{background:url(../image/lesson_bg/img_4_on.png) no-repeat 0 0 / cover}.btn-lesson-4.mouse-over label{background:url(../image/lesson_num/lesson05_on.svg) no-repeat 0 0 / cover}.btn-lesson-5{left:156px;top:358px;width:109px;height:123px}.btn-lesson-5 input{background:url(../image/lesson_bg/img_5.png) no-repeat 0 0 / cover}.btn-lesson-5 label{background:url(../image/lesson_num/lesson06.svg) no-repeat 0 0 / cover}.btn-lesson-5.mouse-over input{background:url(../image/lesson_bg/img_5_on.png) no-repeat 0 0 / cover}.btn-lesson-5.mouse-over label{background:url(../image/lesson_num/lesson06_on.svg) no-repeat 0 0 / cover}.btn-lesson-6{left:41px;top:472px;width:224px;height:111px}.btn-lesson-6 input{background:url(../image/lesson_bg/img_6.png) no-repeat 0 0 / cover}.btn-lesson-6 label{background:url(../image/lesson_num/lesson13.svg) no-repeat 0 0 / cover}.btn-lesson-6.mouse-over input{background:url(../image/lesson_bg/img_6_on.png) no-repeat 0 0 / cover}.btn-lesson-6.mouse-over label{background:url(../image/lesson_num/lesson13_on.svg) no-repeat 0 0 / cover}.btn-lesson-7{left:42px;top:130px;width:121px;height:111px}.btn-lesson-7 input{background:url(../image/lesson_bg/img_0.png) no-repeat 0 0 / cover}.btn-lesson-7 label{background:url(../image/lesson_num/lesson07.svg) no-repeat 0 0 / cover}.btn-lesson-7.mouse-over input{background:url(../image/lesson_bg/img_0_on.png) no-repeat 0 0 / cover}.btn-lesson-7.mouse-over label{background:url(../image/lesson_num/lesson07_on.svg) no-repeat 0 0 / cover}.btn-lesson-8{left:156px;top:130px;width:109px;height:123px}.btn-lesson-8 input{background:url(../image/lesson_bg/img_1.png) no-repeat 0 0 / cover}.btn-lesson-8 label{background:url(../image/lesson_num/lesson08.svg) no-repeat 0 0 / cover}.btn-lesson-8.mouse-over input{background:url(../image/lesson_bg/img_1_on.png) no-repeat 0 0 / cover}.btn-lesson-8.mouse-over label{background:url(../image/lesson_num/lesson08_on.svg) no-repeat 0 0 / cover}.btn-lesson-9{left:41px;top:244px;width:109px;height:123px}.btn-lesson-9 input{background:url(../image/lesson_bg/img_2.png) no-repeat 0 0 / cover}.btn-lesson-9 label{background:url(../image/lesson_num/lesson09.svg) no-repeat 0 0 / cover}.btn-lesson-9.mouse-over input{background:url(../image/lesson_bg/img_2_on.png) no-repeat 0 0 / cover}.btn-lesson-9.mouse-over label{background:url(../image/lesson_num/lesson09_on.svg) no-repeat 0 0 / cover}.btn-lesson-10{left:144px;top:244px;width:121px;height:111px}.btn-lesson-10 input{background:url(../image/lesson_bg/img_3.png) no-repeat 0 0 / cover}.btn-lesson-10 label{background:url(../image/lesson_num/lesson10.svg) no-repeat 0 0 / cover}.btn-lesson-10.mouse-over input{background:url(../image/lesson_bg/img_3_on.png) no-repeat 0 0 / cover}.btn-lesson-10.mouse-over label{background:url(../image/lesson_num/lesson10_on.svg) no-repeat 0 0 / cover}.btn-lesson-11{left:41px;top:358px;width:121px;height:111px}.btn-lesson-11 input{background:url(../image/lesson_bg/img_4.png) no-repeat 0 0 / cover}.btn-lesson-11 label{background:url(../image/lesson_num/lesson11.svg) no-repeat 0 0 / cover}.btn-lesson-11.mouse-over input{background:url(../image/lesson_bg/img_4_on.png) no-repeat 0 0 / cover}.btn-lesson-11.mouse-over label{background:url(../image/lesson_num/lesson11_on.svg) no-repeat 0 0 / cover}.btn-lesson-12{left:156px;top:358px;width:109px;height:123px}.btn-lesson-12 input{background:url(../image/lesson_bg/img_5.png) no-repeat 0 0 / cover}.btn-lesson-12 label{background:url(../image/lesson_num/lesson12.svg) no-repeat 0 0 / cover}.btn-lesson-12.mouse-over input{background:url(../image/lesson_bg/img_5_on.png) no-repeat 0 0 / cover}.btn-lesson-12.mouse-over label{background:url(../image/lesson_num/lesson12_on.svg) no-repeat 0 0 / cover}.btn-lesson-13{left:41px;top:472px;width:224px;height:111px}.btn-lesson-13 input{background:url(../image/lesson_bg/img_6.png) no-repeat 0 0 / cover}.btn-lesson-13 label{background:url(../image/lesson_num/lesson14.svg) no-repeat 0 0 / cover}.btn-lesson-13.mouse-over input{background:url(../image/lesson_bg/img_6_on.png) no-repeat 0 0 / cover}.btn-lesson-13.mouse-over label{background:url(../image/lesson_num/lesson14_on.svg) no-repeat 0 0 / cover}.img-ls{position:absolute;left:395px;top:95px;width:489.5px;height:335px;transition:background .1s ease-in-out;cursor:pointer}.img-ls.ls-1{background:url(../image/lesson_img/ls_1.png) no-repeat 0 0 / cover}.img-ls.ls-2{background:url(../image/lesson_img/ls_2.png) no-repeat 0 0 / cover}.img-ls.ls-3{background:url(../image/lesson_img/ls_3.png) no-repeat 0 0 / cover}.img-ls.ls-4{background:url(../image/lesson_img/ls_4.png) no-repeat 0 0 / cover}.img-ls.ls-5{background:url(../image/lesson_img/ls_5.png) no-repeat 0 0 / cover}.img-ls.ls-6{background:url(../image/lesson_img/ls_6.png) no-repeat 0 0 / cover}.img-ls.ls-7{background:url(../image/lesson_img/ls_7.png) no-repeat 0 0 / cover}.img-ls.ls-8{background:url(../image/lesson_img/ls_8.png) no-repeat 0 0 / cover}.img-ls.ls-9{background:url(../image/lesson_img/ls_9.png) no-repeat 0 0 / cover}.img-ls.ls-10{background:url(../image/lesson_img/ls_10.png) no-repeat 0 0 / cover}.img-ls.ls-11{background:url(../image/lesson_img/ls_11.png) no-repeat 0 0 / cover}.img-ls.ls-12{background:url(../image/lesson_img/ls_12.png) no-repeat 0 0 / cover}.img-ls.ls-13{background:url(../image/lesson_img/ls_13.png) no-repeat 0 0 / cover}.img-ls.ls-14{background:url(../image/lesson_img/ls_14.png) no-repeat 0 0 / cover}.grade-5 .content .toggle-semester{position:absolute;left:1075px;top:465px;width:140px;height:150px;cursor:pointer}.grade-6 .content .toggle-semester{position:absolute;left:1056px;top:254px;width:140px;height:148px;cursor:pointer}.content .btn-navigation{position:absolute;left:20px;top:15px;width:213.5px;height:47px;background:url(../image/btn_navigation.png) no-repeat -2px -2px / 217.5px 100px;cursor:pointer}.content .btn-navigation.mouse-over{background-position:-2px -51px}.content .page-box{position:absolute;left:1030px;top:635px;width:246px;height:66px;background:url(../image/bg_page.png) no-repeat;background-size:contain}.content .page-box .input-page{position:absolute;left:125px;top:11px;width:56px;height:31px;margin:0;opacity:1;border:none;outline:none;background-color:transparent;font-family:bgrB;font-size:16px;color:#000;text-align:center;line-height:1}.content .page-box .btn-go{position:absolute;left:182px;top:3px;width:60px;height:50px;cursor:pointer}.content .tool-box{position:absolute;left:15px;bottom:15px;width:320px;height:50px;padding:0 3px;background-color:#fff;border-radius:50px;box-shadow:5px 5px 5px #0000001a,-5px 5px 5px #0000001a,5px -5px 5px #0000001a,-5px -5px 5px #0000001a;display:flex;justify-content:space-between;align-items:center}.content .btn-tool{position:relative;width:44px;height:44px;cursor:pointer}.content .btn-tool:after{content:url(../image/btn_tool/btn_progress_over.svg) url(../image/btn_tool/btn_myclass_over.svg) url(../image/btn_tool/btn_pds_over.svg) url(../image/btn_tool/btn_chant_over.svg) url(../image/btn_tool/btn_dic_over.svg) url(../image/btn_tool/btn_game_over.svg) url(../image/btn_tool/btn_manual_over.svg);display:block;position:absolute;width:0;height:0;overflow:hidden;z-index:-1}.content .btn-progress{background:url(../image/btn_tool/btn_progress.svg) no-repeat 0 0 / contain}.content .btn-progress.mouse-over{background:url(../image/btn_tool/btn_progress_over.svg) no-repeat 0 0 / contain}.content .btn-myclass{background:url(../image/btn_tool/btn_myclass.svg) no-repeat 0 0 / contain}.content .btn-myclass.mouse-over{background:url(../image/btn_tool/btn_myclass_over.svg) no-repeat 0 0 / contain}.content .btn-pds{background:url(../image/btn_tool/btn_pds.svg) no-repeat 0 0 / contain}.content .btn-pds.mouse-over{background:url(../image/btn_tool/btn_pds_over.svg) no-repeat 0 0 / contain}.content .btn-chant{background:url(../image/btn_tool/btn_chant.svg) no-repeat 0 0 / contain}.content .btn-chant.mouse-over{background:url(../image/btn_tool/btn_chant_over.svg) no-repeat 0 0 / contain}.content .btn-dic{background:url(../image/btn_tool/btn_dic.svg) no-repeat 0 0 / contain}.content .btn-dic.mouse-over{background:url(../image/btn_tool/btn_dic_over.svg) no-repeat 0 0 / contain}.content .btn-game{background:url(../image/btn_tool/btn_game.svg) no-repeat 0 0 / contain}.content .btn-game.mouse-over{background:url(../image/btn_tool/btn_game_over.svg) no-repeat 0 0 / contain}.content .btn-game:checked{background:url(../image/btn_tool/btn_game_over.svg) no-repeat 0 0 / contain}.content .btn-game:checked.mouse-over{background:url(../image/btn_tool/btn_game_over.svg) no-repeat 0 0 / contain}.content .btn-manual{background:url(../image/btn_tool/btn_manual.svg) no-repeat 0 0 / contain}.content .btn-manual.mouse-over{background:url(../image/btn_tool/btn_manual_over.svg) no-repeat 0 0 / contain}.content .tooltip-tool{position:absolute;top:-25px;height:24px;visibility:hidden}.content .btn-tool.mouse-over+.tooltip-tool{visibility:visible}.content .tooltip-tool.progress{left:3px;width:46px;background:url(../image/btn_tool/tooltip_progress.svg) no-repeat 0 0 / contain}.content .tooltip-tool.myclass{left:40px;width:60px;background:url(../image/btn_tool/tooltip_myclass.svg) no-repeat 0 0 / contain}.content .tooltip-tool.pds{left:80px;width:70px;background:url(../image/btn_tool/tooltip_pds.svg) no-repeat 0 0 / contain}.content .tooltip-tool.chant{left:130px;width:60px;background:url(../image/btn_tool/tooltip_chant.svg) no-repeat 0 0 / contain}.content .tooltip-tool.dic{left:180px;width:48px;background:url(../image/btn_tool/tooltip_dic.svg) no-repeat 0 0 / contain}.content .tooltip-tool.game{left:228px;width:44px;background:url(../image/btn_tool/tooltip_game.svg) no-repeat 0 0 / contain}.content .tooltip-tool.manual{left:265px;width:60px;background:url(../image/btn_tool/tooltip_manual.svg) no-repeat 0 0 / contain}.content .panel-games{position:absolute;left:195px;top:500px;width:137.5px;height:149.5px;background:url(../image/btn_game/bg_game_panel.png) no-repeat;background-size:contain;padding:6px 0 18px;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.content .panel-games>button{width:125px;height:25px;cursor:pointer;flex-shrink:0}.content .panel-games .btn-game-0{background:url(../image/btn_game/btn_game_0.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-0.mouse-over{background:url(../image/btn_game/btn_game_0_over.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-1{background:url(../image/btn_game/btn_game_1.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-1.mouse-over{background:url(../image/btn_game/btn_game_1_over.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-2{background:url(../image/btn_game/btn_game_2.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-2.mouse-over{background:url(../image/btn_game/btn_game_2_over.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-3{background:url(../image/btn_game/btn_game_3.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-3.mouse-over{background:url(../image/btn_game/btn_game_3_over.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-4{background:url(../image/btn_game/btn_game_4.svg) no-repeat 0 0 / contain}.content .panel-games .btn-game-4.mouse-over{background:url(../image/btn_game/btn_game_4_over.svg) no-repeat 0 0 / contain}.popup-lesson{position:absolute;left:0;top:0;width:100%;height:100%;background:url(../image/popup_lesson/bg.png) no-repeat 0 0 / cover;display:flex;justify-content:center;align-items:center}.popup-lesson .slide-viewport{position:relative;width:100%;height:100%;overflow:hidden}.popup-lesson .btn-prev{position:absolute;left:44px;top:340px;width:63px;height:66.5px;background:url(../image/popup_lesson/btn_move.png) no-repeat 0 0 / cover;transform:scaleX(-1);cursor:pointer}.popup-lesson .btn-next{position:absolute;left:1170px;top:340px;width:63px;height:66.5px;background:url(../image/popup_lesson/btn_move.png) no-repeat 0 0 / cover;cursor:pointer}.popup-lesson .boxes{position:absolute;left:80px;top:0;height:100%;padding:20px 0 0;display:flex;justify-content:flex-start;align-items:center}.popup-lesson .box{position:relative;flex-shrink:0;width:1020px;height:480px;margin:0 50px;padding:0 0 0 16px;display:flex;justify-content:flex-start;align-items:center;background-color:#fff;border-radius:50px;box-shadow:10px 10px 10px #0000001a,-10px 10px 10px #0000001a,10px -10px 10px #0000001a,-10px -10px 10px #0000001a}.popup-lesson .box .btn-close{position:absolute;right:-8px;top:-8px;width:46.5px;height:48px;background:url(../image/popup_lesson/btn_close.png) no-repeat 0 0 / cover;cursor:pointer}.popup-lesson .box-page-container{position:absolute;left:0;top:620px;width:100%;height:26px;display:flex;justify-content:center;align-items:center}.popup-lesson .box-page{position:relative;width:26px;height:26px;margin:0 3px}.popup-lesson .box-page input{position:absolute;left:0;top:0;width:100%;height:100%;background-color:#273c5c;border-radius:26px}.popup-lesson .box-page label{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;font-family:ckB;font-size:18px;color:#fff;pointer-events:none}.popup-lesson .box-page input:checked{background-color:#fff}.popup-lesson .box-page input:checked+label{color:#273c5c}.popup-lesson .box-page.review{width:78px}.popup-lesson .box-page.review label{font-size:17px}.popup-lesson .box .panel{position:relative;width:515px;height:100%;margin:0 0 0 30px;padding:50px 0 0}.popup-lesson .box .title-container{font-family:agrB}.popup-lesson .box .ls-num{width:137px;height:47px;padding:8px 0;background:url(../image/popup_lesson/bg_ls_num_0.svg) no-repeat 0 0 / cover;font-size:18px;color:#fff;display:flex;justify-content:center;align-items:flex-start}.popup-lesson .box .ls-title{margin:10px 0 0;padding:0 0 0 60px;font-size:30px;color:#363248}.popup-lesson .box-6 .ls-title{padding:0 0 0 52px}.popup-lesson .box .charsi-container{position:absolute;left:10px;top:200px;width:506px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.popup-lesson .box .charsi-box{margin:0 0 8px;display:flex;justify-content:flex-start;align-items:center}.popup-lesson .box .cs-title{width:110px;height:40px;margin:0 15px 0 0;border-radius:10px 20px 20px 10px;font-family:nsrEB;font-size:16px;color:#414141;display:flex;justify-content:center;align-items:center}.popup-lesson .box .cs-0 .cs-title{background-color:#ffb3ce}.popup-lesson .box .cs-1 .cs-title{background-color:#ffcd85}.popup-lesson .box .cs-2 .cs-title{background-color:#c5f19b}.popup-lesson .box .cs-3 .cs-title{background-color:#94e9d8}.popup-lesson .box .cs-4 .cs-title{background-color:#a7e1ff}.popup-lesson .box .cs-5 .cs-title{background-color:#b4c7ff}.popup-lesson .box .cs-6 .cs-title{background-color:#d1b8f6}.popup-lesson .box .btn-ebook,.popup-lesson .box .btn-content{width:52px;height:52px;cursor:pointer;transition:background .1s ease-in-out}.popup-lesson .box .cs-0 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_0.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-1 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_1.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-2 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_2.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-3 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_3.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-4 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_4.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-5 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_5.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-6 .btn-ebook{background:url(../image/popup_lesson/btn_ebook_6.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-0 .btn-content{background:url(../image/popup_lesson/btn_content_0.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-1 .btn-content{background:url(../image/popup_lesson/btn_content_1.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-2 .btn-content{background:url(../image/popup_lesson/btn_content_2.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-3 .btn-content{background:url(../image/popup_lesson/btn_content_3.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-4 .btn-content{background:url(../image/popup_lesson/btn_content_4.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-5 .btn-content{background:url(../image/popup_lesson/btn_content_5.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-6 .btn-content{background:url(../image/popup_lesson/btn_content_6.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-0 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_0_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-1 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_1_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-2 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_2_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-3 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_3_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-4 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_4_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-5 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_5_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-6 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_6_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-0 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_0_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-1 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_1_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-2 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_2_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-3 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_3_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-4 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_4_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-5 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_5_over.svg) no-repeat 0 0 / cover}.popup-lesson .box .cs-6 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_6_over.svg) no-repeat 0 0 / cover}.popup-lesson .box-6 .panel{width:265px}.popup-lesson .box-6 .title-container{font-family:agrB}.popup-lesson .box-6 .ls-num{background:url(../image/popup_lesson/bg_ls_num_1.svg) no-repeat 0 0 / cover}.popup-lesson .box-6 .charsi-container{position:absolute;left:10px;top:170px;width:235px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap}.popup-lesson .box-6 .btn-ebook{width:76px;height:76px;margin:0 5px 0 0;background:url(../image/popup_lesson/btn_ebook_review.svg) no-repeat 0 0 / cover}.popup-lesson .box-6 .btn-content{width:76px;height:76px;background:url(../image/popup_lesson/btn_content_review.svg) no-repeat 0 0 / cover}.popup-lesson .box-6 .btn-ebook.mouse-over{background:url(../image/popup_lesson/btn_ebook_review_over.svg) no-repeat 0 0 / cover}.popup-lesson .box-6 .btn-content.mouse-over{background:url(../image/popup_lesson/btn_content_review_over.svg) no-repeat 0 0 / cover}.popup-lesson-0 .box-0 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_1.png) no-repeat 0 0 / cover}.popup-lesson-0 .box-1 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_2.png) no-repeat 0 0 / cover}.popup-lesson-0 .box-2 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_3.png) no-repeat 0 0 / cover}.popup-lesson-0 .box-3 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_4.png) no-repeat 0 0 / cover}.popup-lesson-0 .box-4 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_5.png) no-repeat 0 0 / cover}.popup-lesson-0 .box-5 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_6.png) no-repeat 0 0 / cover}.popup-lesson-0 .box-6 .img{width:693.5px;height:450px;background:url(../image/popup_lesson/img_ls_13.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-0 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_7.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-1 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_8.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-2 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_9.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-3 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_10.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-4 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_11.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-5 .img{width:430px;height:450px;background:url(../image/popup_lesson/img_ls_12.png) no-repeat 0 0 / cover}.popup-lesson-1 .box-6 .img{width:693.5px;height:450px;background:url(../image/popup_lesson/img_ls_14.png) no-repeat 0 0 / cover}.navigation{position:absolute;left:0;top:0;width:1280px;height:720px;pointer-events:none}.navigation .middle{position:absolute;left:0;top:0;width:1280px;height:720px;visibility:hidden;pointer-events:auto;display:flex;justify-content:center;align-items:center}.middle.show{visibility:visible}.navigation .middle>.bg{position:absolute;left:0;top:0;background-color:#2cc0b0b3;width:100%;height:100%}.navigation .middle .pannel-box{position:absolute;width:1285px;height:675px}.navigation .middle .pannel-bg{position:absolute;left:0;top:0;width:100%;height:100%;background:url(../image/navigation/pannel_bg.png) no-repeat 0 0 / contain}.navigation .middle .lesson-button-box{position:absolute;left:11px;top:155px}.navigation .middle .lesson-button-box .page{position:absolute;left:0;top:0}.navigation .middle .lesson-button{position:relative;margin-bottom:10px;width:108px;height:36px;font-family:bgrB;font-size:15px;cursor:pointer}.navigation .middle .lesson-button .idle-state{position:absolute;left:0;top:0;width:100%;height:100%;border-radius:36px;color:#fff;display:flex;justify-content:center;align-items:center;box-shadow:0 1px 0 1px #0000001a;-webkit-box-shadow:0px 1px 0px 1px rgba(0,0,0,.1);-moz-box-shadow:0px 1px 0px 1px rgba(0,0,0,.1)}.navigation .middle .lesson-button .idle-state{background-color:#0ca3bd}.navigation .middle .lesson-button .over-state{position:absolute;left:0;top:0;width:100%;height:100%;border-radius:36px;color:#fff;display:flex;justify-content:center;align-items:center;box-shadow:0 1px 0 1px #0000001a;-webkit-box-shadow:0px 1px 0px 1px rgba(0,0,0,.1);-moz-box-shadow:0px 1px 0px 1px rgba(0,0,0,.1)}.navigation .middle .lesson-button .over-state{background-color:#11c1cc}.navigation .middle .lesson-button .on-state{position:absolute;left:0;top:0;width:100%;height:100%;padding:0 0 0 5px;margin:0 0 0 14px;background-color:#fff;border-radius:36px 0 0 36px;display:flex;justify-content:center;align-items:center}.navigation .middle .lesson-button .on-state{color:#099ab3}.navigation .middle .lesson-button .on-state .on-state-text-0{margin:0 5px 0 0}.navigation .middle .lesson-button .on-state .on-state-text-1{width:26px;height:26px;border-radius:26px;color:#fff;display:flex;justify-content:center;align-items:center}.navigation .middle .lesson-button .on-state .on-state-text-1{background-color:#099ab3}.navigation .middle .lesson-button.special .idle-state{background-color:#71bad9}.navigation .middle .lesson-button.special .over-state{background-color:#63c2ea}.navigation .middle .lesson-button.special .on-state{color:#00a6c2}.navigation .middle .lesson-button.special .on-state .on-state-text-1{background-color:#1cbad4}.navigation .middle .lesson-button.review .idle-state{background-color:#39ce94}.navigation .middle .lesson-button.review .over-state{background-color:#4bd9a1}.navigation .middle .lesson-button.review .on-state{color:#1ca771;display:flex;justify-content:center;align-items:center}.navigation .middle .lesson-button.review .on-state .on-state-text-1{background-color:#109662}.navigation .middle .lesson-button.review .on-state .on-state-text-0{padding:0}.navigation .middle .lesson-button-box .btn-prev{position:absolute;left:10px;top:435px;width:36px;height:36px}.navigation .middle .lesson-button-box .btn-next{position:absolute;left:65px;top:435px;width:36px;height:36px}.navigation .middle .lesson-button-box .btn-prev.lock,.navigation .middle .lesson-button-box .btn-next.lock{opacity:.5;pointer-events:none}.navigation .middle .lesson-pannel{position:absolute;left:128px;top:32px;background:url(../image/navigation/corner_bg.png) no-repeat;background-size:contain;width:1140px;height:601px}.navigation .middle .lesson-title{position:absolute;left:0;top:0;width:100%;height:45px;display:flex;justify-content:center;align-items:center;font-family:jalnan;font-size:21px;color:#fff}.navigation .middle .lesson-box{position:absolute;left:0;top:45px;width:100%;height:555px;padding:15px;display:flex;justify-content:space-evenly;align-items:flex-start}.navigation .middle .lesson-box:after{content:url(../image/navigation/bg_review_1.png) url(../image/navigation/bg_review_2.png);position:absolute;width:0;height:0;overflow:hidden;z-index:-1}.navigation .middle .lesson-box .bg-review-1{position:absolute;left:12px;top:0;width:1115px;height:545px;overflow:hidden}.navigation .middle .lesson-box .bg-review-1:after{content:"";position:absolute;left:0;top:-10px;width:1115px;height:555px;background:url(../image/navigation/bg_review_1.png) no-repeat;background-size:contain}.navigation .middle .lesson-box .bg-review-2{position:absolute;left:12px;top:0;width:1115px;height:545px;overflow:hidden}.navigation .middle .lesson-box .bg-review-2:after{content:"";position:absolute;left:0;top:-10px;width:1115px;height:555px;background:url(../image/navigation/bg_review_2.png) no-repeat;background-size:contain}.navigation .middle .charsi-box{width:150px;height:auto}.navigation .middle .charsi-box .title-box{position:relative;width:100%;height:40px}.navigation .middle .charsi-box .arrow{position:absolute;left:110px;top:-6px;width:20px;height:20px;margin-top:32px;border-radius:3px;transform:rotate(45deg)}.navigation .middle .lesson-box.charsi-count-1,.navigation .middle .lesson-box.charsi-count-2{padding:15px 5px 0 15px;justify-content:flex-start}.navigation .middle .lesson-box.charsi-count-1 .charsi-box,.navigation .middle .lesson-box.charsi-count-2 .charsi-box{margin-right:11px}.navigation .middle .lesson-box.charsi-count-5 .charsi-box .arrow{left:86px}.navigation .middle .charsi-box .title{position:relative;width:100%;height:40px;padding:8px 0 0;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;font-family:nsrEB;font-size:18px;color:#000000b3;border-radius:40px}.navigation .middle .charsi-box-0 .title,.navigation .middle .charsi-box-0 .arrow{background-color:#ffb3ce}.navigation .middle .charsi-box-1 .title,.navigation .middle .charsi-box-1 .arrow{background-color:#ffcd85}.navigation .middle .charsi-box-2 .title,.navigation .middle .charsi-box-2 .arrow{background-color:#c5f19b}.navigation .middle .charsi-box-3 .title,.navigation .middle .charsi-box-3 .arrow{background-color:#94e9d8}.navigation .middle .charsi-box-4 .title,.navigation .middle .charsi-box-4 .arrow{background-color:#a7e1ff}.navigation .middle .charsi-box-5 .title,.navigation .middle .charsi-box-5 .arrow{background-color:#b4c7ff}.navigation .middle .charsi-box-6 .title,.navigation .middle .charsi-box-6 .arrow{background-color:#d1b8f6}.navigation .middle .corner-box{position:relative;left:0;top:0;margin:20px 0 0}.navigation .middle .corner-button{position:relative;margin:0 0 10px;width:100%;height:40px;display:flex;justify-content:center;align-items:center;font-family:bgrB;font-size:15px;color:#00000080}.navigation .middle .corner-button .idle-state{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#fff;border-radius:12px}.navigation .middle .charsi-box-0 .idle-state{border:2px solid #ffbdcf}.navigation .middle .charsi-box-1 .idle-state{border:2px solid #ffcd85}.navigation .middle .charsi-box-2 .idle-state{border:2px solid #86de81}.navigation .middle .charsi-box-3 .idle-state{border:2px solid #49dec1}.navigation .middle .charsi-box-4 .idle-state{border:2px solid #76d0ff}.navigation .middle .charsi-box-5 .idle-state{border:2px solid #98aff3}.navigation .middle .charsi-box-6 .idle-state{border:2px solid #cfa0ee}.navigation .middle .corner-button .over-state{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#fff;border-radius:12px}.navigation .middle .corner-button .over-state .over-state-text{width:98%;height:32px;display:flex;justify-content:center;align-items:center;background-color:#fff;border-radius:9px}.navigation .middle .charsi-box-0 .over-state{border:2px solid #ffbdcf}.navigation .middle .charsi-box-1 .over-state{border:2px solid #ffcd85}.navigation .middle .charsi-box-2 .over-state{border:2px solid #86de81}.navigation .middle .charsi-box-3 .over-state{border:2px solid #49dec1}.navigation .middle .charsi-box-4 .over-state{border:2px solid #76d0ff}.navigation .middle .charsi-box-5 .over-state{border:2px solid #98aff3}.navigation .middle .charsi-box-6 .over-state{border:2px solid #cfa0ee}.navigation .middle .charsi-box-0 .over-state .over-state-text{background-color:#ff8fad33}.navigation .middle .charsi-box-1 .over-state .over-state-text{background-color:#ffcd8533}.navigation .middle .charsi-box-2 .over-state .over-state-text{background-color:#86de8133}.navigation .middle .charsi-box-3 .over-state .over-state-text{background-color:#49dec133}.navigation .middle .charsi-box-4 .over-state .over-state-text{background-color:#76d0ff33}.navigation .middle .charsi-box-5 .over-state .over-state-text{background-color:#98aff333}.navigation .middle .charsi-box-6 .over-state .over-state-text{background-color:#cfa0ee33}.navigation .middle .corner-button .on-state{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;color:#fff;border-radius:12px}.navigation .middle .charsi-box-0 .on-state{background-color:#ff8fad}.navigation .middle .charsi-box-1 .on-state{background-color:#ffb853}.navigation .middle .charsi-box-2 .on-state{background-color:#86de81}.navigation .middle .charsi-box-3 .on-state{background-color:#49dec1}.navigation .middle .charsi-box-4 .on-state{background-color:#76d0ff}.navigation .middle .charsi-box-5 .on-state{background-color:#98aff3}.navigation .middle .charsi-box-6 .on-state{background-color:#cfa0ee}.navigation .middle .corner-button.badge{height:65px;font-size:17px}.navigation .middle .corner-button.badge .idle-state{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff;border-radius:12px}.navigation .middle .corner-button.badge .idle-state .badge{padding:0 8px;height:20px;font-family:jalnan;font-size:10px;color:#fff;background-color:#a19bc566;border-radius:25px;display:flex;justify-content:center;align-items:center}.navigation .middle .corner-button.badge .over-state{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#fff;border-radius:12px}.navigation .middle .corner-button.badge .over-state .bg-box{width:98%;height:56px;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff;border-radius:9px}.navigation .middle .charsi-box-0 .corner-button.badge .over-state .bg-box{background-color:#ff8fad33}.navigation .middle .charsi-box-1 .corner-button.badge .over-state .bg-box{background-color:#ffcd8533}.navigation .middle .charsi-box-2 .corner-button.badge .over-state .bg-box{background-color:#94e9d833}.navigation .middle .charsi-box-3 .corner-button.badge .over-state .bg-box{background-color:#c0b4ff4d}.navigation .middle .charsi-box-4 .corner-button.badge .over-state .bg-box{background-color:#76d0ff4d}.navigation .middle .corner-button.badge .over-state .badge{padding:0 8px;height:20px;font-family:jalnan;font-size:10px;color:#fff;background-color:#a19bc566;border-radius:25px;display:flex;justify-content:center;align-items:center}.navigation .middle .corner-button.badge .on-state{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#fff;color:#fff;border-radius:12px}.navigation .middle .corner-button.badge .on-state .badge{padding:0 8px;height:20px;font-family:jalnan;font-size:10px;color:#b095fc;background-color:#fff;border-radius:25px;display:flex;justify-content:center;align-items:center}.navigation .middle .btn-close{position:absolute;left:1218px;top:62px}.navigation .middle .pop-box{position:absolute;left:0;top:0;width:157.5px;height:113px;background:url(../image/navigation/bg_pop.png) no-repeat;background-size:161.5px,232px;background-position:-2px -2px;opacity:0;padding:10px 4px 22px 0;display:flex;flex-direction:column;justify-content:space-between;align-items:center;pointer-events:none}.navigation .middle .pop-box.left{background-position:-2px -117px}.navigation .middle .pop-box .btn-ebook,.navigation .middle .pop-box .btn-content{position:relative;width:88.5px;height:38.5px;flex-shrink:0;pointer-events:auto}