#tutorial{.jnbooks-tutorial{--jnbooks-primary:#35b95a;--jnbooks-accent:#e5f871;--jnbooks-bg-alt:#fafee3;--jnbooks-text:#68615f;--jnbooks-width-pc:1094px;font-family:sans-serif;width:100%;overflow:hidden;box-sizing:border-box;padding:0 24px;background:url(/images/about/jnbooks/bg.png);background-size:63px 68px;color:var(--jnbooks-text);margin-bottom:-30px;@media (width < 768px){padding-left:16px;padding-bottom:0;padding-right:16px;padding-top:0;background-size:31.5px 34px}img{max-width:100%;height:auto}}.tutorial-h-wrap{position:relative;max-width:var(--jnbooks-width-pc);margin:0 auto;@media (width < 768px){background:#fff url(/images/about/jnbooks/main_bg_sp.png) repeat-x;background-position:bottom;background-size:52px 37px}}.tutorial-h{&.mode-deco{display:none;@media (width < 768px){display:block}}}.tutorial-h-img{display:block;@media (width < 768px){width:calc(100% + 32px);max-width:532px!important;margin-left:-16px;margin-bottom:0;margin-right:-16px;margin-top:0;height:auto!important}@media screen and (min-width:532px) and (max-width:767px){width:500px;margin-left:auto;margin-bottom:0;margin-right:auto;margin-top:0}}.tutorial-h-sub{position:absolute;bottom:16%;padding:0 2.6%;@media (width < 768px){background:#fff;position:static;margin-left:0;margin-bottom:0;margin-right:0;margin-top:0;padding-left:0;padding-bottom:0;padding-right:0;padding-top:0;&+&{margin-top:16px}}&.mode-ruelle{left:0;text-align:left;strong{font-weight:400;color:#ff0050}@media (width < 768px){text-align:center}}&.mode-jardin{right:0;text-align:right;strong{color:#00c3c8;font-weight:400}@media (width < 768px){text-align:center}}}.tutorial-h-sub-h{padding:5px 0;margin:10px 0}.tutorial-h-sub-h-img{height:min(3.4vw,37px)!important;width:auto!important;@media (width < 768px){height:min(9vw,40px)!important}}.tutorial-h-sub-d{font-size:min(1.4vw,16px);line-height:1.66;margin:0 0 10px;@media (width < 768px){font-size:min(3.6vw,16px)}}.tutorial-hero{background:var(--jnbooks-bg-alt);max-width:var(--jnbooks-width-pc);margin:0 auto;padding:0 0 36px;@media (width < 768px){padding-top:5vw}}.tutorial-hero-h{margin:0 auto 24px;max-width:721px;width:80%;@media (width < 768px){width:70%;max-width:320px}}.tutorial-hero-list-wrap{display:flex;justify-content:center}.tutorial-hero-list{list-style:none;margin:0 0 30px;padding:0 18px;@media (width < 768px){max-width:450px}}.tutorial-hero-list-item{margin:0 0 1em;padding:0;display:flex;align-items:center;font-size:22px;line-height:1.5;font-weight:400;strong{color:var(--jnbooks-primary)}@media (width < 768px){font-size:17px;font-size:clamp(14px,4.5vw,17px);line-height:1.5;align-items:flex-start;&+&{margin-top:.7em}}}.tutorial-hero-list-num{width:35px!important;height:auto;margin-right:20px;margin-top:4px;@media (width < 768px){width:2em!important;margin-right:10px}}.tutorial-hero-list-text-s{font-size:75%;@media (width < 768px){font-size:83%}}.tutorial-hero-dash{padding:0;display:inline-block;color:transparent;background-image:linear-gradient(var(--jnbooks-primary),var(--jnbooks-primary));background-position:50%;background-size:87.5% 1px;background-repeat:no-repeat;text-decoration:none;white-space:nowrap}.tutorial-points{max-width:var(--jnbooks-width-pc);margin:0 auto;background:#fff url(/images/about/jnbooks/points_bg_pc.png) no-repeat;background-size:100% auto;padding-top:60px;@media (width < 768px){width:100%;background:#fff url(/images/about/jnbooks/points_bg_sp.png) repeat-x;background-position:top;background-size:52px 37px}}.tutorial-point{position:relative;width:756px;overflow:hidden;margin:0 auto -92px;&:last-child{margin-bottom:0;padding-bottom:60px}@media (width < 768px){overflow:visible;width:343px;margin-left:auto;margin-bottom:0;margin-right:auto;margin-top:0}@media (width < 375px){transform:scale(.83);transform-origin:center top;margin-left:calc((100vw - 375px) / 2);margin-bottom:-36px;margin-right:calc((100vw - 375px) / 2);margin-top:0}&.mode-3,&.mode-4{@media (width < 768px){margin-top:-24px}@media (width < 375px){margin-top:-60px}}}.tutorial-point-main{position:absolute;top:50%;transform:translateY(-50%);.tutorial-point.mode-odd &{right:0;@media (width < 768px){left:178px}}.tutorial-point.mode-even &{@media (width < 768px){left:12px}}.tutorial-point.mode-2 &{left:45px;@media (width < 768px){left:12px;margin-top:-20px}}.tutorial-point.mode-3 &{@media (width < 768px){margin-top:-20px}}.tutorial-point.mode-4 &{@media (width < 768px){margin-top:-32px}}}.tutorial-point-h-img{width:378px;@media (width < 768px){.tutorial-point.mode-1 &,.tutorial-point.mode-2 &,.tutorial-point.mode-3 &{width:154px}.tutorial-point.mode-4 &{width:123px}}}.tutorial-point-d{font-size:15.5px;line-height:1.7;font-weight:400;color:var(--jnbooks-text);box-sizing:initial;.tutorial-point.mode-odd &{padding-left:8px}.tutorial-point.mode-even &{padding-left:125px;max-width:15em}.tutorial-point.mode-2 &{padding-left:84px;max-width:16em}@media (width < 768px){font-size:14px;.tutorial-point.mode-odd &{padding-right:0;padding-left:0;br{display:none}}.tutorial-point.mode-even &{padding-left:0;max-width:14em}.tutorial-point.mode-2 &{padding-left:0}.tutorial-point.mode-4 &{box-shadow:0 0 5px 3px #fff;background:#fff;max-width:13em}}}.tutorial-point-note{font-size:15px;font-weight:400;color:#9b8e8b;margin-top:.25em;.tutorial-point.mode-2 &{padding-left:84px}@media (width < 768px){font-size:12px;.tutorial-point.mode-even &{padding-left:0}}}.tutorial-point-img{&.mode-2,&.mode-4{text-align:right}@media (width < 768px){height:auto;.tutorial-point.mode-odd &{margin-left:-16px}.tutorial-point.mode-even &{margin-right:-16px}}}.tutorial-point-img-img{width:378px;height:auto;@media (width < 768px){.tutorial-point.mode-1 &{width:188px}.tutorial-point.mode-2 &{width:170px}.tutorial-point.mode-3 &{width:179px}.tutorial-point.mode-4 &{width:216px}}}.tutorial-register-wrap{background:url(/images/about/jnbooks/f_bg_pc.png) repeat-x;background-size:min(75px,5.580357vw) auto;margin:-30px -24px 0;padding:40px 0 0;@media (width < 768px){margin-left:-16px;margin-right:-16px;background-size:52px auto}}.tutorial-register{background-color:var(--jnbooks-bg-alt);margin:0 auto;text-align:center;font-size:18px;font-weight:700;padding:1.5em 12px 60px;@media (width < 768px){padding-bottom:45px}&.mode-bottom{margin-bottom:60px}}.tutorial-register-text{margin:.8em 0 1em;padding:0;font-weight:400;color:var(--jnbooks-text);@media (width < 768px){font-size:16px}}.tutorial-register-btn{width:304px;line-height:56px;background:var(--jnbooks-primary);border-radius:5px;display:block;margin:0 auto;transition:opacity .5s;font-size:20px;font-weight:600;text-align:center;text-decoration:none;&:link,&:visited{color:#fff}&:hover{opacity:.8}@media (width < 768px){width:315px;font-size:18px;line-height:56px}@media (width < 375px){width:264px}}}
/*# sourceMappingURL=b7bc5b983eb9ea29.css.map*/