body{width:100%;font-family:'Kosugi Maru', sans-serif;color:#2d2920;min-height:650px;overflow-x:hidden}.header_main{padding:0 16px;height:64px;display:flex;align-items:center;justify-content:space-between}.header_main .logo{font-size:28px;font-family:'Fredoka One'}.header_main .logo a{color:#2470c7}.header_main .logo a i{color:#ff543a}.ham_btn{position:relative;height:100%;width:54px;display:flex;align-items:center;justify-content:flex-end}.ham_btn .in{position:relative;width:32px;height:24px}.ham_btn .in div{position:absolute;left:0;right:0;margin:auto;width:100%;height:2px;border-radius:2em;background:#333}.ham_btn .in div:nth-of-type(1){top:0;bottom:100%}.ham_btn .in div:nth-of-type(2){top:0;bottom:0}.ham_btn .in div:nth-of-type(3){top:100%;bottom:0}#nav_main{position:fixed;top:0;left:100%;z-index:900;padding:32px 24px;height:100vh;width:100%;background:#FDF7E5;overflow-y:scroll;visibility:hidden;opacity:0;transition:.4s}#nav_main.on{left:0;opacity:1;visibility:inherit}#nav_main .message{margin:0 auto;margin-bottom:32px;display:flex;justify-content:center}#nav_main .message div{position:relative;padding:.8em 1.3em;background:#51BE90;color:#fff;border-radius:1em;font-size:18px;line-height:1.5em;transform:translateX(-16px)}#nav_main .message div::before{position:absolute;right:-5px;top:0;bottom:0;margin:auto;width:20px;height:20px;content:'';display:block;background:#51BE90;transform:rotate(45deg)}#nav_main .message div::after{position:absolute;top:0;bottom:0;left:calc(100% + 16px);margin:auto;content:'';display:block;background:no-repeat url(../../image/SyulB/01.svg);background-size:contain;width:80px;height:80px}#nav_main>ul{margin:0 auto;max-width:800px;display:grid;grid-template-columns:repeat(4, 1fr);gap:24px}@media (max-width: 700px){#nav_main>ul{grid-template-columns:repeat(3, 1fr)}}@media (max-width: 530px){#nav_main>ul{grid-template-columns:repeat(2, 1fr)}}@media (max-width: 370px){#nav_main>ul{gap:16px}}#nav_main>ul>li{position:relative;width:100%;height:auto;border:2px solid #51BE90;background:#fff;box-shadow:3px 3px 8px rgba(0,0,0,0.1) inset;border-radius:32px}#nav_main>ul>li::before{padding-top:100%;content:'';display:block}#nav_main>ul>li>a{position:absolute;top:0;left:0;z-index:10;width:100%;height:100%;padding:16px;padding-top:20px;display:flex;justify-content:center;align-items:center;align-content:center;flex-wrap:wrap;text-align:center;color:#2d2920}#nav_main>ul>li>a span{margin-bottom:12px;width:100%;height:64px;display:flex;align-items:flex-end;justify-content:center}#nav_main>ul>li>a span img{height:100%;width:auto;object-fit:contain}#nav_main>ul>li nav{position:fixed;top:0;left:100%;z-index:100;padding:32px;width:100%;height:100vh;background:#FDF7E5;overflow-y:scroll;visibility:hidden;opacity:0;transition:.5s}#nav_main>ul>li nav.on{left:0;visibility:inherit;opacity:1}#nav_main>ul>li nav ul{margin:0 auto;max-width:380px;width:100%}#nav_main>ul>li nav ul li{margin-bottom:8px;width:100%;border:2px solid #51BE90;background:#fff;border-radius:32px}#nav_main>ul>li nav ul li a{padding:16px;display:block;text-align:center;color:#2d2920;line-height:1.3em}#nav_main .return{margin:32px auto;margin-bottom:0;width:184px;height:52px;display:flex;align-items:center;justify-content:center;background:#2470c7;color:#fff;font-size:14px;border-radius:4px;opacity:.9;transition:.4s}#nav_main .return:hover{transform:scale(1.1)}.main_top{height:100vh;display:flex;align-items:center;justify-content:center}.main_top .intro{transform:scale(1.2)}@media (max-width: 800px){.main_top .intro{transform:scale(1)}}.main_top .intro h1{font-family:'Fredoka One';font-size:68px;text-align:center;color:#2470c7;letter-spacing:.1em}.main_top .intro h1 span{margin-bottom:8px;font-family:'Kosugi Maru';font-size:20px;display:block;letter-spacing:.05em}.main_top .intro h1 div{position:relative}.main_top .intro h1 div div{position:absolute;top:3px;left:54px;font-family:'Kosugi Maru';font-size:12px;color:#ff543a}.main_top .intro h1 img{margin:16px 0;height:160px;width:auto}.main_top .intro i{color:#ff543a}.main_top .intro .btn{margin:0 auto;width:220px;height:53px;display:flex;align-items:center;justify-content:center;font-size:17px;color:#2470c7;border:2px solid #2470c7;border-radius:3em;cursor:pointer;transition:.5s}.main_top .intro .btn:hover{transform:scale(1.1)}#main_english_words{height:calc(100vh - 64px)}#main_english_words .header_page{height:40px;display:flex;align-items:center;justify-content:center;background:#FCDC2D}#main_english_words .header_page .ttl{font-size:14px;color:#312E2E}#main_english_words #Problem_selection{height:calc(100% - 40px);display:none;background:#fff}#main_english_words #Problem_selection.on{display:block}#main_english_words #Problem_selection section.cat_select,#main_english_words #Problem_selection section.Number_of_questions{margin:0 auto;max-width:800px;padding:32px;height:100%;overflow-y:scroll}@media (max-width: 500px){#main_english_words #Problem_selection section.cat_select,#main_english_words #Problem_selection section.Number_of_questions{padding:32px 24px}}#main_english_words #Problem_selection section.cat_select h2,#main_english_words #Problem_selection section.Number_of_questions h2{margin-bottom:16px;text-align:center;font-size:20px;color:#2470c7}#main_english_words #Problem_selection section.cat_select h2 div,#main_english_words #Problem_selection section.Number_of_questions h2 div{padding-bottom:4px;display:inline-block;border-bottom:2px solid #2470c7}#main_english_words #Problem_selection section.cat_select ul,#main_english_words #Problem_selection section.Number_of_questions ul{display:grid;grid-template-columns:repeat(4, 1fr);gap:8px}@media (max-width: 600px){#main_english_words #Problem_selection section.cat_select ul,#main_english_words #Problem_selection section.Number_of_questions ul{grid-template-columns:repeat(3, 1fr)}}@media (max-width: 500px){#main_english_words #Problem_selection section.cat_select ul,#main_english_words #Problem_selection section.Number_of_questions ul{grid-template-columns:repeat(2, 1fr)}}#main_english_words #Problem_selection section.cat_select ul li,#main_english_words #Problem_selection section.Number_of_questions ul li{padding:1em;display:flex;justify-content:center;background:#2470c7;color:#fff;border-radius:4em;transition:.4s}#main_english_words #Problem_selection section.cat_select ul li.on,#main_english_words #Problem_selection section.Number_of_questions ul li.on{background:#FCDC2D;color:#2d2920;box-shadow:3px 3px 4px rgba(0,0,0,0.2)}#main_english_words #Problem_selection section.cat_select ul li.on:hover,#main_english_words #Problem_selection section.Number_of_questions ul li.on:hover{background:#edd028}#main_english_words #Problem_selection section.cat_select ul li:hover,#main_english_words #Problem_selection section.Number_of_questions ul li:hover{background:#2168b9}#main_english_words #Problem_selection section.cat_select .next,#main_english_words #Problem_selection section.Number_of_questions .next{margin:0 auto;margin-top:24px;padding:16px;width:208px;font-size:16px;background:#FCDC2D;color:#111;text-align:center;cursor:pointer;line-height:1.4em;transition:.4s}#main_english_words #Problem_selection section.cat_select .next:hover,#main_english_words #Problem_selection section.Number_of_questions .next:hover{box-shadow:3px 3px 8px rgba(0,0,0,0.1)}#main_english_words .lesson{margin:0 auto;padding-bottom:56px;height:calc(100% - 40px);display:none;background:#777466}#main_english_words .lesson.on{display:block}#main_english_words .lesson .q{position:relative;padding:24px;padding-bottom:32px;width:100%;height:175px;display:flex;align-items:center;justify-content:center;background:#fff;font-size:32px;color:#F54F4F;font-family:'M PLUS Rounded 1c'}#main_english_words .lesson .q i{color:#2d2920;font-size:.8em}#main_english_words .lesson .q::after{position:absolute;bottom:0;right:16px;width:80px;height:80px;content:'';display:block;background:no-repeat url(../../image/SyulB/01.svg);background-size:contain}@media (max-width: 500px){#main_english_words .lesson .q::after{right:8px;width:60px;height:60px}}#main_english_words .lesson .q .q_count_bar{position:absolute;bottom:0;left:0;width:100%;background:#fff}#main_english_words .lesson .q .q_count_bar .number{margin-bottom:4px;text-align:center;font-size:14px;color:#2d2920;letter-spacing:.1em}#main_english_words .lesson .q .q_count_bar .bar{height:6px;background:#003cff}#main_english_words .lesson .ep{margin:24px 0;font-size:20px;text-align:center;color:#fff}#main_english_words .lesson .a{display:grid;grid-template-columns:1fr;gap:8px}#main_english_words .lesson .a div{margin:0 auto;width:288px;height:48px;display:flex;justify-content:center;align-items:center;background:#FCDC2D;border:2px solid #fff;border-radius:3em;font-size:18px}#main_english_words .lesson .result{padding:32px 24px;height:100%;display:flex;justify-content:center;flex-wrap:wrap;background:#fff;overflow:scroll}#main_english_words .lesson .result h1{padding-bottom:4px;text-align:center;font-size:18px;border-bottom:1px solid #000}#main_english_words .lesson .result p{margin:1em 0;width:100%;text-align:center;color:red;line-height:1.4em}#main_english_words .lesson .result ul.result_list{margin:0 auto;max-width:640px;width:100%;line-height:1.4em}#main_english_words .lesson .result ul.result_list li{padding:1em 8px;border-top:1px dotted #ccc;font-size:14px}#main_english_words .lesson .result ul.result_list li dl{display:grid;grid-template-columns:120px calc(100% - 120px)}#main_english_words .bottom_menu{position:fixed;bottom:0;left:0;margin-top:24px;width:100%;display:none;grid-template-columns:repeat(2, 1fr);gap:2px;background:#fff;visibility:hidden}#main_english_words .bottom_menu.on{display:grid;visibility:inherit}#main_english_words .bottom_menu #Restart,#main_english_words .bottom_menu #Start_over{height:56px;display:flex;align-items:center;justify-content:center;font-size:13px;background:#2470c7;color:#fff;cursor:pointer;line-height:1.2em}#main_english_words .bottom_menu #Restart div,#main_english_words .bottom_menu #Start_over div{padding-top:2px;display:flex;align-items:center}#main_english_words .bottom_menu #Restart div .icon,#main_english_words .bottom_menu #Start_over div .icon{margin-right:16px;height:20px;width:auto;fill:#fff}