spuit 0.0.14.2 → 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.npmignore +10 -6
- data/Gemfile.lock +1 -1
- data/README.md +20 -1
- data/assets/html/index.ejs +328 -0
- data/assets/javascripts/scripts.js +3 -3
- data/assets/stylesheets/styles.scss +8 -3
- data/dist/favicon.ico +0 -0
- data/dist/index.html +1 -323
- data/dist/javascripts/scripts.js +1 -1
- data/dist/stylesheets/styles.css +2 -2
- data/lib/spuit/version.rb +1 -1
- data/package.json +19 -18
- data/scss/{components → _}/_body.sass +0 -0
- data/scss/{components → _}/_form.sass +0 -0
- data/scss/{components → _}/_gist.sass +0 -0
- data/scss/{components → _}/_grids.sass +0 -0
- data/scss/{components → _}/_markdown.sass +0 -0
- data/scss/components/_button.scss +140 -0
- data/scss/components/_messages.scss +23 -0
- data/scss/components/{_shoulder.sass → _shoulder.scss} +6 -5
- data/scss/components/_split.scss +45 -0
- data/scss/components/_triangle.scss +50 -0
- data/scss/components/_wordwrap-fadeout.scss +22 -0
- data/scss/components/_wrap.scss +27 -0
- data/scss/elements/_dl.scss +40 -0
- data/scss/elements/_fieldset.scss +63 -0
- data/scss/elements/_hr.scss +39 -0
- data/scss/elements/_input.scss +35 -0
- data/scss/elements/_table.scss +102 -0
- data/scss/{components → includes}/_icon.scss +0 -0
- data/scss/spuit.scss +1 -4
- data/scss/variables/_timing-functions.scss +37 -0
- data/spuit.scss +1 -46
- data/webpack/css.webpack.config.js +37 -5
- data/webpack/js.webpack.config.js +13 -8
- data/yarn.lock +3390 -4480
- metadata +23 -22
- data/.editorconfig +0 -11
- data/scss/components/_button.sass +0 -116
- data/scss/components/_messages.sass +0 -18
- data/scss/components/_split.sass +0 -32
- data/scss/components/_triangle.sass +0 -40
- data/scss/components/_wordwrap-fadeout.sass +0 -19
- data/scss/components/_wrap.sass +0 -22
- data/scss/elements/_dl.sass +0 -30
- data/scss/elements/_fieldset.sass +0 -46
- data/scss/elements/_hr.sass +0 -36
- data/scss/elements/_input.sass +0 -27
- data/scss/elements/_table.sass +0 -58
- data/scss/variables/_timing-functions.sass +0 -37
data/dist/javascripts/scripts.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
!function(e){var
|
1
|
+
!function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t){}]);
|
data/dist/stylesheets/styles.css
CHANGED
@@ -1,3 +1,3 @@
|
|
1
|
-
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,700);@keyframes anim-spin{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes anim-float{0%{transform:translateY(0)}50%{transform:translateY(20%)}to{transform:translateY(0)}}@keyframes anim-arrow{0%{transform:translateX(0)}50%{transform:translateX(20%)}to{transform:translateX(0)}}@keyframes anim-scale{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}
|
1
|
+
@charset "UTF-8";@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,700);@keyframes anim-spin{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes anim-float{0%{transform:translateY(0)}50%{transform:translateY(20%)}to{transform:translateY(0)}}@keyframes anim-arrow{0%{transform:translateX(0)}50%{transform:translateX(20%)}to{transform:translateX(0)}}@keyframes anim-scale{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}
|
2
2
|
|
3
|
-
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.container{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container{padding-right:15px;padding-left:15px}}@media (min-width:34em){.container{width:540px;max-width:100%;box-sizing:border-box}}@media (min-width:48em){.container{width:720px;max-width:100%;box-sizing:border-box}}@media (min-width:62em){.container{width:960px;max-width:100%;box-sizing:border-box}}@media (min-width:75em){.container{width:1140px;max-width:100%;box-sizing:border-box}}.container-fluid{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container-fluid{padding-right:15px;padding-left:15px}}.row{display:flex;flex-wrap:wrap;box-sizing:border-box;margin-right:-15px;margin-left:-15px}@media (min-width:34em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:48em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:62em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:75em){.row{margin-right:-15px;margin-left:-15px}}.no-gutters{margin-right:0;margin-left:0}.no-gutters>.col,.no-gutters>[class*=col-]{padding-right:0;padding-left:0}.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{position:relative;width:100%;min-height:1px;padding-right:15px;padding-left:15px;box-sizing:border-box}@media (min-width:34em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:48em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:62em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:75em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}.col{flex-basis:0;flex-grow:1;max-width:100%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 8.33333%;max-width:8.33333%}.col-2{flex:0 0 16.66667%;max-width:16.66667%}.col-3{flex:0 0 25%;max-width:25%}.col-4{flex:0 0 33.33333%;max-width:33.33333%}.col-5{flex:0 0 41.66667%;max-width:41.66667%}.col-6{flex:0 0 50%;max-width:50%}.col-7{flex:0 0 58.33333%;max-width:58.33333%}.col-8{flex:0 0 66.66667%;max-width:66.66667%}.col-9{flex:0 0 75%;max-width:75%}.col-10{flex:0 0 83.33333%;max-width:83.33333%}.col-11{flex:0 0 91.66667%;max-width:91.66667%}.col-12{flex:0 0 100%;max-width:100%}.pull-0{right:auto}.pull-1{right:8.33333%}.pull-2{right:16.66667%}.pull-3{right:25%}.pull-4{right:33.33333%}.pull-5{right:41.66667%}.pull-6{right:50%}.pull-7{right:58.33333%}.pull-8{right:66.66667%}.pull-9{right:75%}.pull-10{right:83.33333%}.pull-11{right:91.66667%}.pull-12{right:100%}.push-0{left:auto}.push-1{left:8.33333%}.push-2{left:16.66667%}.push-3{left:25%}.push-4{left:33.33333%}.push-5{left:41.66667%}.push-6{left:50%}.push-7{left:58.33333%}.push-8{left:66.66667%}.push-9{left:75%}.push-10{left:83.33333%}.push-11{left:91.66667%}.push-12{left:100%}.offset-1{margin-left:8.33333%}.offset-2{margin-left:16.66667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333%}.offset-5{margin-left:41.66667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333%}.offset-8{margin-left:66.66667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333%}.offset-11{margin-left:91.66667%}@media (min-width:34em){.col-sm{flex-basis:0;flex-grow:1;max-width:100%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 8.33333%;max-width:8.33333%}.col-sm-2{flex:0 0 16.66667%;max-width:16.66667%}.col-sm-3{flex:0 0 25%;max-width:25%}.col-sm-4{flex:0 0 33.33333%;max-width:33.33333%}.col-sm-5{flex:0 0 41.66667%;max-width:41.66667%}.col-sm-6{flex:0 0 50%;max-width:50%}.col-sm-7{flex:0 0 58.33333%;max-width:58.33333%}.col-sm-8{flex:0 0 66.66667%;max-width:66.66667%}.col-sm-9{flex:0 0 75%;max-width:75%}.col-sm-10{flex:0 0 83.33333%;max-width:83.33333%}.col-sm-11{flex:0 0 91.66667%;max-width:91.66667%}.col-sm-12{flex:0 0 100%;max-width:100%}.pull-sm-0{right:auto}.pull-sm-1{right:8.33333%}.pull-sm-2{right:16.66667%}.pull-sm-3{right:25%}.pull-sm-4{right:33.33333%}.pull-sm-5{right:41.66667%}.pull-sm-6{right:50%}.pull-sm-7{right:58.33333%}.pull-sm-8{right:66.66667%}.pull-sm-9{right:75%}.pull-sm-10{right:83.33333%}.pull-sm-11{right:91.66667%}.pull-sm-12{right:100%}.push-sm-0{left:auto}.push-sm-1{left:8.33333%}.push-sm-2{left:16.66667%}.push-sm-3{left:25%}.push-sm-4{left:33.33333%}.push-sm-5{left:41.66667%}.push-sm-6{left:50%}.push-sm-7{left:58.33333%}.push-sm-8{left:66.66667%}.push-sm-9{left:75%}.push-sm-10{left:83.33333%}.push-sm-11{left:91.66667%}.push-sm-12{left:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333%}.offset-sm-2{margin-left:16.66667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333%}.offset-sm-5{margin-left:41.66667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333%}.offset-sm-8{margin-left:66.66667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333%}.offset-sm-11{margin-left:91.66667%}}@media (min-width:48em){.col-md{flex-basis:0;flex-grow:1;max-width:100%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 8.33333%;max-width:8.33333%}.col-md-2{flex:0 0 16.66667%;max-width:16.66667%}.col-md-3{flex:0 0 25%;max-width:25%}.col-md-4{flex:0 0 33.33333%;max-width:33.33333%}.col-md-5{flex:0 0 41.66667%;max-width:41.66667%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-7{flex:0 0 58.33333%;max-width:58.33333%}.col-md-8{flex:0 0 66.66667%;max-width:66.66667%}.col-md-9{flex:0 0 75%;max-width:75%}.col-md-10{flex:0 0 83.33333%;max-width:83.33333%}.col-md-11{flex:0 0 91.66667%;max-width:91.66667%}.col-md-12{flex:0 0 100%;max-width:100%}.pull-md-0{right:auto}.pull-md-1{right:8.33333%}.pull-md-2{right:16.66667%}.pull-md-3{right:25%}.pull-md-4{right:33.33333%}.pull-md-5{right:41.66667%}.pull-md-6{right:50%}.pull-md-7{right:58.33333%}.pull-md-8{right:66.66667%}.pull-md-9{right:75%}.pull-md-10{right:83.33333%}.pull-md-11{right:91.66667%}.pull-md-12{right:100%}.push-md-0{left:auto}.push-md-1{left:8.33333%}.push-md-2{left:16.66667%}.push-md-3{left:25%}.push-md-4{left:33.33333%}.push-md-5{left:41.66667%}.push-md-6{left:50%}.push-md-7{left:58.33333%}.push-md-8{left:66.66667%}.push-md-9{left:75%}.push-md-10{left:83.33333%}.push-md-11{left:91.66667%}.push-md-12{left:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333%}.offset-md-2{margin-left:16.66667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333%}.offset-md-5{margin-left:41.66667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333%}.offset-md-8{margin-left:66.66667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333%}.offset-md-11{margin-left:91.66667%}}@media (min-width:62em){.col-lg{flex-basis:0;flex-grow:1;max-width:100%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 8.33333%;max-width:8.33333%}.col-lg-2{flex:0 0 16.66667%;max-width:16.66667%}.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.33333%;max-width:33.33333%}.col-lg-5{flex:0 0 41.66667%;max-width:41.66667%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}.col-lg-8{flex:0 0 66.66667%;max-width:66.66667%}.col-lg-9{flex:0 0 75%;max-width:75%}.col-lg-10{flex:0 0 83.33333%;max-width:83.33333%}.col-lg-11{flex:0 0 91.66667%;max-width:91.66667%}.col-lg-12{flex:0 0 100%;max-width:100%}.pull-lg-0{right:auto}.pull-lg-1{right:8.33333%}.pull-lg-2{right:16.66667%}.pull-lg-3{right:25%}.pull-lg-4{right:33.33333%}.pull-lg-5{right:41.66667%}.pull-lg-6{right:50%}.pull-lg-7{right:58.33333%}.pull-lg-8{right:66.66667%}.pull-lg-9{right:75%}.pull-lg-10{right:83.33333%}.pull-lg-11{right:91.66667%}.pull-lg-12{right:100%}.push-lg-0{left:auto}.push-lg-1{left:8.33333%}.push-lg-2{left:16.66667%}.push-lg-3{left:25%}.push-lg-4{left:33.33333%}.push-lg-5{left:41.66667%}.push-lg-6{left:50%}.push-lg-7{left:58.33333%}.push-lg-8{left:66.66667%}.push-lg-9{left:75%}.push-lg-10{left:83.33333%}.push-lg-11{left:91.66667%}.push-lg-12{left:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333%}.offset-lg-2{margin-left:16.66667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333%}.offset-lg-5{margin-left:41.66667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333%}.offset-lg-8{margin-left:66.66667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333%}.offset-lg-11{margin-left:91.66667%}}@media (min-width:75em){.col-xl{flex-basis:0;flex-grow:1;max-width:100%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 8.33333%;max-width:8.33333%}.col-xl-2{flex:0 0 16.66667%;max-width:16.66667%}.col-xl-3{flex:0 0 25%;max-width:25%}.col-xl-4{flex:0 0 33.33333%;max-width:33.33333%}.col-xl-5{flex:0 0 41.66667%;max-width:41.66667%}.col-xl-6{flex:0 0 50%;max-width:50%}.col-xl-7{flex:0 0 58.33333%;max-width:58.33333%}.col-xl-8{flex:0 0 66.66667%;max-width:66.66667%}.col-xl-9{flex:0 0 75%;max-width:75%}.col-xl-10{flex:0 0 83.33333%;max-width:83.33333%}.col-xl-11{flex:0 0 91.66667%;max-width:91.66667%}.col-xl-12{flex:0 0 100%;max-width:100%}.pull-xl-0{right:auto}.pull-xl-1{right:8.33333%}.pull-xl-2{right:16.66667%}.pull-xl-3{right:25%}.pull-xl-4{right:33.33333%}.pull-xl-5{right:41.66667%}.pull-xl-6{right:50%}.pull-xl-7{right:58.33333%}.pull-xl-8{right:66.66667%}.pull-xl-9{right:75%}.pull-xl-10{right:83.33333%}.pull-xl-11{right:91.66667%}.pull-xl-12{right:100%}.push-xl-0{left:auto}.push-xl-1{left:8.33333%}.push-xl-2{left:16.66667%}.push-xl-3{left:25%}.push-xl-4{left:33.33333%}.push-xl-5{left:41.66667%}.push-xl-6{left:50%}.push-xl-7{left:58.33333%}.push-xl-8{left:66.66667%}.push-xl-9{left:75%}.push-xl-10{left:83.33333%}.push-xl-11{left:91.66667%}.push-xl-12{left:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333%}.offset-xl-2{margin-left:16.66667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333%}.offset-xl-5{margin-left:41.66667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333%}.offset-xl-8{margin-left:66.66667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333%}.offset-xl-11{margin-left:91.66667%}}html{font-size:100%}@media (max-width:48em){html{font-size:80%}}body{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles,body{color:#444}.demo-styles h1{font-size:2.8rem}.demo-styles h1,.demo-styles h2{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-weight:400;line-height:normal;font-weight:300}.demo-styles h2{font-size:2rem}.demo-styles h3{font-size:1.6rem}.demo-styles h3,.demo-styles h4{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-weight:400;line-height:normal}.demo-styles h4{font-size:1.5rem}.demo-styles h5{font-size:1.3rem}.demo-styles h5,.demo-styles h6{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-weight:400;line-height:normal}.demo-styles h6{font-size:1.2rem}.demo-styles form,.demo-styles input[type=text],.demo-styles p{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles input[type=text]{margin:0;padding:0;border-radius:0;background-image:linear-gradient(transparent,transparent);background:transparent;appearance:none;border:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd}.demo-styles input[type=text]:focus{border:none;outline:none}.demo-styles input[type=text]::placeholder{font-size:inherit}.demo-styles input[type=text]:focus{outline:0}.demo-styles input[type=text]::placeholder{color:#ddd}.demo-styles input[type=text]:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}.demo-styles textarea{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal;margin:0;padding:0;border-radius:0;background-image:linear-gradient(transparent,transparent);background:transparent;appearance:none;border:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd;line-height:1.6rem;height:120px}.demo-styles textarea:focus{border:none;outline:none}.demo-styles textarea::placeholder{font-size:inherit}.demo-styles textarea:focus{outline:0}.demo-styles textarea::placeholder{color:#ddd}.demo-styles textarea:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}.demo-styles legend{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:inherit;font-weight:400;line-height:normal}.demo-styles .radio{margin:0;display:inline-block;vertical-align:top}.demo-styles .radio input[type=radio]{display:inline-block;margin:0 4px 0 0}.demo-styles .radio label{margin:0;padding:0;line-height:1;cursor:pointer;display:inline-block}.demo-styles .radio label:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxyZWN0IGlkPSJjaXJjbGUiIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4PSIxMTEiIHk9IjIzMCIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjMiPjwvcmVjdD4NCjwvc3ZnPg==");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:10px;padding:0;border:1px solid #ddd;display:inline-block;border-radius:18px}.demo-styles .radio label:hover:before{border-color:#529ef6}.demo-styles .radio input[type=radio]{display:none}.demo-styles .radio input[type=radio]:checked+label:before{background-color:#529ef6}.demo-styles .radio-inside{margin:0;display:inline-block;vertical-align:top}.demo-styles .radio-inside input[type=radio]{display:inline-block;margin:0 4px 0 0}.demo-styles .radio-inside label{cursor:pointer;margin:0}.demo-styles .radio-inside span{margin:0;padding:0;line-height:1;cursor:pointer;display:inline-block}.demo-styles .radio-inside span:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxyZWN0IGlkPSJjaXJjbGUiIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB4PSIxMTEiIHk9IjIzMCIgd2lkdGg9IjYiIGhlaWdodD0iNiIgcng9IjMiPjwvcmVjdD4NCjwvc3ZnPg==");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:10px;padding:0;border:1px solid #ddd;display:inline-block;border-radius:18px}.demo-styles .radio-inside span:hover:before{border-color:#529ef6}.demo-styles .radio-inside input[type=radio]{display:none}.demo-styles .radio-inside input[type=radio]:checked+span:before{background-color:#529ef6}.demo-styles .checkbox{margin:0;display:inline-block;vertical-align:top}.demo-styles .checkbox input[type=checkbox]{display:inline-block;margin:0 4px 0 0}.demo-styles .checkbox label{margin:0;padding:0;line-height:1;cursor:pointer}.demo-styles .checkbox label:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSIxMXB4IiBoZWlnaHQ9IjExcHgiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxwYXRoIGQ9Ik04OS4yOTI4OTMyLDIzMi43MDcxMDcgTDk1LjI5Mjg5MzIsMjMyLjcwNzEwNyBMOTUuMjkyODkzMiwyMzQuNzA3MTA3IEw4Ny4yOTI4OTMyLDIzNC43MDcxMDcgTDg3LjI5Mjg5MzIsMjMzLjcwNzEwNyBMODcuMjkyODkzMiwyMjguNzA3MTA3IEw4OS4yOTI4OTMyLDIyOC43MDcxMDcgTDg5LjI5Mjg5MzIsMjMyLjcwNzEwNyBaIiBpZD0iY2hlY2siIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5MS4yOTI4OTMsIDIzMS43MDcxMDcpIHJvdGF0ZSgtNDUuMDAwMDAwKSB0cmFuc2xhdGUoLTkxLjI5Mjg5MywgLTIzMS43MDcxMDcpICI+PC9wYXRoPg0KPC9zdmc+");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:13px;padding:0 0 0 1px;border:1px solid #ddd;display:inline-block;border-radius:3px}.demo-styles .checkbox label:hover:before{border-color:#529ef6}.demo-styles .checkbox input[type=checkbox]{display:none}.demo-styles .checkbox input[type=checkbox]:checked+label:before{background:#529ef6}.demo-styles .checkbox-inside{margin:0;display:inline-block;vertical-align:top}.demo-styles .checkbox-inside input[type=checkbox]{display:inline-block;margin:0 4px 0 0}.demo-styles .checkbox-inside label{cursor:pointer;margin:0}.demo-styles .checkbox-inside span{margin:0;padding:0;line-height:1;cursor:pointer}.demo-styles .checkbox-inside span:before{content:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSIxMXB4IiBoZWlnaHQ9IjExcHgiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgICA8IS0tIEdlbmVyYXRvcjogU2tldGNoIDQyICgzNjc4MSkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+DQogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+DQogICAgPGRlZnM+PC9kZWZzPg0KICAgIDxwYXRoIGQ9Ik04OS4yOTI4OTMyLDIzMi43MDcxMDcgTDk1LjI5Mjg5MzIsMjMyLjcwNzEwNyBMOTUuMjkyODkzMiwyMzQuNzA3MTA3IEw4Ny4yOTI4OTMyLDIzNC43MDcxMDcgTDg3LjI5Mjg5MzIsMjMzLjcwNzEwNyBMODcuMjkyODkzMiwyMjguNzA3MTA3IEw4OS4yOTI4OTMyLDIyOC43MDcxMDcgTDg5LjI5Mjg5MzIsMjMyLjcwNzEwNyBaIiBpZD0iY2hlY2siIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0ZGRkZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSg5MS4yOTI4OTMsIDIzMS43MDcxMDcpIHJvdGF0ZSgtNDUuMDAwMDAwKSB0cmFuc2xhdGUoLTkxLjI5Mjg5MywgLTIzMS43MDcxMDcpICI+PC9wYXRoPg0KPC9zdmc+");vertical-align:middle;box-sizing:border-box;text-align:center;background:#fff;width:18px;height:18px;line-height:13px;padding:0 0 0 1px;border:1px solid #ddd;display:inline-block;border-radius:3px}.demo-styles .checkbox-inside span:hover:before{border-color:#529ef6}.demo-styles .checkbox-inside input[type=checkbox]{display:none}.demo-styles .checkbox-inside input[type=checkbox]:checked+span:before{background:#529ef6}.demo-styles .select{padding:0;margin:0;border:1px solid #ccc;width:200px;border-radius:3px;overflow:hidden;background-color:#fff;background-image:url("data:image/svg+xml;base64,DQo8c3ZnIHdpZHRoPSI2cHgiIGhlaWdodD0iMTBweCIgdmlld0JveD0iMTQ3IDIyNSA2IDEwIiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPg0KICAgIDwhLS0gR2VuZXJhdG9yOiBTa2V0Y2ggNDIgKDM2NzgxKSAtIGh0dHA6Ly93d3cuYm9oZW1pYW5jb2RpbmcuY29tL3NrZXRjaCAtLT4NCiAgICA8ZGVzYz5DcmVhdGVkIHdpdGggU2tldGNoLjwvZGVzYz4NCiAgICA8ZGVmcz48L2RlZnM+DQogICAgPHBhdGggZD0iTTE1MCwyMjUgTDE1MywyMjkgTDE0NywyMjkgTDE1MCwyMjUgWiBNMTUwLDIzNSBMMTQ3LDIzMSBMMTUzLDIzMSBMMTUwLDIzNSBaIiBpZD0iQ29tYmluZWQtU2hhcGUiIHN0cm9rZT0ibm9uZSIgZmlsbD0iIzAwMDAwMCIgZmlsbC1ydWxlPSJldmVub2RkIj48L3BhdGg+DQo8L3N2Zz4=");background-repeat:no-repeat;background-position:right 12px top 15px;background-size:6px 10px}.demo-styles .select select{padding:5px 12px;width:130%;height:40px;border:none;box-shadow:none;background-color:transparent;background-image:none;appearance:none;cursor:pointer}.demo-styles .select select:focus{outline:none}.demo-styles .table{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;font-weight:400;line-height:normal;width:100%;border-collapse:collapse;margin-bottom:0;border-top:1px solid #eee;margin-bottom:10px}.demo-styles .table th{font-weight:700}.demo-styles .table td,.demo-styles .table th{padding:5px 10px}.demo-styles .table thead tr td,.demo-styles .table thead tr th{font-size:.8rem;border:1px solid #eee;border-bottom:2px solid #eee}.demo-styles .table tbody tr:first-child td,.demo-styles .table tbody tr:first-child th{border-top:none}.demo-styles .table tbody th{border:1px solid #eee;border-bottom:2px solid #eee}.demo-styles .table tbody td{border:1px solid #eee}.demo-styles .table-line{width:100%;border-collapse:collapse;margin-bottom:0;margin-bottom:10px}.demo-styles .table-line th{font-weight:700}.demo-styles .table-line td,.demo-styles .table-line th{padding:5px 10px}.demo-styles .table-line thead tr td,.demo-styles .table-line thead tr th{border-bottom:2px solid #eee}.demo-styles .table-line tr:first-child td,.demo-styles .table-line tr:first-child th{border-top:none}.demo-styles .table-line td,.demo-styles .table-line th{border-top:1px solid #eee}.demo-styles .table-stripe{width:100%;border-collapse:collapse;margin-bottom:0;margin-bottom:10px}.demo-styles .table-stripe th{font-weight:700}.demo-styles .table-stripe td,.demo-styles .table-stripe th{padding:5px 10px}.demo-styles .table-stripe thead tr{background-color:#fff}.demo-styles .table-stripe tbody tr:nth-child(2n){background-color:#eee}.demo-styles .table-stripe tbody tr:nth-child(odd){background-color:#f8f8f8}.demo-styles .fieldset{display:flex;justify-content:space-between;align-items:center;min-width:0;padding:0;margin:0 0 10px;border:0}.demo-styles .fieldset:last-child,.demo-styles .fieldset label,.demo-styles .fieldset legend{margin-bottom:0}.demo-styles .fieldset>legend{width:30%;padding-right:20px}.demo-styles .fieldset>:not(legend){flex:1}.demo-styles .button{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;border-radius:2px;border:1px solid #529ef6;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button:active,.demo-styles .button:hover,.demo-styles .button:link,.demo-styles .button:visited{text-decoration:none}.demo-styles .button:focus{outline:none}.demo-styles .button.is-disabled,.demo-styles .button:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button:focus{background-color:#529ef6}.demo-styles .button.is-current,.demo-styles .button:active,.demo-styles .button:hover{background-color:#2283f3;color:#fff;border-color:#529ef6}.demo-styles .button-semiflat{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;border-radius:4px;background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7);border:1px solid #6aacf7;color:#fff;padding:10px;line-height:1}.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover,.demo-styles .button-semiflat:link,.demo-styles .button-semiflat:visited{text-decoration:none}.demo-styles .button-semiflat:focus{outline:none}.demo-styles .button-semiflat.is-disabled,.demo-styles .button-semiflat:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-semiflat:focus{background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7)}.demo-styles .button-semiflat.is-current,.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover{background-color:#3a90f5;background-image:linear-gradient(0deg,#3a90f5,#529ef6)}.demo-styles .button-border{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;border-radius:2px;background-color:transparent;padding:10px;border:1px solid #529ef6;color:#529ef6;line-height:1}.demo-styles .button-border:active,.demo-styles .button-border:hover,.demo-styles .button-border:link,.demo-styles .button-border:visited{text-decoration:none}.demo-styles .button-border:focus{outline:none}.demo-styles .button-border.is-disabled,.demo-styles .button-border:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-border:focus{background-color:transparent;border:1px solid #529ef6}.demo-styles .button-border.is-current,.demo-styles .button-border:active,.demo-styles .button-border:hover{background-color:#529ef6;color:#fff;border-color:transparet}.demo-styles .button-emboss{font-family:Open Sans,\\30D2\30E9\30AE\30CE\89D2\30B4 Pro W3,Hiragino Kaku Gothic Pro,\\30E1\30A4\30EA\30AA,Meiryo,"\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF",sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;padding:0;border:none;outline:none;transition:all .05s ease-out;transform:translateY(-6px);box-shadow:0 6px 0 #2283f3;border-radius:4px;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover,.demo-styles .button-emboss:link,.demo-styles .button-emboss:visited{text-decoration:none}.demo-styles .button-emboss:focus{outline:none}.demo-styles .button-emboss.is-disabled,.demo-styles .button-emboss:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-emboss:focus{background-color:#529ef6;box-shadow:0 6px 0 #2283f3}.demo-styles .button-emboss.is-current,.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover{transform:translateY(0);box-shadow:0 0 0 #529ef6;background-color:#2283f3}.demo-styles .button-group{display:flex;justify-content:space-between}.demo-styles .button-group>*{width:100%;border-radius:0}.demo-styles .button-group>:first-child{border-radius:3px 0 0 3px}.demo-styles .button-group>:last-child{border-radius:0 3px 3px 0}.demo-styles .switch input[type=checkbox]{display:none}.demo-styles .switch label{cursor:pointer;text-indent:-9999px;width:38px;height:20px;background:grey;display:block;border-radius:20px;position:relative}.demo-styles .switch label:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:16px;transition:.3s}.demo-styles .switch input:checked+label{background:#529ef6}.demo-styles .switch input:checked+label:after{left:calc(100% - 2px);transform:translateX(-100%)}.demo-styles .switch label:active:after{width:20px}.demo-styles .reset-ul{margin:0;padding:0;list-style:none;display:inline-block}.demo-styles .reset-ul>li{display:inline-block}.demo-styles .word-break{white-space:normal;word-break:break-all;word-wrap:break-word}.demo-styles .word-break,.demo-styles .word-break-none{display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .word-break-none{white-space:nowrap;word-break:keep-all;word-wrap:normal}.demo-styles .text-overflow{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .icon-hamburger:before{background-color:#000;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='28' height='24' viewBox='6 8 28 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M6 8h28v4H6zM6 18h28v4H6zM6 28h28v4H6z'/%3E%3C/svg%3E");background-size:45% 45%}.demo-styles .icon-hamburger:before,.demo-styles .icon-twitter:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-twitter:before{background-color:#1da1f2;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='26' height='22' viewBox='8 9 26 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.27 30.611c9.622 0 14.885-7.972 14.885-14.886 0-.226 0-.451-.015-.676a10.645 10.645 0 0 0 2.61-2.708c-.955.423-1.968.7-3.005.823a5.25 5.25 0 0 0 2.3-2.894 10.485 10.485 0 0 1-3.322 1.27 5.237 5.237 0 0 0-8.916 4.772 14.853 14.853 0 0 1-10.782-5.466 5.236 5.236 0 0 0 1.62 6.984 5.193 5.193 0 0 1-2.375-.655v.066a5.234 5.234 0 0 0 4.197 5.129c-.77.21-1.578.24-2.362.09a5.238 5.238 0 0 0 4.888 3.633A10.498 10.498 0 0 1 8.25 28.26a14.811 14.811 0 0 0 8.02 2.346' fill='%23FFF'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before{background-color:#3c5999;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='34' viewBox='16 6 18 34' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.485 39.984V24.558h5.178l.776-6.012h-5.954v-3.838c0-1.74.484-2.927 2.98-2.927l3.183-.001V6.403c-.55-.073-2.44-.237-4.639-.237-4.59 0-7.732 2.801-7.732 7.947v4.433h-5.191v6.012h5.191v15.426h6.208z' fill='%23FEFEFE' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before,.demo-styles .icon-hatena:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-hatena:before{background-color:#2d92ba;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='20' viewBox='9 10 22 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.915 25.366c-.484.298-1.318.444-2.489.444h-1.732v-3.973h1.807c1.202 0 2.033.152 2.475.454.45.302.67.836.67 1.602 0 .685-.242 1.178-.73 1.473zm-4.22-10.426h1.064c1.23 0 2.056.139 2.482.415.42.278.635.757.635 1.44 0 .657-.228 1.12-.68 1.392-.457.266-1.291.401-2.512.401h-.99V14.94zm8.558 5.708c-.724-.81-1.732-1.265-3.024-1.363 1.15-.313 1.984-.772 2.513-1.384.525-.604.786-1.425.786-2.457 0-.818-.179-1.54-.525-2.165a3.905 3.905 0 0 0-1.535-1.49c-.587-.323-1.284-.55-2.096-.684-.816-.13-2.245-.196-4.296-.196H9.091v18.182h5.136c2.064 0 3.552-.072 4.462-.21.909-.143 1.671-.384 2.289-.714a4.196 4.196 0 0 0 1.753-1.713c.41-.74.612-1.591.612-2.566 0-1.349-.363-2.432-1.09-3.24zM28.606 24.485a2.302 2.302 0 1 0-.002 4.604 2.302 2.302 0 0 0 .002-4.604M26.606 23.031h4V10.91h-4z' fill='%23FFF' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:50% 50%}
|
3
|
+
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}[hidden],template{display:none}.container{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container{padding-right:15px;padding-left:15px}}@media (min-width:34em){.container{width:540px;max-width:100%;box-sizing:border-box}}@media (min-width:48em){.container{width:720px;max-width:100%;box-sizing:border-box}}@media (min-width:62em){.container{width:960px;max-width:100%;box-sizing:border-box}}@media (min-width:75em){.container{width:1140px;max-width:100%;box-sizing:border-box}}.container-fluid{position:relative;margin-right:auto;margin-left:auto;box-sizing:border-box;padding-right:15px;padding-left:15px}@media (min-width:34em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:48em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:62em){.container-fluid{padding-right:15px;padding-left:15px}}@media (min-width:75em){.container-fluid{padding-right:15px;padding-left:15px}}.row{display:flex;flex-wrap:wrap;box-sizing:border-box;margin-right:-15px;margin-left:-15px}@media (min-width:34em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:48em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:62em){.row{margin-right:-15px;margin-left:-15px}}@media (min-width:75em){.row{margin-right:-15px;margin-left:-15px}}.no-gutters{margin-right:0;margin-left:0}.no-gutters>.col,.no-gutters>[class*=col-]{padding-right:0;padding-left:0}.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{position:relative;width:100%;min-height:1px;padding-right:15px;padding-left:15px;box-sizing:border-box}@media (min-width:34em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:48em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:62em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}@media (min-width:75em){.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12{padding-right:15px;padding-left:15px;box-sizing:border-box}}.col{flex-basis:0;flex-grow:1;max-width:100%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 8.33333%;max-width:8.33333%}.col-2{flex:0 0 16.66667%;max-width:16.66667%}.col-3{flex:0 0 25%;max-width:25%}.col-4{flex:0 0 33.33333%;max-width:33.33333%}.col-5{flex:0 0 41.66667%;max-width:41.66667%}.col-6{flex:0 0 50%;max-width:50%}.col-7{flex:0 0 58.33333%;max-width:58.33333%}.col-8{flex:0 0 66.66667%;max-width:66.66667%}.col-9{flex:0 0 75%;max-width:75%}.col-10{flex:0 0 83.33333%;max-width:83.33333%}.col-11{flex:0 0 91.66667%;max-width:91.66667%}.col-12{flex:0 0 100%;max-width:100%}.pull-0{right:auto}.pull-1{right:8.33333%}.pull-2{right:16.66667%}.pull-3{right:25%}.pull-4{right:33.33333%}.pull-5{right:41.66667%}.pull-6{right:50%}.pull-7{right:58.33333%}.pull-8{right:66.66667%}.pull-9{right:75%}.pull-10{right:83.33333%}.pull-11{right:91.66667%}.pull-12{right:100%}.push-0{left:auto}.push-1{left:8.33333%}.push-2{left:16.66667%}.push-3{left:25%}.push-4{left:33.33333%}.push-5{left:41.66667%}.push-6{left:50%}.push-7{left:58.33333%}.push-8{left:66.66667%}.push-9{left:75%}.push-10{left:83.33333%}.push-11{left:91.66667%}.push-12{left:100%}.offset-1{margin-left:8.33333%}.offset-2{margin-left:16.66667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333%}.offset-5{margin-left:41.66667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333%}.offset-8{margin-left:66.66667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333%}.offset-11{margin-left:91.66667%}@media (min-width:34em){.col-sm{flex-basis:0;flex-grow:1;max-width:100%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 8.33333%;max-width:8.33333%}.col-sm-2{flex:0 0 16.66667%;max-width:16.66667%}.col-sm-3{flex:0 0 25%;max-width:25%}.col-sm-4{flex:0 0 33.33333%;max-width:33.33333%}.col-sm-5{flex:0 0 41.66667%;max-width:41.66667%}.col-sm-6{flex:0 0 50%;max-width:50%}.col-sm-7{flex:0 0 58.33333%;max-width:58.33333%}.col-sm-8{flex:0 0 66.66667%;max-width:66.66667%}.col-sm-9{flex:0 0 75%;max-width:75%}.col-sm-10{flex:0 0 83.33333%;max-width:83.33333%}.col-sm-11{flex:0 0 91.66667%;max-width:91.66667%}.col-sm-12{flex:0 0 100%;max-width:100%}.pull-sm-0{right:auto}.pull-sm-1{right:8.33333%}.pull-sm-2{right:16.66667%}.pull-sm-3{right:25%}.pull-sm-4{right:33.33333%}.pull-sm-5{right:41.66667%}.pull-sm-6{right:50%}.pull-sm-7{right:58.33333%}.pull-sm-8{right:66.66667%}.pull-sm-9{right:75%}.pull-sm-10{right:83.33333%}.pull-sm-11{right:91.66667%}.pull-sm-12{right:100%}.push-sm-0{left:auto}.push-sm-1{left:8.33333%}.push-sm-2{left:16.66667%}.push-sm-3{left:25%}.push-sm-4{left:33.33333%}.push-sm-5{left:41.66667%}.push-sm-6{left:50%}.push-sm-7{left:58.33333%}.push-sm-8{left:66.66667%}.push-sm-9{left:75%}.push-sm-10{left:83.33333%}.push-sm-11{left:91.66667%}.push-sm-12{left:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333%}.offset-sm-2{margin-left:16.66667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333%}.offset-sm-5{margin-left:41.66667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333%}.offset-sm-8{margin-left:66.66667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333%}.offset-sm-11{margin-left:91.66667%}}@media (min-width:48em){.col-md{flex-basis:0;flex-grow:1;max-width:100%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 8.33333%;max-width:8.33333%}.col-md-2{flex:0 0 16.66667%;max-width:16.66667%}.col-md-3{flex:0 0 25%;max-width:25%}.col-md-4{flex:0 0 33.33333%;max-width:33.33333%}.col-md-5{flex:0 0 41.66667%;max-width:41.66667%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-7{flex:0 0 58.33333%;max-width:58.33333%}.col-md-8{flex:0 0 66.66667%;max-width:66.66667%}.col-md-9{flex:0 0 75%;max-width:75%}.col-md-10{flex:0 0 83.33333%;max-width:83.33333%}.col-md-11{flex:0 0 91.66667%;max-width:91.66667%}.col-md-12{flex:0 0 100%;max-width:100%}.pull-md-0{right:auto}.pull-md-1{right:8.33333%}.pull-md-2{right:16.66667%}.pull-md-3{right:25%}.pull-md-4{right:33.33333%}.pull-md-5{right:41.66667%}.pull-md-6{right:50%}.pull-md-7{right:58.33333%}.pull-md-8{right:66.66667%}.pull-md-9{right:75%}.pull-md-10{right:83.33333%}.pull-md-11{right:91.66667%}.pull-md-12{right:100%}.push-md-0{left:auto}.push-md-1{left:8.33333%}.push-md-2{left:16.66667%}.push-md-3{left:25%}.push-md-4{left:33.33333%}.push-md-5{left:41.66667%}.push-md-6{left:50%}.push-md-7{left:58.33333%}.push-md-8{left:66.66667%}.push-md-9{left:75%}.push-md-10{left:83.33333%}.push-md-11{left:91.66667%}.push-md-12{left:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333%}.offset-md-2{margin-left:16.66667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333%}.offset-md-5{margin-left:41.66667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333%}.offset-md-8{margin-left:66.66667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333%}.offset-md-11{margin-left:91.66667%}}@media (min-width:62em){.col-lg{flex-basis:0;flex-grow:1;max-width:100%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 8.33333%;max-width:8.33333%}.col-lg-2{flex:0 0 16.66667%;max-width:16.66667%}.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.33333%;max-width:33.33333%}.col-lg-5{flex:0 0 41.66667%;max-width:41.66667%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}.col-lg-8{flex:0 0 66.66667%;max-width:66.66667%}.col-lg-9{flex:0 0 75%;max-width:75%}.col-lg-10{flex:0 0 83.33333%;max-width:83.33333%}.col-lg-11{flex:0 0 91.66667%;max-width:91.66667%}.col-lg-12{flex:0 0 100%;max-width:100%}.pull-lg-0{right:auto}.pull-lg-1{right:8.33333%}.pull-lg-2{right:16.66667%}.pull-lg-3{right:25%}.pull-lg-4{right:33.33333%}.pull-lg-5{right:41.66667%}.pull-lg-6{right:50%}.pull-lg-7{right:58.33333%}.pull-lg-8{right:66.66667%}.pull-lg-9{right:75%}.pull-lg-10{right:83.33333%}.pull-lg-11{right:91.66667%}.pull-lg-12{right:100%}.push-lg-0{left:auto}.push-lg-1{left:8.33333%}.push-lg-2{left:16.66667%}.push-lg-3{left:25%}.push-lg-4{left:33.33333%}.push-lg-5{left:41.66667%}.push-lg-6{left:50%}.push-lg-7{left:58.33333%}.push-lg-8{left:66.66667%}.push-lg-9{left:75%}.push-lg-10{left:83.33333%}.push-lg-11{left:91.66667%}.push-lg-12{left:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333%}.offset-lg-2{margin-left:16.66667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333%}.offset-lg-5{margin-left:41.66667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333%}.offset-lg-8{margin-left:66.66667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333%}.offset-lg-11{margin-left:91.66667%}}@media (min-width:75em){.col-xl{flex-basis:0;flex-grow:1;max-width:100%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 8.33333%;max-width:8.33333%}.col-xl-2{flex:0 0 16.66667%;max-width:16.66667%}.col-xl-3{flex:0 0 25%;max-width:25%}.col-xl-4{flex:0 0 33.33333%;max-width:33.33333%}.col-xl-5{flex:0 0 41.66667%;max-width:41.66667%}.col-xl-6{flex:0 0 50%;max-width:50%}.col-xl-7{flex:0 0 58.33333%;max-width:58.33333%}.col-xl-8{flex:0 0 66.66667%;max-width:66.66667%}.col-xl-9{flex:0 0 75%;max-width:75%}.col-xl-10{flex:0 0 83.33333%;max-width:83.33333%}.col-xl-11{flex:0 0 91.66667%;max-width:91.66667%}.col-xl-12{flex:0 0 100%;max-width:100%}.pull-xl-0{right:auto}.pull-xl-1{right:8.33333%}.pull-xl-2{right:16.66667%}.pull-xl-3{right:25%}.pull-xl-4{right:33.33333%}.pull-xl-5{right:41.66667%}.pull-xl-6{right:50%}.pull-xl-7{right:58.33333%}.pull-xl-8{right:66.66667%}.pull-xl-9{right:75%}.pull-xl-10{right:83.33333%}.pull-xl-11{right:91.66667%}.pull-xl-12{right:100%}.push-xl-0{left:auto}.push-xl-1{left:8.33333%}.push-xl-2{left:16.66667%}.push-xl-3{left:25%}.push-xl-4{left:33.33333%}.push-xl-5{left:41.66667%}.push-xl-6{left:50%}.push-xl-7{left:58.33333%}.push-xl-8{left:66.66667%}.push-xl-9{left:75%}.push-xl-10{left:83.33333%}.push-xl-11{left:91.66667%}.push-xl-12{left:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333%}.offset-xl-2{margin-left:16.66667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333%}.offset-xl-5{margin-left:41.66667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333%}.offset-xl-8{margin-left:66.66667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333%}.offset-xl-11{margin-left:91.66667%}}html{font-size:100%}@media (max-width:48em){html{font-size:80%}}body{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles,body{color:#444}.demo-styles h1{font-size:2.8rem}.demo-styles h1,.demo-styles h2{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-weight:400;line-height:normal;font-weight:300}.demo-styles h2{font-size:2rem}.demo-styles h3{font-size:1.6rem}.demo-styles h3,.demo-styles h4{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-weight:400;line-height:normal}.demo-styles h4{font-size:1.5rem}.demo-styles h5{font-size:1.3rem}.demo-styles h5,.demo-styles h6{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-weight:400;line-height:normal}.demo-styles h6{font-size:1.2rem}.demo-styles form,.demo-styles input[type=text],.demo-styles p{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal}.demo-styles input[type=text]{margin:0;border-radius:0;background-image:none;background:transparent;-webkit-appearance:none;appearance:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd}.demo-styles input[type=text]:focus{border:none;outline:none}.demo-styles input[type=text]::placeholder{font-size:inherit}.demo-styles input[type=text]:focus{outline:0}.demo-styles input[type=text]::placeholder{color:#ddd}.demo-styles input[type=text]:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}@media (max-width:48em){.demo-styles input[type=text]{font-size:16px}}.demo-styles textarea{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal;margin:0;border-radius:0;background-image:none;background:transparent;-webkit-appearance:none;appearance:none;outline:none;text-decoration:none;font-size:inherit;display:inline-block;width:100%;padding:10px;box-sizing:border-box;line-height:1;border:1px solid #ddd;line-height:1.6rem;height:120px}.demo-styles textarea:focus{border:none;outline:none}.demo-styles textarea::placeholder{font-size:inherit}.demo-styles textarea:focus{outline:0}.demo-styles textarea::placeholder{color:#ddd}.demo-styles textarea:focus{border:1px solid rgba(82,158,246,.5);background:#fffff2}@media (max-width:48em){.demo-styles textarea{font-size:16px}}.demo-styles legend{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:inherit;font-weight:400;line-height:normal}.demo-styles .radio,.demo-styles .radio input[type=radio]{display:inline-block;margin:0}.demo-styles .radio label{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .radio label:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI2IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHg9IjExMSIgeT0iMjMwIiB3aWR0aD0iNiIgaGVpZ2h0PSI2IiByeD0iMyIvPjwvc3ZnPg==");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:8px 8px;border-radius:18px}.demo-styles .radio input[type=radio]{display:none}.demo-styles .radio input[type=radio]:checked+label:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .radio-inside,.demo-styles .radio-inside input[type=radio]{display:inline-block;margin:0}.demo-styles .radio-inside label{cursor:pointer;margin:0}.demo-styles .radio-inside span{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .radio-inside span:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSI2IiB2aWV3Qm94PSIxMTEgMjMwIDYgNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIHg9IjExMSIgeT0iMjMwIiB3aWR0aD0iNiIgaGVpZ2h0PSI2IiByeD0iMyIvPjwvc3ZnPg==");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:8px 8px;border-radius:18px}.demo-styles .radio-inside input[type=radio]{display:none}.demo-styles .radio-inside input[type=radio]:checked+span:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .checkbox,.demo-styles .checkbox input[type=radio]{display:inline-block;margin:0}.demo-styles .checkbox label{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .checkbox label:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTEiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOTAuNTg2IDIzMy44MjhsNC4yNDItNC4yNDJMOTYuMjQzIDIzMWwtNS42NTcgNS42NTctLjcwNy0uNzA3LTMuNTM2LTMuNTM2TDg3Ljc1NyAyMzFsMi44MjkgMi44Mjh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:16px 14px;background-position:center 0;border-radius:.2rem}.demo-styles .checkbox input[type=checkbox]{display:none}.demo-styles .checkbox input[type=checkbox]:checked+label:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .checkbox-inside,.demo-styles .checkbox-inside input[type=radio]{display:inline-block;margin:0}.demo-styles .checkbox-inside label{cursor:pointer;margin:0}.demo-styles .checkbox-inside span{display:flex;align-items:center;align-content:center;justify-content:flex-start;margin:0;padding:0 1rem 0 0;line-height:1;cursor:pointer}.demo-styles .checkbox-inside span:before{content:"";display:inline-block;position:relative;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTEiIGhlaWdodD0iMTEiIHZpZXdCb3g9Ijg2IDIyNiAxMSAxMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOTAuNTg2IDIzMy44MjhsNC4yNDItNC4yNDJMOTYuMjQzIDIzMWwtNS42NTcgNS42NTctLjcwNy0uNzA3LTMuNTM2LTMuNTM2TDg3Ljc1NyAyMzFsMi44MjkgMi44Mjh6IiBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:50%;flex:0 0 18px;width:18px;height:18px;vertical-align:middle;line-height:1;background-color:#fff;border:1px solid #ddd;margin:0 .4rem 0 0;padding:0;background-size:16px 14px;background-position:center 0;border-radius:.2rem}.demo-styles .checkbox-inside input[type=checkbox]{display:none}.demo-styles .checkbox-inside input[type=checkbox]:checked+span:before{background-color:#529ef6;border-color:#529ef6}.demo-styles .select{padding:0;margin:0;border:1px solid #ccc;width:200px;border-radius:3px;overflow:hidden;background-color:#fff;background-image:url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNiIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMTQ3IDIyNSA2IDEwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xNTAgMjI1bDMgNGgtNmwzLTR6bTAgMTBsLTMtNGg2bC0zIDR6IiBmaWxsLXJ1bGU9ImV2ZW5vZGQiLz48L3N2Zz4=");background-repeat:no-repeat;background-position:right 12px top 15px;background-size:6px 10px}.demo-styles .select select{padding:5px 12px;width:130%;height:40px;border:none;box-shadow:none;background-color:transparent;background-image:none;appearance:none;cursor:pointer}.demo-styles .select select:focus{outline:none}.demo-styles .table{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;font-weight:400;line-height:normal;width:100%;border-collapse:collapse;border-top:1px solid #eee;margin-bottom:10px}.demo-styles .table th{font-weight:700}.demo-styles .table td,.demo-styles .table th{padding:5px 10px}.demo-styles .table thead tr td,.demo-styles .table thead tr th{font-size:.8rem;border:solid #eee;border-width:1px 1px 2px}.demo-styles .table tbody tr:first-child td,.demo-styles .table tbody tr:first-child th{border-top:none}.demo-styles .table tbody th{border:solid #eee;border-width:1px 1px 2px}.demo-styles .table tbody td{border:1px solid #eee}.demo-styles .table-line{width:100%;border-collapse:collapse;margin-bottom:10px}.demo-styles .table-line th{font-weight:700}.demo-styles .table-line td,.demo-styles .table-line th{padding:5px 10px}.demo-styles .table-line thead tr td,.demo-styles .table-line thead tr th{border-bottom:2px solid #eee}.demo-styles .table-line tr:first-child td,.demo-styles .table-line tr:first-child th{border-top:none}.demo-styles .table-line td,.demo-styles .table-line th{border-top:1px solid #eee}.demo-styles .table-stripe{width:100%;border-collapse:collapse;margin-bottom:10px}.demo-styles .table-stripe th{font-weight:700}.demo-styles .table-stripe td,.demo-styles .table-stripe th{padding:5px 10px}.demo-styles .table-stripe thead tr{background-color:#fff}.demo-styles .table-stripe tbody tr:nth-child(2n){background-color:#eee}.demo-styles .table-stripe tbody tr:nth-child(odd){background-color:#f8f8f8}.demo-styles .fieldset{display:flex;justify-content:space-between;align-items:center;min-width:0;padding:0;margin:0 0 10px;border:0}.demo-styles .fieldset:last-child,.demo-styles .fieldset label,.demo-styles .fieldset legend{margin-bottom:0}.demo-styles .fieldset>legend{width:30%;padding-right:20px}.demo-styles .fieldset>:not(legend){flex:1}.demo-styles .button{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;outline:none;border-radius:2px;border:1px solid #529ef6;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button:active,.demo-styles .button:hover,.demo-styles .button:link,.demo-styles .button:visited{text-decoration:none}.demo-styles .button:focus{outline:none}.demo-styles .button.is-disabled,.demo-styles .button:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button:focus{background-color:#529ef6}.demo-styles .button.is-current,.demo-styles .button:active,.demo-styles .button:hover{background-color:#2283f3;color:#fff;border-color:#529ef6}.demo-styles .button-semiflat{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;outline:none;border-radius:4px;background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7);border:1px solid #6aacf7;color:#fff;padding:10px;line-height:1}.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover,.demo-styles .button-semiflat:link,.demo-styles .button-semiflat:visited{text-decoration:none}.demo-styles .button-semiflat:focus{outline:none}.demo-styles .button-semiflat.is-disabled,.demo-styles .button-semiflat:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-semiflat:focus{background-color:#529ef6;background-image:linear-gradient(0deg,#529ef6,#6aacf7)}.demo-styles .button-semiflat.is-current,.demo-styles .button-semiflat:active,.demo-styles .button-semiflat:hover{background-color:#3a90f5;background-image:linear-gradient(0deg,#3a90f5,#529ef6)}.demo-styles .button-border{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;outline:none;border-radius:2px;background-color:transparent;padding:10px;border:1px solid #529ef6;color:#529ef6;line-height:1}.demo-styles .button-border:active,.demo-styles .button-border:hover,.demo-styles .button-border:link,.demo-styles .button-border:visited{text-decoration:none}.demo-styles .button-border:focus{outline:none}.demo-styles .button-border.is-disabled,.demo-styles .button-border:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-border:focus{background-color:transparent;border:1px solid #529ef6}.demo-styles .button-border.is-current,.demo-styles .button-border:active,.demo-styles .button-border:hover{background-color:#529ef6;color:#fff;border-color:transparet}.demo-styles .button-emboss{font-family:Open Sans,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,MS Pゴシック,sans-serif;font-size:1rem;line-height:normal;box-sizing:border-box;box-shadow:none;appearance:none;display:inline-block;border-radius:0;background-color:transparent;background-image:linear-gradient(0deg,transparent,transparent);position:relative;cursor:pointer;text-align:center;font-weight:400;margin:0;border:none;outline:none;transition:all .05s ease-out;transform:translateY(-6px);box-shadow:0 6px 0 #2283f3;border-radius:4px;background-color:#529ef6;color:#fff;padding:10px;line-height:1}.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover,.demo-styles .button-emboss:link,.demo-styles .button-emboss:visited{text-decoration:none}.demo-styles .button-emboss:focus{outline:none}.demo-styles .button-emboss.is-disabled,.demo-styles .button-emboss:disabled{cursor:default;pointer-events:none;opacity:.2}.demo-styles .button-emboss:focus{background-color:#529ef6;box-shadow:0 6px 0 #2283f3}.demo-styles .button-emboss.is-current,.demo-styles .button-emboss:active,.demo-styles .button-emboss:hover{transform:translateY(0);box-shadow:0 0 0 #529ef6;background-color:#2283f3}.demo-styles .button-group{display:flex;justify-content:space-between}.demo-styles .button-group>*{width:100%;border-radius:0}.demo-styles .button-group>:first-child{border-radius:3px 0 0 3px}.demo-styles .button-group>:last-child{border-radius:0 3px 3px 0}.demo-styles .switch input[type=checkbox]{display:none}.demo-styles .switch label{cursor:pointer;text-indent:-9999px;width:38px;height:20px;background:grey;display:block;border-radius:20px;position:relative}.demo-styles .switch label:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:16px;transition:.3s}.demo-styles .switch input:checked+label{background:#529ef6}.demo-styles .switch input:checked+label:after{left:calc(100% - 2px);transform:translateX(-100%)}.demo-styles .switch label:active:after{width:20px}.demo-styles .reset-ul{margin:0;padding:0;list-style:none;display:inline-block}.demo-styles .reset-ul>li{display:inline-block}.demo-styles .word-break{white-space:normal;word-break:break-all;word-wrap:break-word}.demo-styles .word-break,.demo-styles .word-break-none{display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .word-break-none{white-space:nowrap;word-break:keep-all;word-wrap:normal}.demo-styles .text-overflow{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:inline-block;width:100px;background:#f8f8f8;padding:10px}.demo-styles .icon-hamburger:before{background-color:#000;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='28' height='24' viewBox='6 8 28 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M6 8h28v4H6zM6 18h28v4H6zM6 28h28v4H6z'/%3E%3C/svg%3E");background-size:45% 45%}.demo-styles .icon-hamburger:before,.demo-styles .icon-twitter:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-twitter:before{background-color:#1da1f2;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='26' height='22' viewBox='8 9 26 22' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.27 30.611c9.622 0 14.885-7.972 14.885-14.886 0-.226 0-.451-.015-.676a10.645 10.645 0 0 0 2.61-2.708c-.955.423-1.968.7-3.005.823a5.25 5.25 0 0 0 2.3-2.894 10.485 10.485 0 0 1-3.322 1.27 5.237 5.237 0 0 0-8.916 4.772 14.853 14.853 0 0 1-10.782-5.466 5.236 5.236 0 0 0 1.62 6.984 5.193 5.193 0 0 1-2.375-.655v.066a5.234 5.234 0 0 0 4.197 5.129c-.77.21-1.578.24-2.362.09a5.238 5.238 0 0 0 4.888 3.633A10.498 10.498 0 0 1 8.25 28.26a14.811 14.811 0 0 0 8.02 2.346' fill='%23FFF'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before{background-color:#3c5999;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='18' height='34' viewBox='16 6 18 34' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M27.485 39.984V24.558h5.178l.776-6.012h-5.954v-3.838c0-1.74.484-2.927 2.98-2.927l3.183-.001V6.403c-.55-.073-2.44-.237-4.639-.237-4.59 0-7.732 2.801-7.732 7.947v4.433h-5.191v6.012h5.191v15.426h6.208z' fill='%23FEFEFE' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:60% 60%}.demo-styles .icon-facebook:before,.demo-styles .icon-hatena:before{content:"";width:40px;height:40px;display:inline-block;background-repeat:no-repeat;background-position:50%}.demo-styles .icon-hatena:before{background-color:#2d92ba;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='22' height='20' viewBox='9 10 22 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17.915 25.366c-.484.298-1.318.444-2.489.444h-1.732v-3.973h1.807c1.202 0 2.033.152 2.475.454.45.302.67.836.67 1.602 0 .685-.242 1.178-.73 1.473zm-4.22-10.426h1.064c1.23 0 2.056.139 2.482.415.42.278.635.757.635 1.44 0 .657-.228 1.12-.68 1.392-.457.266-1.291.401-2.512.401h-.99V14.94zm8.558 5.708c-.724-.81-1.732-1.265-3.024-1.363 1.15-.313 1.984-.772 2.513-1.384.525-.604.786-1.425.786-2.457 0-.818-.179-1.54-.525-2.165a3.905 3.905 0 0 0-1.535-1.49c-.587-.323-1.284-.55-2.096-.684-.816-.13-2.245-.196-4.296-.196H9.091v18.182h5.136c2.064 0 3.552-.072 4.462-.21.909-.143 1.671-.384 2.289-.714a4.196 4.196 0 0 0 1.753-1.713c.41-.74.612-1.591.612-2.566 0-1.349-.363-2.432-1.09-3.24zM28.606 24.485a2.302 2.302 0 1 0-.002 4.604 2.302 2.302 0 0 0 .002-4.604M26.606 23.031h4V10.91h-4z' fill='%23FFF' fill-rule='evenodd'/%3E%3C/svg%3E");background-size:50% 50%}.demo-styles .wordwrap-fadeout{position:relative;overflow:hidden}.demo-styles .wordwrap-fadeout:before{content:"";position:absolute;bottom:0;left:0;width:100%;height:10px;background:#fff}.demo-styles .wordwrap-fadeout:after{background-image:linear-gradient(0deg,#fff,hsla(0,0%,100%,0));content:"";position:absolute;bottom:10px;left:0;width:100%;height:50px}
|
data/lib/spuit/version.rb
CHANGED
data/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "spuit",
|
3
|
-
"version": "0.0
|
3
|
+
"version": "0.1.0",
|
4
4
|
"description": "JS + Sass Mixin Library",
|
5
5
|
"main": "spuit.scss",
|
6
6
|
"repository": {
|
@@ -15,32 +15,33 @@
|
|
15
15
|
},
|
16
16
|
"homepage": "https://github.com/is8r/spuit#readme",
|
17
17
|
"devDependencies": {
|
18
|
-
"autoprefixer": "^
|
19
|
-
"bootstrap": "^4.
|
20
|
-
"css-loader": "^0.
|
18
|
+
"autoprefixer": "^9.6.0",
|
19
|
+
"bootstrap": "^4.3.1",
|
20
|
+
"css-loader": "^3.0.0",
|
21
21
|
"extract-text-webpack-plugin": "^4.0.0-beta.0",
|
22
22
|
"html-loader": "^0.5.5",
|
23
23
|
"html-webpack-plugin": "^3.2.0",
|
24
|
-
"jquery": "^3.
|
25
|
-
"node-sass": "^4.
|
26
|
-
"
|
27
|
-
"
|
28
|
-
"
|
24
|
+
"jquery": "^3.4.1",
|
25
|
+
"node-sass": "^4.12.0",
|
26
|
+
"optimize-css-assets-webpack-plugin": "^5.0.1",
|
27
|
+
"popper.js": "^1.15.0",
|
28
|
+
"postcss-loader": "^3.0.0",
|
29
|
+
"sass-loader": "^7.1.0",
|
29
30
|
"spuit": "0.0.13",
|
30
|
-
"style-loader": "^0.
|
31
|
-
"
|
32
|
-
"webpack": "^
|
33
|
-
"webpack
|
34
|
-
"webpack-
|
35
|
-
"webpack-
|
31
|
+
"style-loader": "^0.23.1",
|
32
|
+
"terser-webpack-plugin": "^1.3.0",
|
33
|
+
"uglifyjs-webpack-plugin": "^2.1.3",
|
34
|
+
"webpack": "^4.34.0",
|
35
|
+
"webpack-cli": "^3.3.4",
|
36
|
+
"webpack-dev-server": "^3.7.1",
|
37
|
+
"webpack-manifest-plugin": "^2.0.4"
|
36
38
|
},
|
37
39
|
"dependencies": {
|
38
|
-
"npm": "^6.0
|
40
|
+
"npm": "^6.9.0"
|
39
41
|
},
|
40
42
|
"scripts": {
|
41
43
|
"dev": "open http://localhost:8080/ && webpack-dev-server --progress --mode development --config webpack/webpack.config.js",
|
42
44
|
"watch": "webpack --watch --progress --mode development --config webpack/webpack.config.js",
|
43
|
-
"build": "webpack --progress --mode production --config webpack/webpack.config.js"
|
44
|
-
"deploy": "npm publish"
|
45
|
+
"build": "webpack --progress --mode production --config webpack/webpack.config.js"
|
45
46
|
}
|
46
47
|
}
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
File without changes
|
@@ -0,0 +1,140 @@
|
|
1
|
+
@mixin button-base($c: transparent) {
|
2
|
+
box-sizing: border-box;
|
3
|
+
box-shadow: none;
|
4
|
+
appearance: none;
|
5
|
+
display: inline-block;
|
6
|
+
border-radius: 0;
|
7
|
+
background-color: $c;
|
8
|
+
background-image: linear-gradient(to top, $c, $c);
|
9
|
+
position: relative;
|
10
|
+
cursor: pointer;
|
11
|
+
text-align: center;
|
12
|
+
font-weight: normal;
|
13
|
+
margin: 0;
|
14
|
+
padding: 0;
|
15
|
+
border: none;
|
16
|
+
outline: none;
|
17
|
+
&:link,
|
18
|
+
&:visited,
|
19
|
+
&:hover,
|
20
|
+
&:active,
|
21
|
+
&:active {
|
22
|
+
text-decoration: none;
|
23
|
+
}
|
24
|
+
&:focus {
|
25
|
+
outline: none;
|
26
|
+
}
|
27
|
+
&:disabled,
|
28
|
+
&.is-disabled {
|
29
|
+
@include button-disabled;
|
30
|
+
opacity: 0.2;
|
31
|
+
}
|
32
|
+
}
|
33
|
+
|
34
|
+
@mixin button-disabled {
|
35
|
+
cursor: default;
|
36
|
+
pointer-events: none;
|
37
|
+
}
|
38
|
+
|
39
|
+
@mixin button-loading {
|
40
|
+
@include button-disabled;
|
41
|
+
@include icon-loading;
|
42
|
+
opacity: 0.6;
|
43
|
+
}
|
44
|
+
|
45
|
+
// @include button-normal(10px 10px, #529ef6, #fff, 2px);
|
46
|
+
@mixin button-normal($p: 10px 10px, $c: #529ef6, $c-text: #fff, $r: 2px) {
|
47
|
+
@include button-base;
|
48
|
+
border-radius: $r;
|
49
|
+
border: 1px solid $c;
|
50
|
+
background-color: $c;
|
51
|
+
color: $c-text;
|
52
|
+
padding: $p;
|
53
|
+
line-height: 1;
|
54
|
+
|
55
|
+
&:focus {
|
56
|
+
background-color: $c;
|
57
|
+
}
|
58
|
+
|
59
|
+
&:hover,
|
60
|
+
&:active,
|
61
|
+
&.is-current {
|
62
|
+
background-color: darken($c, 10%);
|
63
|
+
color: $c-text;
|
64
|
+
border-color: $c;
|
65
|
+
}
|
66
|
+
}
|
67
|
+
|
68
|
+
// @include button-semiflat(10px 10px, #529ef6, 10%, #fff, 2px);
|
69
|
+
@mixin button-semiflat($p: 10px 10px, $c: #529ef6, $strangth: 5%, $c-text: #fff, $r: 4px) {
|
70
|
+
@include button-base;
|
71
|
+
border-radius: $r;
|
72
|
+
background-color: $c;
|
73
|
+
background-image: linear-gradient(to top, $c, lighten($c, $strangth));
|
74
|
+
border: 1px solid lighten($c, $strangth);
|
75
|
+
color: $c-text;
|
76
|
+
padding: $p;
|
77
|
+
line-height: 1;
|
78
|
+
|
79
|
+
&:focus {
|
80
|
+
background-color: $c;
|
81
|
+
background-image: linear-gradient(to top, $c, lighten($c, $strangth));
|
82
|
+
}
|
83
|
+
|
84
|
+
&:hover,
|
85
|
+
&:active,
|
86
|
+
&.is-current {
|
87
|
+
background-color: darken($c, $strangth);
|
88
|
+
background-image: linear-gradient(to top, darken($c, $strangth), $c);
|
89
|
+
}
|
90
|
+
}
|
91
|
+
|
92
|
+
// @include button-border(10px 10px, #529ef6, #fff);
|
93
|
+
@mixin button-border($p: 10px 10px, $c: #529ef6, $c-text: #fff, $border: 1px, $r: 2px) {
|
94
|
+
@include button-base;
|
95
|
+
border-radius: $r;
|
96
|
+
background-color: transparent;
|
97
|
+
padding: $p;
|
98
|
+
border: $border solid $c;
|
99
|
+
color: $c;
|
100
|
+
line-height: 1;
|
101
|
+
|
102
|
+
&:focus {
|
103
|
+
background-color: transparent;
|
104
|
+
border: $border solid $c;
|
105
|
+
}
|
106
|
+
|
107
|
+
&:hover,
|
108
|
+
&:active,
|
109
|
+
&.is-current {
|
110
|
+
background-color: $c;
|
111
|
+
color: $c-text;
|
112
|
+
border-color: transparet;
|
113
|
+
}
|
114
|
+
}
|
115
|
+
|
116
|
+
// +button-emboss(10px 10px, #529ef6, #fff, 6px, 4px);
|
117
|
+
@mixin button-emboss($p: 10px 10px, $c: #529ef6, $c-text: #fff, $thickness: 6px, $r: 4px) {
|
118
|
+
@include button-base;
|
119
|
+
transition: all 0.05s ease-out;
|
120
|
+
transform: translateY(-$thickness);
|
121
|
+
box-shadow: 0 $thickness 0 darken($c, 10%);
|
122
|
+
border-radius: $r;
|
123
|
+
background-color: $c;
|
124
|
+
color: $c-text;
|
125
|
+
padding: $p;
|
126
|
+
line-height: 1;
|
127
|
+
|
128
|
+
&:focus {
|
129
|
+
background-color: $c;
|
130
|
+
box-shadow: 0 $thickness 0 darken($c, 10%);
|
131
|
+
}
|
132
|
+
|
133
|
+
&:hover,
|
134
|
+
&:active,
|
135
|
+
&.is-current {
|
136
|
+
transform: translateY(0);
|
137
|
+
box-shadow: 0 0 0 $c;
|
138
|
+
background-color: darken($c, 10%);
|
139
|
+
}
|
140
|
+
}
|
@@ -0,0 +1,23 @@
|
|
1
|
+
@mixin message-element($name: info, $color: #3498db) {
|
2
|
+
box-sizing: border-box;
|
3
|
+
padding: 12px;
|
4
|
+
border-radius: 3px;
|
5
|
+
display: block;
|
6
|
+
|
7
|
+
&.is-#{$name} {
|
8
|
+
color: $color;
|
9
|
+
background: rgba($color, 0.1);
|
10
|
+
border: 1px solid rgba($color, 0.15);
|
11
|
+
}
|
12
|
+
}
|
13
|
+
|
14
|
+
@mixin util-messages($color-info: #3498db, $color-success: #1abc9c, $color-warning: #f1c40f, $color-danger: #e74c3c) {
|
15
|
+
@at-root {
|
16
|
+
.message {
|
17
|
+
@include message-element(info, $color-info);
|
18
|
+
@include message-element(success, $color-success);
|
19
|
+
@include message-element(warning, $color-warning);
|
20
|
+
@include message-element(danger, $color-danger);
|
21
|
+
}
|
22
|
+
}
|
23
|
+
}
|
@@ -6,8 +6,9 @@
|
|
6
6
|
// = link_to 'shoulder', '#'
|
7
7
|
// Heading and shoulder links.
|
8
8
|
|
9
|
-
|
10
|
-
|
11
|
-
display: inline-block
|
12
|
-
float: right
|
13
|
-
padding-left: 10px
|
9
|
+
@mixin shoulder {
|
10
|
+
@include reset-ul;
|
11
|
+
display: inline-block;
|
12
|
+
float: right;
|
13
|
+
padding-left: 10px;
|
14
|
+
}
|
@@ -0,0 +1,45 @@
|
|
1
|
+
// Example:
|
2
|
+
|
3
|
+
// Simple Grid System - ie9-
|
4
|
+
@function split-width($column: 5, $gutter: 2) {
|
5
|
+
$parcent: (1 / $column) * 100;
|
6
|
+
$margin: ($gutter * ($column - 1)) / $column;
|
7
|
+
@return ($parcent - $margin);
|
8
|
+
}
|
9
|
+
|
10
|
+
@mixin split($column: 5, $gutter: 2, $debug: false) {
|
11
|
+
@at-root {
|
12
|
+
#{&} {
|
13
|
+
@include clearfix;
|
14
|
+
@include reset-ul;
|
15
|
+
position: relative;
|
16
|
+
|
17
|
+
> * {
|
18
|
+
@if $debug {
|
19
|
+
@include debug-block;
|
20
|
+
}
|
21
|
+
|
22
|
+
display: inline-block;
|
23
|
+
float: left;
|
24
|
+
box-sizing: border-box;
|
25
|
+
width: split-width($column, $gutter) * 1%;
|
26
|
+
margin-left: $gutter * 1%;
|
27
|
+
margin-bottom: 10px;
|
28
|
+
|
29
|
+
@for $i from 0 through 150 {
|
30
|
+
@if $i%$column == 1 {
|
31
|
+
&:nth-child(#{$i}) {
|
32
|
+
clear: both;
|
33
|
+
margin-left: 0;
|
34
|
+
}
|
35
|
+
} @else {
|
36
|
+
&:nth-child(#{$i}) {
|
37
|
+
clear: none;
|
38
|
+
margin-left: $gutter * 1%;
|
39
|
+
}
|
40
|
+
}
|
41
|
+
}
|
42
|
+
}
|
43
|
+
}
|
44
|
+
}
|
45
|
+
}
|
@@ -0,0 +1,50 @@
|
|
1
|
+
// Example:
|
2
|
+
// +triangle(#222, 12px, $w/2, 0, 'left')
|
3
|
+
|
4
|
+
@mixin triangle($c: #2dd, $w: 20px, $l: 0, $t: 0, $direction: "right", $element: "after") {
|
5
|
+
position: relative;
|
6
|
+
&:#{$element} {
|
7
|
+
content: "";
|
8
|
+
position: absolute;
|
9
|
+
width: 0;
|
10
|
+
height: 0;
|
11
|
+
border: $w solid transparent;
|
12
|
+
border-top-color: $c;
|
13
|
+
}
|
14
|
+
@if ($direction == "left") {
|
15
|
+
&:#{$element} {
|
16
|
+
transform: translateX(-$w * 2) translateY(-$w) rotate(90deg);
|
17
|
+
left: $l;
|
18
|
+
right: auto;
|
19
|
+
top: $t;
|
20
|
+
}
|
21
|
+
}
|
22
|
+
@if ($direction == "right") {
|
23
|
+
&:#{$element} {
|
24
|
+
transform: translateX($w * 2) translateY(-$w) rotate(-90deg);
|
25
|
+
left: auto;
|
26
|
+
right: $l;
|
27
|
+
top: $t;
|
28
|
+
}
|
29
|
+
}
|
30
|
+
@if ($direction == "top") {
|
31
|
+
&:#{$element} {
|
32
|
+
transform: translateX(-$w) translateY(-$w * 2) rotate(180deg);
|
33
|
+
right: auto;
|
34
|
+
left: $l;
|
35
|
+
top: $t;
|
36
|
+
}
|
37
|
+
}
|
38
|
+
@if ($direction == "bottom") {
|
39
|
+
&:#{$element} {
|
40
|
+
transform: translateX(-$w) translateY($w * 2) rotate(0);
|
41
|
+
right: auto;
|
42
|
+
left: $l;
|
43
|
+
bottom: $t;
|
44
|
+
}
|
45
|
+
}
|
46
|
+
}
|
47
|
+
|
48
|
+
@mixin tri($c: #2dd, $w: 20px, $l: 0, $t: 0, $direction: "right", $element: "after") {
|
49
|
+
@include triangle($c, $w, $l, $t, $direction, $element);
|
50
|
+
}
|
@@ -0,0 +1,22 @@
|
|
1
|
+
@mixin wordwrap-fadeout($h: 50px, $m: 10px, $c: #fff) {
|
2
|
+
position: relative;
|
3
|
+
overflow: hidden;
|
4
|
+
&:before {
|
5
|
+
content: '';
|
6
|
+
position: absolute;
|
7
|
+
bottom: 0;
|
8
|
+
left: 0;
|
9
|
+
width: 100%;
|
10
|
+
height: $m;
|
11
|
+
background: $c;
|
12
|
+
}
|
13
|
+
&:after {
|
14
|
+
background-image: linear-gradient(to top, rgba($c,1), rgba($c,0));
|
15
|
+
content: '';
|
16
|
+
position: absolute;
|
17
|
+
bottom: $m;
|
18
|
+
left: 0;
|
19
|
+
width: 100%;
|
20
|
+
height: $h;
|
21
|
+
}
|
22
|
+
}
|
@@ -0,0 +1,27 @@
|
|
1
|
+
@mixin wrap($n: 960px, $margin: 10px) {
|
2
|
+
width: 100%;
|
3
|
+
margin: 0;
|
4
|
+
padding: 0;
|
5
|
+
text-align: center;
|
6
|
+
min-width: $n;
|
7
|
+
@include breakpoint-down(md) {
|
8
|
+
width: auto;
|
9
|
+
min-width: 0;
|
10
|
+
}
|
11
|
+
|
12
|
+
@at-root {
|
13
|
+
#{&}__inner {
|
14
|
+
box-sizing: border-box;
|
15
|
+
position: relative;
|
16
|
+
display: block;
|
17
|
+
width: $n;
|
18
|
+
margin: 0 auto;
|
19
|
+
text-align: left;
|
20
|
+
@include breakpoint-down(md) {
|
21
|
+
width: 100%;
|
22
|
+
padding-left: $margin;
|
23
|
+
padding-right: $margin;
|
24
|
+
}
|
25
|
+
}
|
26
|
+
}
|
27
|
+
}
|
@@ -0,0 +1,40 @@
|
|
1
|
+
@mixin dl-base {
|
2
|
+
margin: 0;
|
3
|
+
padding: 0;
|
4
|
+
> * {
|
5
|
+
@include break-word;
|
6
|
+
margin: 0;
|
7
|
+
padding: 0;
|
8
|
+
display: border-box;
|
9
|
+
}
|
10
|
+
}
|
11
|
+
|
12
|
+
@mixin dl-flex($left: 30%, $p: 0.5rem 1rem) {
|
13
|
+
@include dl-base;
|
14
|
+
display: flex;
|
15
|
+
flex-flow: row wrap;
|
16
|
+
justify-content: space-between;
|
17
|
+
align-items: flex-start;
|
18
|
+
align-content: flex-start;
|
19
|
+
|
20
|
+
> dt {
|
21
|
+
width: $left;
|
22
|
+
padding: $p;
|
23
|
+
padding-left: 0;
|
24
|
+
}
|
25
|
+
|
26
|
+
> dd {
|
27
|
+
width: 100% - $left;
|
28
|
+
padding: $p;
|
29
|
+
padding-right: 0;
|
30
|
+
}
|
31
|
+
}
|
32
|
+
|
33
|
+
@mixin dl-border($border: 1px solid #ddd, $left: 30%, $p: 0.5rem 1rem) {
|
34
|
+
@include dl-flex($left, $p);
|
35
|
+
border-bottom: $border;
|
36
|
+
|
37
|
+
> * {
|
38
|
+
border-top: $border;
|
39
|
+
}
|
40
|
+
}
|