.zegra-tutorial{--zegra-primary:#1964ff;--zegra-accent:#00e6ff;--zegra-paleblue:#d4fbff;font-family:sans-serif;width:100%;overflow:hidden;position:relative;padding-bottom:32px;@media screen and (width < 768px){padding-bottom:0}img{max-width:100%;height:auto}}.tutorial-h-wrap{padding-top:80px;max-width:1074px;margin:0 auto;@media screen and (max-width:1100px){padding-top:60px}@media screen and (width < 768px){padding-top:5px;width:100%;overflow:hidden}}.tutorial-h-img{width:100%}.tutorial-h{margin:0}.tutorial-hero-h{width:625.33333333px;margin:50px auto 48px;@media screen and (max-width:1100px){width:67vw}@media screen and (width < 768px){width:89.866667vw;margin-left:auto;margin-bottom:8vw;margin-right:auto;margin-top:8.8vw}}.tutorial-hero-list-wrap{display:flex;justify-content:center}.tutorial-hero-list{list-style:none;margin:0 0 30px;padding:0 18px 0 48px;@media screen and (width < 768px){padding-left:8vw;padding-bottom:0;padding-right:6vw;padding-top:0}}.tutorial-hero-list-item{margin:0 0 1em;padding:0;display:flex;align-items:center;font-size:21px;line-height:1;font-weight:600;strong{color:var(--zegra-primary);font-size:25px}@media screen and (width < 768px){font-size:4vw;line-height:1.5;align-items:flex-start;strong{font-size:5vw}}}.tutorial-hero-list-num{margin-right:20px;width:35px;height:auto;@media screen and (width < 768px){width:1.5em!important;margin-right:1em;position:relative;top:.3em}}.tutorial-register{text-align:center;max-width:728px;margin:0 auto;@media screen and (width < 768px){max-width:none}&.mode-bottom{margin-bottom:60px;border-radius:30px;padding-top:30px;background:var(--zegra-primary);@media screen and (width < 768px){margin-bottom:10vw;border-radius:0}}}.tutorial-register-top{margin-bottom:8%;margin-top:-1px;@media screen and (width < 768px){margin-bottom:12vw}}.tutorial-register-top-img{display:block}.tutorial-register-text{color:#fff;margin:.8em 0 .6em;padding:0;font-weight:600;font-size:18px;&.mode-bottom{margin:.8em 0 0}@media screen and (width < 768px){font-size:4.5vw}}.tutorial-register-btn{width:407px;line-height:84px;border-radius:5px;display:inline-block;transition:opacity .5s;font-size:24px;position:relative;z-index:1;&:link,&:visited{color:#fff}&:hover{opacity:.8}&.mode-bottom{width:348px}@media screen and (width < 768px){width:74.666667vw!important;line-height:1}}.tutorial-register-f{position:relative;z-index:0;margin-top:-96px;bottom:-43px;@media screen and (width < 768px){margin-top:-10vw;bottom:-5.8vw}}.tutorial-register-f-img{display:block}.tutorial-points{width:728px;margin:50px auto 30px;padding-top:40px;background:url(/images/about/manga-zegra/points_bg.png) top no-repeat;--bg-y:0;background-position:center var(--bg-y);@media screen and (width < 768px){width:100%;overflow:hidden;margin-left:0;margin-bottom:0;margin-right:0;margin-top:0;padding-top:15vw;background-size:200vw}}.tutorial-point{position:relative;width:100%;margin:0 0 40px;@media screen and (width < 768px){margin-bottom:16vw;padding-left:4.5vw;padding-bottom:0;padding-right:4.5vw;padding-top:0;width:calc(100% - 9vw)}}.tutorial-point-main{position:absolute;top:50%;transform:translateY(-50%);@media screen and (width < 768px){position:static;transform:none;margin-bottom:6vw}.tutorial-point.mode-even &{left:342px}.tutorial-point.mode-odd &{left:0}}.tutorial-point-h{@media screen and (width < 768px){margin-left:0;margin-bottom:3.2vw;margin-right:0;margin-top:0}}.tutorial-point-h-img{width:auto;max-width:none!important;width:428px;@media screen and (width < 768px){width:86.666667vw}}.tutorial-point-d{font-size:15.5px;line-height:1.7;font-weight:400;color:#222;box-sizing:initial;.tutorial-point.mode-even &{padding-left:37px}.tutorial-point.mode-odd &{padding-left:40px;max-width:23em}@media screen and (width < 768px){font-size:4vw;padding-left:8vw;padding-right:6vw}}.tutorial-point-note{font-size:15px;font-weight:400;color:#808080;margin-top:.66em;.tutorial-point.mode-odd &{padding-left:40px}@media screen and (width < 768px){font-size:3.46vw;padding-left:8vw}}.tutorial-point-img{&.mode-1,&.mode-3{text-align:right}@media screen and (width < 768px){text-align:center!important}}.tutorial-point-img-img{width:282px;height:auto;@media screen and (width < 768px){width:74vw}.tutorial-point-img.mode-3 &{width:306px;@media screen and (width < 768px){width:85vw}}}
/*# sourceMappingURL=2d8d09da9a5347f4.css.map*/