.no-scroll{overflow:hidden}@media(max-width:767px){.no-scroll{position:fixed}}.main-layout{background:#fff;padding:64px}@media(max-width:1023px){.main-layout{width:100vw;max-width:100vw}}.main-layout__action{margin-right:16px}.main-layout__action .ld-icon{fill:#fff;stroke:#fff}.main-layout h1,.main-layout h3{display:inline-block}.main-layout h3{font-family:stagbook,sans-serif;color:#707070;font-size:20px;line-height:20px;position:relative;width:100%;padding:24px 16px 16px;margin-bottom:32px}@media(max-width:1023px){.main-layout h3{font-size:24px;line-height:24px}}.main-layout h3:before{content:"";display:block;position:absolute;left:0;bottom:0;height:1px;width:400px;background:#b4b4b4}@media(max-width:1023px){.main-layout h3{min-width:100vw;padding:24px 16px}}.main-layout h3+p{padding-left:16px}.main-layout h4{font-family:stagsansbook,sans-serif;color:#707070;font-size:18px;line-height:18px;margin:8px 0 16px}.main-layout__list{padding:24px 0;width:100%}.main-layout__item .ld-dropdown{width:100%}.main-layout__item .ld-dropdown__button{border-radius:0;border:0;border-bottom:1px solid #b4b4b4;padding:16px}.main-layout__item .ld-dropdown__arrow{right:24px}.main-layout__item .ld-dropdown__menu{background:#fff3ee;border-bottom:1px solid #e1e1e1}.main-layout__header{position:fixed;width:100%;display:flex;align-items:center;background:#3f1472;padding:16px;top:0;left:0;z-index:6}.main-layout__header h1{font-family:stagbook,sans-serif;color:#fff;font-size:20px;line-height:20px}@media(max-width:1023px){.main-layout__header h1{font-size:24px;line-height:24px}}.main-layout__menu ::v-deep .ld-drawer__content{padding-top:8px;width:300px;background:#fff}.main-layout__menu h1{font-family:stagbook,sans-serif;color:#333;font-size:20px;line-height:20px;color:#3f1472;margin:16px}@media(max-width:1023px){.main-layout__menu h1{font-size:24px;line-height:24px}}.main-layout__menu .main-layout__action{float:right;margin:16px 16px 0 0}.main-layout__menu .main-layout__action .ld-icon{fill:#3f1472;stroke:#3f1472}.main-layout__main{background:#fff;margin-top:64px}pre{position:relative;display:inline-block;vertical-align:top;margin:0 24px 24px 0;padding:32px;background:#fff;width:auto}@media(max-width:1023px){pre{display:inline-block;margin:24px 0;white-space:pre-wrap;max-width:100%}}pre:after{font-family:stagsansbook,sans-serif;color:#707070;font-size:14px;line-height:14px;margin-bottom:8px;content:"HTML";display:block;position:absolute;right:8px;top:8px}@media(max-width:1023px){pre:after{font-family:stagsansbook,sans-serif}}.js:after{content:"JS"}.scss:after{content:"SCSS"}.no-scroll[data-v-5b9fa3f0]{overflow:hidden}@media(max-width:767px){.no-scroll[data-v-5b9fa3f0]{position:fixed}}.directive-scroll-block h1[data-v-5b9fa3f0],.directive-scroll-block h2[data-v-5b9fa3f0]{font-family:stagsansbook,sans-serif;color:#333;font-size:18px;line-height:18px;margin-bottom:16px;line-height:20px}.directive-scroll-block h3[data-v-5b9fa3f0]{font-family:stagbook,sans-serif;color:#707070;font-size:20px;line-height:20px;position:relative;display:inline-block;width:100%;padding:24px 16px 16px;margin-bottom:32px}@media(max-width:1023px){.directive-scroll-block h3[data-v-5b9fa3f0]{font-size:24px;line-height:24px}}.directive-scroll-block h3[data-v-5b9fa3f0]:before{content:"";display:block;position:absolute;left:0;bottom:0;height:1px;width:400px;background:#b4b4b4}@media(max-width:1023px){.directive-scroll-block h3[data-v-5b9fa3f0]{min-width:100vw;padding:24px 16px}}.directive-scroll-block p[data-v-5b9fa3f0]{font-family:stagsansbook,sans-serif;color:#333;font-size:16px;line-height:23px;margin:10px 0;padding-left:16px}.directive-scroll-block ul[data-v-5b9fa3f0]{padding-left:48px;margin-bottom:16px}.directive-scroll-block li[data-v-5b9fa3f0]{font-family:stagsansbook,sans-serif;color:#707070;font-size:16px;line-height:16px;list-style:disc;line-height:24px}@media(max-width:1023px){.directive-scroll-block li[data-v-5b9fa3f0]{font-size:18px;line-height:18px}}.directive-scroll-block__demo[data-v-5b9fa3f0]{display:inline-block;margin:16px;width:300px;height:300px;overflow:scroll;overflow-x:scroll;padding:150px 100px;background:#876ca6;border:1px solid #333}.directive-scroll-block__demo[data-v-5b9fa3f0] ::-webkit-scrollbar{width:7px}.directive-scroll-block__demo[data-v-5b9fa3f0] ::-webkit-scrollbar-track{border-radius:5px;background:rgba(0,0,0,.1)}.directive-scroll-block__demo[data-v-5b9fa3f0] ::-webkit-scrollbar-thumb,.directive-scroll-block__demo[data-v-5b9fa3f0] ::-webkit-scrollbar-thumb:window-inactive{border-radius:5px;background:rgba(0,0,0,.2)}.directive-scroll-block__demo[data-v-5b9fa3f0] ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.3)}.directive-scroll-block__demo--scrolling[data-v-5b9fa3f0]{background:#59ad33}.directive-scroll-block__demo p[data-v-5b9fa3f0]{font-family:stagbook,sans-serif;color:#333;font-size:20px;line-height:20px;color:#fff;display:inline-block;white-space:nowrap;position:relative;width:180px;text-align:center}@media(max-width:1023px){.directive-scroll-block__demo p[data-v-5b9fa3f0]{font-size:24px;line-height:24px}}.directive-scroll-block__demo .ld-icon[data-v-5b9fa3f0]{position:absolute;stroke:#fff;color:#fff;top:-200%;left:50%}.directive-scroll-block__demo .ld-icon[data-v-5b9fa3f0]:nth-child(2){top:0;left:100%}.directive-scroll-block__demo .ld-icon[data-v-5b9fa3f0]:nth-child(3){top:250%;left:50%}.directive-scroll-block__demo .ld-icon[data-v-5b9fa3f0]:nth-child(4){top:0;left:0}.no-scroll[data-v-54eaff7e]{overflow:hidden}@media(max-width:767px){.no-scroll[data-v-54eaff7e]{position:fixed}}.directive-touch-block h1[data-v-54eaff7e],.directive-touch-block h2[data-v-54eaff7e]{font-family:stagsansbook,sans-serif;color:#333;font-size:18px;line-height:18px;margin-bottom:16px;line-height:20px}.directive-touch-block h3[data-v-54eaff7e]{font-family:stagbook,sans-serif;color:#707070;font-size:20px;line-height:20px;position:relative;display:inline-block;width:100%;padding:24px 16px 16px;margin-bottom:32px}@media(max-width:1023px){.directive-touch-block h3[data-v-54eaff7e]{font-size:24px;line-height:24px}}.directive-touch-block h3[data-v-54eaff7e]:before{content:"";display:block;position:absolute;left:0;bottom:0;height:1px;width:400px;background:#b4b4b4}@media(max-width:1023px){.directive-touch-block h3[data-v-54eaff7e]{min-width:100vw;padding:24px 16px}}.directive-touch-block p[data-v-54eaff7e]{font-family:stagsansbook,sans-serif;color:#333;font-size:16px;line-height:23px;margin:10px 0;padding-left:16px}.directive-touch-block ul[data-v-54eaff7e]{padding-left:48px;margin-bottom:16px}.directive-touch-block li[data-v-54eaff7e]{font-family:stagsansbook,sans-serif;color:#707070;font-size:16px;line-height:16px;list-style:disc;line-height:24px}@media(max-width:1023px){.directive-touch-block li[data-v-54eaff7e]{font-size:18px;line-height:18px}}.directive-touch-block__demo[data-v-54eaff7e]{display:inline-block;margin:16px;width:300px;height:300px;overflow:scroll;overflow-x:scroll;padding:150px 100px;background:#876ca6;border:1px solid #333}.directive-touch-block__demo[data-v-54eaff7e] ::-webkit-scrollbar{width:7px}.directive-touch-block__demo[data-v-54eaff7e] ::-webkit-scrollbar-track{border-radius:5px;background:rgba(0,0,0,.1)}.directive-touch-block__demo[data-v-54eaff7e] ::-webkit-scrollbar-thumb,.directive-touch-block__demo[data-v-54eaff7e] ::-webkit-scrollbar-thumb:window-inactive{border-radius:5px;background:rgba(0,0,0,.2)}.directive-touch-block__demo[data-v-54eaff7e] ::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.3)}.directive-touch-block__demo--swiping[data-v-54eaff7e]{background:#59ad33}.directive-touch-block__demo p[data-v-54eaff7e]{font-family:stagbook,sans-serif;color:#333;font-size:20px;line-height:20px;color:#fff;display:inline-block;white-space:nowrap;position:relative;width:180px;text-align:center}@media(max-width:1023px){.directive-touch-block__demo p[data-v-54eaff7e]{font-size:24px;line-height:24px}}.directive-touch-block__demo .ld-icon[data-v-54eaff7e]{position:absolute;stroke:#fff;color:#fff;top:-200%;left:50%}.directive-touch-block__demo .ld-icon[data-v-54eaff7e]:nth-child(2){top:0;left:100%}.directive-touch-block__demo .ld-icon[data-v-54eaff7e]:nth-child(3){top:250%;left:50%}.directive-touch-block__demo .ld-icon[data-v-54eaff7e]:nth-child(4){top:0;left:0}@font-face{font-display:swap;font-family:stagbook;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Book.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Book.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Book.otf) format("opentype")}@font-face{font-display:swap;font-family:stagbookitalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-BookItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-BookItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-BookItalic.otf) format("opentype")}@font-face{font-display:swap;font-family:staglight;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Light.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Light.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Light.otf) format("opentype")}@font-face{font-display:swap;font-family:staglightitalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-LightItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-LightItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-LightItalic.otf) format("opentype")}@font-face{font-display:swap;font-family:stagmedium;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Medium.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Medium.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-Medium.otf) format("opentype")}@font-face{font-display:swap;font-family:stagmediumitalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-MediumItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-MediumItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/Stag-MediumItalic.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsansbook;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Book.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Book.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Book.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsansbookitalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-BookItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-BookItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-BookItalic.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsanslight;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Light.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Light.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Light.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsanslightitalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-LightItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-LightItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-LightItalic.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsansmedium;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Medium.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Medium.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Medium.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsansmediumitalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-MediumItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-MediumItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-MediumItalic.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsanssemibold;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Semibold.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Semibold.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-Semibold.otf) format("opentype")}@font-face{font-display:swap;font-family:stagsanssemibolditalic;src:url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-SemiboldItalic.woff) format("woff"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-SemiboldItalic.ttf) format("truetype"),url(https://s3-ap-southeast-2.amazonaws.com/dolphin-framework/fonts/StagSans-SemiboldItalic.otf) format("opentype")}.no-scroll[data-v-18734fec]{overflow:hidden}@media(max-width:767px){.no-scroll[data-v-18734fec]{position:fixed}}.directive-view[data-v-18734fec]{width:100vw;max-width:1200px;padding:64px 0 120px;margin:0 auto}@media(max-width:1023px){.directive-view[data-v-18734fec]{width:100vw;max-width:100vw}}.directive-view h3[data-v-18734fec]{font-family:stagbook,sans-serif;color:#707070;font-size:20px;line-height:20px;position:relative;display:inline-block;width:100%;padding:24px 16px 16px;margin-bottom:32px}@media(max-width:1023px){.directive-view h3[data-v-18734fec]{font-size:24px;line-height:24px}}.directive-view h3[data-v-18734fec]:before{content:"";display:block;position:absolute;left:0;bottom:0;height:1px;width:400px;background:#b4b4b4}@media(max-width:1023px){.directive-view h3[data-v-18734fec]{min-width:100vw;padding:24px 16px}}