.tutorial{width:100%;padding:var(--padding-section)}.tutorial__body{display:flex;flex-direction:column;gap:var(--section-gap)}.tutorial__body-videos{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.tutorial__body-videos .tutorial__video{border-radius:16px;overflow:hidden}.tutorial__body-videos .tutorial__video-top{position:relative;width:100%;height:500px;padding:16px;background:#42424240}.tutorial__body-videos .tutorial__video-top .tutorial__video-head{display:flex;flex-direction:column;gap:12px}.tutorial__body-videos .tutorial__video-top .tutorial__video-head h3{color:var(--color-white)}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap{display:flex;align-items:center;gap:8px}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap img{width:24px;height:24px;object-fit:cover;border-radius:50%;position:static;background:var(--color-white);z-index:1}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap span{color:var(--color-white)}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap a{padding:4px 6px;background:var(--color-bglight);border-radius:3px;line-height:100%;font-weight:600;font-size:16px}.tutorial__body-videos .tutorial__video-top .youtube{width:68px;height:90px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.tutorial__body-videos .tutorial__video-top .youtube svg{width:100%;height:100%}.tutorial__body-videos .tutorial__video-top img{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;object-fit:cover}.tutorial__body-videos .tutorial__video.blue .tutorial__video-bot{background:#00bfff}.tutorial__body-videos .tutorial__video.fiol .tutorial__video-bot{background:#80f}.tutorial__body-videos .tutorial__video.yellow .tutorial__video-bot{background:#ffe100;color:var(--color-primary)}.tutorial__body-videos .tutorial__video.grey .tutorial__video-bot{background:#8f8f8f}.tutorial__body-videos .tutorial__video.green .tutorial__video-bot{background:#63a345}.tutorial__body-videos .tutorial__video-bot{padding:24px 0;display:flex;align-items:center;justify-content:center;gap:5px;width:100%;color:var(--color-white)}.tutorial__body-instruction{display:flex;flex-direction:column;gap:16px}.tutorial__body-instruction .tutorial__item{padding:24px;display:flex;flex-direction:column;gap:16px;border:1px solid #eee;border-radius:16px}.tutorial__body-instruction .tutorial__item-wrap{display:flex;flex-direction:column;gap:12px}.tutorial__body-instruction .tutorial__item-wrap p{font-size:18px;font-weight:400}.tutorial__body-instruction .tutorial__item-wrap ul{display:flex;flex-direction:column;gap:12px}.tutorial__body-instruction .tutorial__item-wrap ul li{font-size:18px;font-weight:400;list-style:disc;list-style-position:inside;line-height:120%}.tutorial__body-instruction .tutorial__item h3{font-size:18px;font-weight:400}@media(max-width:1440px)and (min-width:721px){.tutorial__body-videos{gap:24rem}.tutorial__body-videos .tutorial__video{border-radius:16rem}.tutorial__body-videos .tutorial__video-top{height:500rem;padding:16rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head{gap:12rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap{gap:8rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap img{width:24rem;height:24rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap a{padding:4rem 6rem;border-radius:3rem;font-size:16rem}.tutorial__body-videos .tutorial__video-top .youtube{width:68rem;height:90rem}.tutorial__body-videos .tutorial__video-bot{padding:24rem 0;gap:5rem}.tutorial__body-instruction{gap:16rem}.tutorial__body-instruction .tutorial__item{padding:24rem;gap:16rem;border:1rem solid #eee;border-radius:16rem}.tutorial__body-instruction .tutorial__item-wrap{gap:12rem}.tutorial__body-instruction .tutorial__item-wrap p{font-size:18rem}.tutorial__body-instruction .tutorial__item-wrap ul{gap:12rem}.tutorial__body-instruction .tutorial__item-wrap ul li,.tutorial__body-instruction .tutorial__item h3{font-size:18rem}}@media(max-width:720px){.tutorial__body-videos{gap:24rem;grid-template-columns:1fr}.tutorial__body-videos .tutorial__video{border-radius:16rem}.tutorial__body-videos .tutorial__video-top{height:400rem;padding:16rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head{gap:12rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap{gap:8rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap img{width:24rem;height:24rem}.tutorial__body-videos .tutorial__video-top .tutorial__video-head .head__wrap a{padding:4rem 6rem;border-radius:3rem;font-size:14rem}.tutorial__body-videos .tutorial__video-top .youtube{width:68rem;height:90rem}.tutorial__body-videos .tutorial__video-bot{padding:24rem 0;gap:5rem}.tutorial__body-instruction{gap:16rem}.tutorial__body-instruction .tutorial__item{padding:24rem;gap:16rem;border:1rem solid #eee;border-radius:16rem}.tutorial__body-instruction .tutorial__item-wrap{gap:12rem}.tutorial__body-instruction .tutorial__item-wrap p{font-size:18rem}.tutorial__body-instruction .tutorial__item-wrap ul{gap:12rem}.tutorial__body-instruction .tutorial__item-wrap ul li,.tutorial__body-instruction .tutorial__item h3{font-size:18rem}}