body,html{font-family:Poppins,'Hiragino Maru Gothic Pro',Mairyo,sans-serif}#contents{width:1024px;min-height:100vh;position:static;margin:0 auto;text-align:center}header{width:1024px;height:80px;padding:0 24px}header .unit-title-box{display:flex}header .unit-number,header h1.unit-title{line-height:inherit;display:inline-block;margin:0;font-size:28px}header h1.unit-title{margin-left:1em}header .ico_header_back,header .ico_header_close,header .ico_header_help,header .ico_header_menu{width:auto;height:32px}#button .btn{border:none}header .btn-floating{position:absolute;top:20px;right:20px;display:flex;align-items:center;width:60px;height:60px;background-color:#74a6a5;border-radius:50%}header .btn-floating i{width:inherit;display:inline-block;text-align:center;color:#fff;font-size:1.6rem;line-height:37px}header .btn-floating:hover{background-color:#79b3b2}header .btn-floating.btn_disabled{opacity:1;background-color:#7bb8b7}header .btn-floating.btn_disabled i{color:#98cac9}header details[open] .btn-floating{background-color:#fff}header details[open] .btn-floating i{color:#74a6a5;transform:rotate(45deg)}header .btn-floating,header .btn-floating:hover{box-shadow:0 3px 0 rgb(0 0 0 / .16)}header svg.icon{width:30px;height:30px;fill:#fff}#slide{margin:0 auto}div.visual-cont-box{width:100%;height:calc(100vh - 210px)}div.visual-img-box{height:auto}img.visual-img{max-height:inherit;margin:0 auto}div.visual-text-box{height:auto;margin:0 auto;padding:30px 40px 0}p.visual-text{text-align:left;color:#fff;font-size:38px;line-height:1.2}p.visual-text-japanese{text-align:left;color:#fff;font-size:34px;line-height:1.2}p.inactive{opacity:.3}p.visual-text em.underline{font-style:normal;text-decoration:underline;color:#ffff43}p.visual-text em.underline span{color:#fff}p.visual-text em.color{font-style:normal;color:#ffff43}div.overlay{display:inline-flex;align-items:center;position:absolute;top:0;left:50%;transform:translateX(-50%);width:100%;height:100%;margin:0 auto}div.overlay p{color:#fff;font-size:4.687vw;line-height:1.4}.UnitTitle{width:90%;height:auto;margin:0 auto;padding-top:30px}.UnitTitle span.unit-number{display:block;font-size:32px;font-weight:600;color:#fff;margin:0;padding:0}.UnitTitle span.example-sentence,.UnitTitle span.unit-title-ja{display:inline-block;font-size:40px;font-weight:500;color:#fff;margin:4px auto 0;padding:32px 10px;line-height:1.1;text-align:center;text-shadow:0 2px 0 rgb(0 0 0 / .16)}.UnitTitle span.example-sentence em{text-decoration:underline;font-style:normal}.UnitTitle span.example-sentence span{display:block;font-size:28px;font-weight:400;margin-top:.4em}#Step4.last .UnitTitle{color:#fff;padding:40px 20px}#Step4.last .UnitTitle span.unit-number{color:#fff}#Step4.last .UnitTitle span.unit-title-ja{color:#fff;border:none;margin:.3em 0 0 0;padding:0}@media screen and (max-width:1023px){#button,#contents,header{width:800px}div.visual-cont-box{max-width:720px;margin:0 auto}div.visual-img-box{max-height:49vh}img.visual-img{box-shadow:0 4px 0 0 rgb(0 0 0 / .2);border-radius:0 0 8px 8px}div.visual-text-box{padding:2vh 0 0;max-width:720px}.UnitTitle{width:100%;padding-top:2vh}.UnitTitle span.unit-number{font-size:calc(12px + ((1vh - 4.3px) * 1.9251));font-size:28px}.UnitTitle span.example-sentence,.UnitTitle span.unit-title-ja{margin-top:.293vh;font-size:calc(16px + ((1vh - 4.3px) * 2.3529));font-size:36px}.UnitTitle span.example-sentence span{font-size:calc(11px + ((1vh - 4.3px) * 1.6043));font-size:25px}}@media screen and (max-height:1365px){div.visual-cont-box{width:976px;margin:0 auto}div.visual-img-box{max-height:63vh}img.visual-img{box-shadow:0 4px 0 0 rgb(0 0 0 / .2);border-radius:8px}#Step4.last img.visual-img{box-shadow:0 4px 0 0 rgb(0 0 0 / .2)}div.visual-text-box{padding:30px 0 0}div.overlay{border-radius:8px}#Step3.last div.visual-cont-box,.record-last-image{max-height:calc(100vh - (210px + 4px))}.UnitTitle{width:100%;padding-top:2vh}.UnitTitle span.unit-number{font-size:calc(24px + ((1vh - 8px) * .7279))}.UnitTitle span.example-sentence,.UnitTitle span.unit-title-ja{margin-top:.293vh;padding:1.465vh 10px;font-size:calc(28px + ((1vh - 8px) * 1.4159))}.UnitTitle span.example-sentence span{font-size:calc(22px + ((1vh - 8px) * .5309))}#Step4.last .UnitTitle{padding:20px 0}}@media screen and (max-height:1230px){div.visual-img-box{max-height:61.5vh}div.visual-text-box{padding:2vh 0 0 20px;width:calc(880px + ((1vh - 8px) * 22.3256))}p.visual-text{font-size:calc(24px + ((1vh - 8px) * 2.8319))}p.visual-text-japanese{font-size:3vh}}@media screen and (max-height:1079px){header{height:56px}header .unit-number,header h1.unit-title{font-size:24px}header .ico_header_back,header .ico_header_close,header .ico_header_help,header .ico_header_menu{height:26px}.point-text,div.visual-cont-box{height:calc(100vh - 166px)}#Step3.last div.visual-cont-box,.record-last-image{max-height:calc(100vh - (166px + 4px))}div.visual-text-box{padding-left:40px}}@media screen and (max-height:799px){#button,#contents,header{width:800px}header{height:48px}header .unit-number,header h1.unit-title{font-size:20px}header .ico_header_back,header .ico_header_close,header .ico_header_help,header .ico_header_menu{height:22px}div.visual-cont-box{width:720px}.point-text,div.visual-cont-box{height:calc(100vh - 118px)}div.visual-text-box{width:calc(480px + ((1vh - 4.3px) * 65.0407))}p.visual-text-japanese{font-size:3.1vh}#Step3.last div.visual-cont-box,.record-last-image{max-height:calc(100vh - (118px + 4px))}.UnitTitle{width:100%;padding-top:2vh}.UnitTitle span.unit-number{font-size:calc(12px + ((1vh - 4.3px) * 3.252))}.UnitTitle span.example-sentence,.UnitTitle span.unit-title-ja{margin-top:.293vh;padding:1.377vh 8px;font-size:calc(16px + ((1vh - 4.3px) * 3.252))}.UnitTitle span.example-sentence span{font-size:calc(11px + ((1vh - 4.3px) * 2.439))}#Step4.last .UnitTitle{padding:15px 20px}#Step4.last .UnitTitle span.unit-title-ja{margin-top:0}}@media screen and (max-height:630px){header{height:40px}header .unit-number,header h1.unit-title{font-size:17px}.point-text,div.visual-cont-box{height:calc(100vh - 110px)}div.visual-img-box{max-height:61.5vh}}@media screen and (max-height:560px){div.visual-img-box{max-height:58vh}}@media screen and (max-height:500px){div.visual-img-box{max-height:55vh}}@media screen and (max-width:800px){#contents,header{width:100%}header .unit-number,header h1.unit-title{font-size:calc(20px + ((1vw - 6px) * 1.8913))}div.visual-cont-box{width:100%;max-width:none;height:calc(100vh - 184px)}.last div.visual-cont-box{width:100%}div.visual-img-box{display:block;max-height:none}#Step4.last img.visual-img,img.visual-img{box-shadow:none;border-radius:0}div.visual-text-box{width:100%;max-width:none;padding-left:4vw;padding-right:4vw}div.overlay{width:100%;border-radius:0}img.wave-img{position:absolute;left:0}p.visual-text{font-size:calc(22px + ((1vw - 4.79px) * 3.4268))}p.visual-text-japanese{font-size:calc(22px + ((1vw - 4.79px) * 2.4922));margin-bottom:16px}.UnitTitle{width:90vw;margin:0 auto;padding-top:1.3vh}.UnitTitle span.unit-number{font-size:3.385vw}.UnitTitle span.example-sentence,.UnitTitle span.unit-title-ja{margin-top:0;padding:1.7vh 10px;font-size:4.167vw;border-width:1px}.UnitTitle span.example-sentence span{font-size:2.865vw}#Step4.last #button,#Step4.last .UnitTitle,.UnitTitle{width:100%}#Step4.last .UnitTitle{border-radius:0}}@media screen and (max-width:599px){header{height:56px}header .ico_header_back,header .ico_header_close,header .ico_header_menu{height:26px}header .btn-floating{width:40px;height:40px;top:35px}.point-text,div.visual-cont-box{height:calc(100vh - 166px)}.record-last-image{max-height:calc(100vh - 166px);height:inherit}p.visual-text{font-size:4.6vw}}@media screen and (max-width:480px){header .unit-number{font-size:20px}header h1.unit-title{font-size:calc(14px + ((1vw - 3.2px) * 3.7736))}header .ico_header_back,header .ico_header_close,header .ico_header_menu{height:22px}.point-text,div.visual-cont-box{height:calc(100vh - 146px)}.record-last-image{max-height:calc(100vh - 146px)}div.visual-text-box{padding:16px}p.visual-text-japanese{margin-bottom:8px;font-size:4.5vw}.UnitTitle span.unit-number{font-size:4.175vw}.UnitTitle span.example-sentence,.UnitTitle span.unit-title-ja{font-size:5.01vw}.UnitTitle span.example-sentence span{font-size:3.34vw}}@media screen and (max-width:320px){header h1.unit-title{font-size:14px}.point-text,div.visual-cont-box{height:calc(100vh - 126px)}div.visual-text-box{padding:8px 10px}p.visual-text{margin-bottom:0}}