#tutorial{.growl-tutorial{--growl-primary:#13c3c3;--growl-accent:#00e6ff;--growl-paleblue:#d4fbff;font-family:sans-serif;width:100%;overflow:hidden;position:relative;padding-bottom:32px;margin-bottom:30px;@media (width < 768px){padding-bottom:0}img{max-width:100%;height:auto}}.tutorial-h-h{width:47%;margin:0 auto -6%;position:relative;z-index:1;left:-3%;@media (width < 768px){width:65.866667vw;position:static;margin-left:auto;margin-bottom:0;margin-right:auto;margin-top:8vw}}.tutorial-h-wrap{padding-top:80px;max-width:916px;margin:0 auto;@media (width < 768px){padding-top:5px;width:100%;overflow:hidden}}.tutorial-h-img{width:100%}.tutorial-hero-h{width:515px;margin:36px auto 48px;@media (width < 768px){width:89.866667vw;margin-left:auto;margin-bottom:8vw;margin-right:auto;margin-top:16.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 (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:22px;line-height:1;font-weight:600;strong{color:var(--growl-primary)}@media (width < 768px){font-size:4.5vw;line-height:1.5;align-items:flex-start}}.tutorial-hero-list-num{margin-right:20px;width:35px;height:auto;@media (width < 768px){width:1.5em!important;margin-right:1em}}.tutorial-register{text-align:center;max-width:728px;margin:0 auto;@media (width < 768px){max-width:none}&.mode-bottom{margin-bottom:60px;background:var(--growl-primary);@media (width < 768px){margin-bottom:10vw}}}.tutorial-register-top{margin-bottom:8%;margin-top:-1px;@media (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;&.mode-bottom{font-size:16px;margin:.8em 0 0;color:#222}@media (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 (width < 768px){width:74.666667vw!important;line-height:1}}.tutorial-register-f{position:relative;margin:-9%;bottom:-25px;z-index:0;@media (width < 768px){margin-left:-6.66vw;margin-bottom:-6.66vw;margin-right:-6.66vw;margin-top:-6.66vw;margin-left:0;margin-bottom:0;margin-right:0;margin-top:-10vw}}.tutorial-register-f-img{display:block}.tutorial-points{width:728px;margin:50px auto 30px;padding-top:80px;background:url(/images/about/comic-growl/border.png) top no-repeat;background-size:728px 35px;@media (width < 768px){width:100%;overflow:hidden;background-size:141.3333vw 6.6666vw;margin-left:0;margin-bottom:0;margin-right:0;margin-top:14vw;padding-top:20vw}}.tutorial-point{position:relative;width:100%;margin:0 0 80px;@media (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 (width < 768px){position:static;transform:none;margin-bottom:6vw}.tutorial-point.mode-odd &{left:342px}.tutorial-point.mode-even &{left:0}}.tutorial-point-h{@media (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;&.mode-1{width:363px}&.mode-2{width:412px}&.mode-3{width:399px}&.mode-4{width:402px}@media (width < 768px){&.mode-1{width:76.36vw}&.mode-2{width:86.666667vw}&.mode-3{width:83.933333vw}&.mode-4{width:84.562667vw}}}.tutorial-point-d{font-size:15.5px;line-height:1.7;font-weight:400;color:#222;box-sizing:initial;.tutorial-point.mode-odd &{padding-left:37px}.tutorial-point.mode-even &{padding-left:40px;max-width:23em}@media (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-even &{padding-left:40px}@media (width < 768px){font-size:3.46vw;padding-left:8vw}}.tutorial-point-img{&.mode-2,&.mode-4{text-align:right}@media (width < 768px){text-align:center!important}}.tutorial-point-img-img{width:281px;height:auto;@media (width < 768px){width:64vw}}}
/*# sourceMappingURL=d08ea39ec5f68ebc.css.map*/