LoginSignup
0
0

More than 3 years have passed since last update.

コーディング作業短縮化プラグイン『Emmet』をベースにCSSにしてみました

Posted at

コーディング作業短縮化プラグイン『Emmet』をベースにしたCSS

『Emmet』とは入力補完機能によりHTML、CSS等を素早く編集できる、
テキストエディタ用のプラグインのことです。

記述法や練習だったりでわかりやすいページはこのあたり

Emmetの使い方を覚えてHTML/CSSの高速コーディングを身に付けよう
https://webdesign-trends.net/entry/10748

Emmet入門
https://dotinstall.com/lessons/basic_emmet_v3

それで、これはいいなとタッチタイピングの練習をしていたのですけど、かんたんな調整用CSSとしても共通認識と入力の手間的にいいんじゃないかと思ったのでCSSにしてみました。

primer-emmet(emmet文法に合わせた調整用CSS)

/* primer-emmet
  (emmet文法に合わせた調整用CSS設定)
===================================================================
# 目次
  - visual Formatting
  - box Sizing
  - font
  - text
  - background
  - border
  - list
=================================================================== */

/* Visual Formatting
------------------------------------------------------------------- */
.pos--s { position: static; }

.pos--a { position: absolute; }

.pos--r { position: relative; }

.pos--f { position: fixed; }

.t--a   { top: auto; }

.r--a   { right: auto; }

.b--a   { bottom: auto; }

.l--a   { left: auto; }

.z--a   { z-index: auto; }

.fl--n  { float: none; }

.fl--l  { float: left; }

.fl--r  { float: right; }

.cl--n  { clear: none; }

.cl--l  { clear: left; }

.cl--r  { clear: right; }

.cl--b  { clear: both; }

.d--n   { display: none; }

.d--b   { display: block; }

.d--f   { display: flex; }

.d--if  { display: inline-flex; }

.d--i   { display: inline; }

.d--ib  { display: inline-block; }

.d--li  { display: list-item; }

.d--tb  { display: table; }

.d--itb { display: inline-table; }

.d--tbcp    { display: table-caption; }

.d--tbcl    { display: table-column; }

.d--tbclg   { display: table-column-group; }

.d--tbhg    { display: table-header-group; }

.d--tbfg    { display: table-footer-group; }

.d--tbr { display: table-row; }

.d--tbrg    { display: table-row-group; }

.d--tbc { display: table-cell; }

.d--rb  { display: ruby; }

.d--rbb { display: ruby-base; }

.d--rbt { display: ruby-text; }

.v--v   { visibility: visible; }

.v--h   { visibility: hidden; }

.v--c   { visibility: collapse; }

.ov--v  { overflow: visible; }

.ov--h  { overflow: hidden; }

.ov--s  { overflow: scroll; }

.ov--a  { overflow: auto; }

.ovx--v { overflow-x: visible; }

.ovx--h { overflow-x: hidden; }

.ovx--s { overflow-x: scroll; }

.ovx--a { overflow-x: auto; }

.ovy--v { overflow-y: visible; }

.ovy--h { overflow-y: hidden; }

.ovy--s { overflow-y: scroll; }

.ovy--a { overflow-y: auto; }

.rsz--n { resize: none; }

.rsz--b { resize: both; }

.rsz--h { resize: horizontal; }

.rsz--v { resize: vertical; }

/* Box Sizing
------------------------------------------------------------------- */

.bxz--cb { box-sizing: content-box; }

.bxz--bb { box-sizing: border-box; }

.bxsh--n { box-shadow: none; }

/* Font
------------------------------------------------------------------- */

.fw--n { font-weight: normal; }

.fw--b { font-weight: bold; }

.fw--br { font-weight: bolder; }

.fw--lr { font-weight: lighter; }

.fs--n { font-style: normal; }

.fs--i { font-style: italic; }

.fs--o { font-style: oblique; }

.fst--n { font-stretch: normal; }

.fst--uc { font-stretch: ultra-condensed; }

.fst--ec { font-stretch: extra-condensed; }

.fst--c { font-stretch: condensed; }

.fst--sc { font-stretch: semi-condensed; }

.fst--se { font-stretch: semi-expanded; }

.fst--e { font-stretch: expanded; }

.fst--ee { font-stretch: extra-expanded; }

.fst--ue { font-stretch: ultra-expanded; }


/* text
------------------------------------------------------------------- */

.va--sup { vertical-align: super; }

.va--t { vertical-align: top; }

.va--tt { vertical-align: text-top; }

.va--m { vertical-align: middle; }

.va--bl { vertical-align: baseline; }

.va--b { vertical-align: bottom; }

.va--tb { vertical-align: text-bottom; }

.va--sub { vertical-align: sub; }

.ta--l { text-align: left; }

.ta--c { text-align: center; }

.ta--r { text-align: right; }

.ta--j { text-align: justify; }

.tal--a { text-align-last: auto; }

.tal--l { text-align-last: left; }

.tal--c { text-align-last: center; }

.tal--r { text-align-last: right; }

.td--n { text-decoration: none; }

.td--u { text-decoration: underline; }

.td--o { text-decoration: overline; }

.td--l { text-decoration: line-through; }

.te--n { text-emphasis: none; }

.te--ac { text-emphasis: accent; }

.te--dt { text-emphasis: dot; }

.te--c { text-emphasis: circle; }

.te--ds { text-emphasis: disc; }

.te--b { text-emphasis: before; }

.te--a { text-emphasis: after; }

.tt--n { text-transform: none; }

.tt--c { text-transform: capitalize; }

.tt--u { text-transform: uppercase; }

.tt--l { text-transform: lowercase; }

.tsh--n { text-shadow: none; }

.whs--n { white-space: normal; }

.whs--p { white-space: pre; }

.whs--nw { white-space: nowrap; }

.whs--pw { white-space: pre-wrap; }

.whs--pl { white-space: pre-line; }

.wob--n { word-break: normal; }

.wob--k { word-break: keep-all; }

.wob--ba { word-break: break-all; }

.wow--nm { word-wrap: normal; }

.wow--n { word-wrap: none; }

.wow--u { word-wrap: unrestricted; }

.wow--s { word-wrap: suppress; }

.wow--b { word-wrap: break-word; }

/* background
------------------------------------------------------------------- */

.bg--n { background: none; }

.bgc--t { background-color: transparent; }

.bgi--n { background-image: none; }

.bgr--n { background-repeat: no-repeat; }

.bgr--x { background-repeat: repeat-x; }

.bgr--y { background-repeat: repeat-y; }

.bgr--sp { background-repeat: space; }

.bgr--rd { background-repeat: round; }

.bga--f { background-attachment: fixed; }

.bga--s { background-attachment: scroll; }

.bgsz--a { background-size: auto; }

.bgsz--ct { background-size: contain; }

.bgsz--cv { background-size: cover; }

/* outline
------------------------------------------------------------------- */

.olw--tn {
    outline-style: none;    
}

.ols--dt {
    outline-style: dotted;
}

.ols--ds {
    outline-style: dashed;
}

.ols--s {
    outline-style: solid;
}

.ols--db {
    outline-style: double;
} 

.ols--g {
    outline-style: groove;
}

.ols--r {
    outline-style: ridge;
}

.ols--i {
    outline-style: inset;
}

.ols--o {
    outline-style: outset;
}

.tbl--a {
    table-layout: auto;
}

/* table
------------------------------------------------------------------- */

.tbl--a {
    table-layout: auto;
}

.tbl--f {
    table-layout: fixed;
}

.cps--t {
    caption-side: top;
}

.cps--b {
    caption-side: bottom;
}

.es--s {
    empty-cells: show;
}

.es--h {
    empty-cells: hide;
}

/* border
------------------------------------------------------------------- */

.bd--n {
    border: none;
}

.bdcl--c {
    border-collapse: collapse;
}

.bdcl--s {
    border-collapse: separate;
}

.bds--n {
    border-style: none;
}

.bds--h {
    border-style: hidden;
}

.bds--dt {
    border-style: dotted;
}

.bds--ds {
    border-style: dashed;
}

.bds--s {
    border-style: solid;
}

.bds--db {
    border-style: double;
}

.bds--dtds {
    border-style: dot-dash;
}

.bds--dtdtds {
    border-style: dot-dot-dash;
}

.bds--w {
    border-style: wave;
}

.bds--g {
    border-style: groove;
}

.bds--r {
    border-style: ridge;
}

.bds--i {
    border-style: inset;
}

.bds--o {
    border-style: outset;
}

/* border-top
------------------------------------------------------------------- */

.bdt--n {
    border-top: none;
}

.bdts--n    {
    border-top-style: none;
}

.bdts--h {
    border-top-style: hidden;
}

.bdts--dt {
    border-top-style: dotted;
}

.bdts--ds {
    border-top-style: dashed;
}

.bdts--s {
    border-top-style: solid;
}

.bdts--db {
    border-top-style: double;
}

.bdts--dtds {
    border-top-style: dot-dash;
}

.bdts--dtdtds {
    border-top-style: dot-dot-dash;
}

.bdts--w {
    border-top-style: wave;
}

.bdts--g {
    border-top-style: groove;
}

.bdts--r {
    border-top-style: ridge;
}

.bdts--i    {
    border-top-style: inset;
}

.bdts--o {
    border-top-style: outset;
}

/* border-right
------------------------------------------------------------------- */

.bdr--n {
    border-right: none;
}

.bdrs--n    {
    border-right-style: none;
}

.bdrs--h {
    border-right-style: hidden;
}

.bdrs--dt {
    border-right-style: dotted;
}

.bdrs--ds {
    border-right-style: dashed;
}

.bdrs--s {
    border-right-style: solid;
}

.bdrs--db {
    border-right-style: double;
}

.bdrs--dtds {
    border-right-style: dot-dash;
}

.bdrs--dtdtds {
    border-right-style: dot-dot-dash;
}

.bdrs--w {
    border-right-style: wave;
}

.bdrs--g {
    border-right-style: groove;
}

.bdrs--r {
    border-right-style: ridge;
}

.bdrs--i    {
    border-right-style: inset;
}

.bdrs--o {
    border-right-style: outset;
}

/* border-bottom
------------------------------------------------------------------- */

.bdb--n {
    border-bottom: none;
}

.bdbs--n    {
    border-bottom-style: none;
}

.bdbs--h {
    border-bottom-style: hidden;
}

.bdbs--dt {
    border-bottom-style: dotted;
}

.bdbs--ds {
    border-bottom-style: dashed;
}

.bdbs--s {
    border-bottom-style: solid;
}

.bdbs--db {
    border-bottom-style: double;
}

.bdbs--dtds {
    border-bottom-style: dot-dash;
}

.bdbs--dtdtds {
    border-bottom-style: dot-dot-dash;
}

.bdbs--w {
    border-bottom-style: wave;
}

.bdbs--g {
    border-bottom-style: groove;
}

.bdbs--r {
    border-bottom-style: ridge;
}

.bdbs--i    {
    border-bottom-style: inset;
}

.bdbs--o {
    border-bottom-style: outset;
}

/* border-left
------------------------------------------------------------------- */

.bdl--n {
    border-left: none;
}

.bdls--n    {
    border-left-style: none;
}

.bdls--h {
    border-left-style: hidden;
}

.bdls--dt {
    border-left-style: dotted;
}

.bdls--ds {
    border-left-style: dashed;
}

.bdls--s {
    border-left-style: solid;
}

.bdls--db {
    border-left-style: double;
}

.bdls--dtds {
    border-left-style: dot-dash;
}

.bdls--dtdtds {
    border-left-style: dot-dot-dash;
}

.bdls--w {
    border-left-style: wave;
}

.bdls--g {
    border-left-style: groove;
}

.bdls--r {
    border-left-style: ridge;
}

.bdls--i    {
    border-left-style: inset;
}

.bdls--o {
    border-left-style: outset;
}

/* list
------------------------------------------------------------------- */

.lisp--i {
    list-style-position: inside;
}

.lisp--o {
    list-style-position: outside;
}

.list--n {
    list-style-type: none;
}

.list--d {
    list-style-type: disc;
}

.list--c {
    list-style-type: circle;
}

.list--s {
    list-style-type: square;
}

.list--dc {
    list-style-type: disc;
}

.list--lr {
    list-style-type: lower-roman;
}

.list--ur {
    list-style-type: upper-roman;
}

/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––– primer-emmet */

primer-emmet-parameter(emmet文法に合わせた調整用CSS。値が固定値でないもの)

/* scss/_primer-emmet-parameter.scss
    (emmet文法に合わせた調整用CSS。値が固定値でないもの)
===================================================================
# 目次
  - margin
    - padding
    - top, right, bottom, left
    - width, height
    - text-indent
    - word-spacing
    - opacity
    - border-width
=================================================================== */

/* margin
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

.m--a,
.m--auto {
    margin: auto;
}

.m--a-0,
.m--auto-0 {
    margin: auto 0;
}

.m--0 {
    margin: 0;
}

.m--0-auto {
    margin: 0 auto;
}

/* em */

.m--d25e {
    margin: 0.25em;
}

.m--d50e {
    margin: 0.50em;
}

.m--d75e {
    margin: 0.75em;
}

.m--1e {
    margin: 1em;
}

.m--2e {
    margin: 2em;
}

.m--3e {
    margin: 3em;
}

.m--4e {
    margin: 4em;
}

.m--5e {
    margin: 5em;
}

.m--6e {
    margin: 6em;
}

.m--7e {
    margin: 7em;
}

.m--8e {
    margin: 8em;
}

.m--9e {
    margin: 9em;
}

.m--10e {
    margin: 10em;
}

/* rem */

.m--d25r {
    margin: 0.25rem;
}

.m--d50r {
    margin: 0.50rem;
}

.m--d75r {
    margin: 0.75rem;
}

.m--1r {
    margin: 1rem;
}

.m--2r {
    margin: 2rem;
}

.m--3r {
    margin: 3rem;
}

.m--4r {
    margin: 4rem;
}

.m--5r {
    margin: 5rem;
}

.m--6r {
    margin: 6rem;
}

.m--7r {
    margin: 7rem;
}

.m--8r {
    margin: 8rem;
}

.m--9r {
    margin: 9rem;
}

.m--10r {
    margin: 10rem;
}

/* % */

.m--25p {
    margin: 25%;
}

.m--50p {
    margin: 50%;
}

.m--75p {
    margin: 75%;
}

.m--10p {
    margin: 10%;
}

.m--20p {
    margin: 20%;
}

.m--30p {
    margin: 30%;
}

.m--40p {
    margin: 40%;
}

.m--60p {
    margin: 60%;
}

.m--70p {
    margin: 70%;
}

.m--80p {
    margin: 80%;
}

.m--90p {
    margin: 90%;
}

.m--100p {
    margin: 100%;
}

/* vw */

.m--25vw {
    margin: 25vw;
}

.m--50vw {
    margin: 50vw;
}

.m--75vw {
    margin: 75vw;
}

.m--10vw {
    margin: 10vw;
}

.m--20vw {
    margin: 20vw;
}

.m--30vw {
    margin: 30vw;
}

.m--40vw {
    margin: 40vw;
}

.m--60vw {
    margin: 60vw;
}

.m--70vw {
    margin: 70vw;
}

.m--80vw {
    margin: 80vw;
}

.m--90vw {
    margin: 90vw;
}

.m--100vw {
    margin: 100vw;
}

/* vh */

.m--25vh {
    margin: 25vh;
}

.m--50vh {
    margin: 50vh;
}

.m--75vh {
    margin: 75vh;
}

.m--10vh {
    margin: 10vh;
}

.m--20vh {
    margin: 20vh;
}

.m--30vh {
    margin: 30vh;
}

.m--40vh {
    margin: 40vh;
}

.m--60vh {
    margin: 60vh;
}

.m--70vh {
    margin: 70vh;
}

.m--80vh {
    margin: 80vh;
}

.m--90vh {
    margin: 90vh;
}

.m--100vh {
    margin: 100vh;
}

/* px */

.m--1px {
    margin: 1px;
}

.m--2px {
    margin: 2px;
}

.m--3px {
    margin: 3px;
}

.m--4px {
    margin: 4px;
}

.m--5px {
    margin: 5px;
}

.m--6px {
    margin: 6px;
}

.m--7px {
    margin: 7px;
}

.m--8px {
    margin: 8px;
}

.m--9px {
    margin: 9px;
}

.m--10px {
    margin: 10px;
}

.m--20px {
    margin: 20px;
}

.m--30px {
    margin: 30px;
}

.m--40px {
    margin: 40px;
}

.m--50px {
    margin: 50px;
}

.m--60px {
    margin: 60px;
}

.m--70px {
    margin: 70px;
}

.m--80px {
    margin: 80px;
}

.m--90px {
    margin: 90px;
}

.m--100px {
    margin: 100px;
}

.m--150px {
    margin: 150px;
}

.m--200px {
    margin: 200px;
}

.m--250px {
    margin: 250px;
}

.m--300px {
    margin: 300px;
}

/* margin-top
------------------------------------------------------------------- */

.mt--a,
.mt--auto {
    margin-top: auto;
}

.mt--0 {
    margin-top: 0;
}

/* em */

.mt--d25e {
    margin-top: 0.25em;
}

.mt--d50e {
    margin-top: 0.50em;
}

.mt--d75e {
    margin-top: 0.75em;
}

.mt--1e {
    margin-top: 1em;
}

.mt--2e {
    margin-top: 2em;
}

.mt--3e {
    margin-top: 3em;
}

.mt--4e {
    margin-top: 4em;
}

.mt--5e {
    margin-top: 5em;
}

.mt--6e {
    margin-top: 6em;
}

.mt--7e {
    margin-top: 7em;
}

.mt--8e {
    margin-top: 8em;
}

.mt--9e {
    margin-top: 9em;
}

.mt--10e {
    margin-top: 10em;
}

/* rem */

.mt--d25r {
    margin-top: 0.25rem;
}

.mt--d50r {
    margin-top: 0.50rem;
}

.mt--d75r {
    margin-top: 0.75rem;
}

.mt--1r {
    margin-top: 1rem;
}

.mt--2r {
    margin-top: 2rem;
}

.mt--3r {
    margin-top: 3rem;
}

.mt--4r {
    margin-top: 4rem;
}

.mt--5r {
    margin-top: 5rem;
}

.mt--6r {
    margin-top: 6rem;
}

.mt--7r {
    margin-top: 7rem;
}

.mt--8r {
    margin-top: 8rem;
}

.mt--9r {
    margin-top: 9rem;
}

.mt--10r {
    margin-top: 10rem;
}

/* % */

.mt--25p {
    margin-top: 25%;
}

.mt--50p {
    margin-top: 50%;
}

.mt--75p {
    margin-top: 75%;
}

.mt--10p {
    margin-top: 10%;
}

.mt--20p {
    margin-top: 20%;
}

.mt--30p {
    margin-top: 30%;
}

.mt--40p {
    margin-top: 40%;
}

.mt--60p {
    margin-top: 60%;
}

.mt--70p {
    margin-top: 70%;
}

.mt--80p {
    margin-top: 80%;
}

.mt--90p {
    margin-top: 90%;
}

.mt--100p {
    margin-top: 100%;
}

/* vw */

.mt--25vw {
    margin-top: 25vw;
}

.mt--50vw {
    margin-top: 50vw;
}

.mt--75vw {
    margin-top: 75vw;
}

.mt--10vw {
    margin-top: 10vw;
}

.mt--20vw {
    margin-top: 20vw;
}

.mt--30vw {
    margin-top: 30vw;
}

.mt--40vw {
    margin-top: 40vw;
}

.mt--60vw {
    margin-top: 60vw;
}

.mt--70vw {
    margin-top: 70vw;
}

.mt--80vw {
    margin-top: 80vw;
}

.mt--90vw {
    margin-top: 90vw;
}

.mt--100vw {
    margin-top: 100vw;
}

/* vh */

.mt--25vh {
    margin-top: 25vh;
}

.mt--50vh {
    margin-top: 50vh;
}

.mt--75vh {
    margin-top: 75vh;
}

.mt--10vh {
    margin-top: 10vh;
}

.mt--20vh {
    margin-top: 20vh;
}

.mt--30vh {
    margin-top: 30vh;
}

.mt--40vh {
    margin-top: 40vh;
}

.mt--60vh {
    margin-top: 60vh;
}

.mt--70vh {
    margin-top: 70vh;
}

.mt--80vh {
    margin-top: 80vh;
}

.mt--90vh {
    margin-top: 90vh;
}

.mt--100vh {
    margin-top: 100vh;
}

/* px */

.mt--1px {
    margin-top: 1px;
}

.mt--2px {
    margin-top: 2px;
}

.mt--3px {
    margin-top: 3px;
}

.mt--4px {
    margin-top: 4px;
}

.mt--5px {
    margin-top: 5px;
}

.mt--6px {
    margin-top: 6px;
}

.mt--7px {
    margin-top: 7px;
}

.mt--8px {
    margin-top: 8px;
}

.mt--9px {
    margin-top: 9px;
}

.mt--10px {
    margin-top: 10px;
}

.mt--20px {
    margin-top: 20px;
}

.mt--30px {
    margin-top: 30px;
}

.mt--40px {
    margin-top: 40px;
}

.mt--50px {
    margin-top: 50px;
}

.mt--60px {
    margin-top: 60px;
}

.mt--70px {
    margin-top: 70px;
}

.mt--80px {
    margin-top: 80px;
}

.mt--90px {
    margin-top: 90px;
}

.mt--100px {
    margin-top: 100px;
}

.mt--150px {
    margin-top: 150px;
}

.mt--200px {
    margin-top: 200px;
}

.mt--250px {
    margin-top: 250px;
}

.mt--300px {
    margin-top: 300px;
}

/* margin-right
------------------------------------------------------------------- */

.mr--a,
.mr--auto {
    margin-right: auto;
}

.mr--0 {
    margin-right: 0;
}

/* em */

.mr--d25e {
    margin-right: 0.25em;
}

.mr--d50e {
    margin-right: 0.50em;
}

.mr--d75e {
    margin-right: 0.75em;
}

.mr--1e {
    margin-right: 1em;
}

.mr--2e {
    margin-right: 2em;
}

.mr--3e {
    margin-right: 3em;
}

.mr--4e {
    margin-right: 4em;
}

.mr--5e {
    margin-right: 5em;
}

.mr--6e {
    margin-right: 6em;
}

.mr--7e {
    margin-right: 7em;
}

.mr--8e {
    margin-right: 8em;
}

.mr--9e {
    margin-right: 9em;
}

.mr--10e {
    margin-right: 10em;
}

/* rem */

.mr--d25r {
    margin-right: 0.25rem;
}

.mr--d50r {
    margin-right: 0.50rem;
}

.mr--d75r {
    margin-right: 0.75rem;
}

.mr--1r {
    margin-right: 1rem;
}

.mr--2r {
    margin-right: 2rem;
}

.mr--3r {
    margin-right: 3rem;
}

.mr--4r {
    margin-right: 4rem;
}

.mr--5r {
    margin-right: 5rem;
}

.mr--6r {
    margin-right: 6rem;
}

.mr--7r {
    margin-right: 7rem;
}

.mr--8r {
    margin-right: 8rem;
}

.mr--9r {
    margin-right: 9rem;
}

.mr--10r {
    margin-right: 10rem;
}

/* % */

.mr--25p {
    margin-right: 25%;
}

.mr--50p {
    margin-right: 50%;
}

.mr--75p {
    margin-right: 75%;
}

.mr--10p {
    margin-right: 10%;
}

.mr--20p {
    margin-right: 20%;
}

.mr--30p {
    margin-right: 30%;
}

.mr--40p {
    margin-right: 40%;
}

.mr--60p {
    margin-right: 60%;
}

.mr--70p {
    margin-right: 70%;
}

.mr--80p {
    margin-right: 80%;
}

.mr--90p {
    margin-right: 90%;
}

.mr--100p {
    margin-right: 100%;
}

/* vw */

.mr--25vw {
    margin-right: 25vw;
}

.mr--50vw {
    margin-right: 50vw;
}

.mr--75vw {
    margin-right: 75vw;
}

.mr--10vw {
    margin-right: 10vw;
}

.mr--20vw {
    margin-right: 20vw;
}

.mr--30vw {
    margin-right: 30vw;
}

.mr--40vw {
    margin-right: 40vw;
}

.mr--60vw {
    margin-right: 60vw;
}

.mr--70vw {
    margin-right: 70vw;
}

.mr--80vw {
    margin-right: 80vw;
}

.mr--90vw {
    margin-right: 90vw;
}

.mr--100vw {
    margin-right: 100vw;
}

/* vh */

.mr--25vh {
    margin-right: 25vh;
}

.mr--50vh {
    margin-right: 50vh;
}

.mr--75vh {
    margin-right: 75vh;
}

.mr--10vh {
    margin-right: 10vh;
}

.mr--20vh {
    margin-right: 20vh;
}

.mr--30vh {
    margin-right: 30vh;
}

.mr--40vh {
    margin-right: 40vh;
}

.mr--60vh {
    margin-right: 60vh;
}

.mr--70vh {
    margin-right: 70vh;
}

.mr--80vh {
    margin-right: 80vh;
}

.mr--90vh {
    margin-right: 90vh;
}

.mr--100vh {
    margin-right: 100vh;
}

/* px */

.mr--1px {
    margin-right: 1px;
}

.mr--2px {
    margin-right: 2px;
}

.mr--3px {
    margin-right: 3px;
}

.mr--4px {
    margin-right: 4px;
}

.mr--5px {
    margin-right: 5px;
}

.mr--6px {
    margin-right: 6px;
}

.mr--7px {
    margin-right: 7px;
}

.mr--8px {
    margin-right: 8px;
}

.mr--9px {
    margin-right: 9px;
}

.mr--10px {
    margin-right: 10px;
}

.mr--20px {
    margin-right: 20px;
}

.mr--30px {
    margin-right: 30px;
}

.mr--40px {
    margin-right: 40px;
}

.mr--50px {
    margin-right: 50px;
}

.mr--60px {
    margin-right: 60px;
}

.mr--70px {
    margin-right: 70px;
}

.mr--80px {
    margin-right: 80px;
}

.mr--90px {
    margin-right: 90px;
}

.mr--100px {
    margin-right: 100px;
}

.mr--150px {
    margin-right: 150px;
}

.mr--200px {
    margin-right: 200px;
}

.mr--250px {
    margin-right: 250px;
}

.mr--300px {
    margin-right: 300px;
}

/* margin-bottom
------------------------------------------------------------------- */

.mb--a,
.mb--auto {
    margin-bottom: auto;
}

.mb--0 {
    margin-bottom: 0;
}

/* em */

.mb--d25e {
    margin-bottom: 0.25em;
}

.mb--d50e {
    margin-bottom: 0.50em;
}

.mb--d75e {
    margin-bottom: 0.75em;
}

.mb--1e {
    margin-bottom: 1em;
}

.mb--2e {
    margin-bottom: 2em;
}

.mb--3e {
    margin-bottom: 3em;
}

.mb--4e {
    margin-bottom: 4em;
}

.mb--5e {
    margin-bottom: 5em;
}

.mb--6e {
    margin-bottom: 6em;
}

.mb--7e {
    margin-bottom: 7em;
}

.mb--8e {
    margin-bottom: 8em;
}

.mb--9e {
    margin-bottom: 9em;
}

.mb--10e {
    margin-bottom: 10em;
}

/* rem */

.mb--d25r {
    margin-bottom: 0.25rem;
}

.mb--d50r {
    margin-bottom: 0.50rem;
}

.mb--d75r {
    margin-bottom: 0.75rem;
}

.mb--1r {
    margin-bottom: 1rem;
}

.mb--2r {
    margin-bottom: 2rem;
}

.mb--3r {
    margin-bottom: 3rem;
}

.mb--4r {
    margin-bottom: 4rem;
}

.mb--5r {
    margin-bottom: 5rem;
}

.mb--6r {
    margin-bottom: 6rem;
}

.mb--7r {
    margin-bottom: 7rem;
}

.mb--8r {
    margin-bottom: 8rem;
}

.mb--9r {
    margin-bottom: 9rem;
}

.mb--10r {
    margin-bottom: 10rem;
}

/* % */

.mb--25p {
    margin-bottom: 25%;
}

.mb--50p {
    margin-bottom: 50%;
}

.mb--75p {
    margin-bottom: 75%;
}

.mb--10p {
    margin-bottom: 10%;
}

.mb--20p {
    margin-bottom: 20%;
}

.mb--30p {
    margin-bottom: 30%;
}

.mb--40p {
    margin-bottom: 40%;
}

.mb--60p {
    margin-bottom: 60%;
}

.mb--70p {
    margin-bottom: 70%;
}

.mb--80p {
    margin-bottom: 80%;
}

.mb--90p {
    margin-bottom: 90%;
}

.mb--100p {
    margin-bottom: 100%;
}

/* vw */

.mb--25vw {
    margin-bottom: 25vw;
}

.mb--50vw {
    margin-bottom: 50vw;
}

.mb--75vw {
    margin-bottom: 75vw;
}

.mb--10vw {
    margin-bottom: 10vw;
}

.mb--20vw {
    margin-bottom: 20vw;
}

.mb--30vw {
    margin-bottom: 30vw;
}

.mb--40vw {
    margin-bottom: 40vw;
}

.mb--60vw {
    margin-bottom: 60vw;
}

.mb--70vw {
    margin-bottom: 70vw;
}

.mb--80vw {
    margin-bottom: 80vw;
}

.mb--90vw {
    margin-bottom: 90vw;
}

.mb--100vw {
    margin-bottom: 100vw;
}

/* vh */

.mb--25vh {
    margin-bottom: 25vh;
}

.mb--50vh {
    margin-bottom: 50vh;
}

.mb--75vh {
    margin-bottom: 75vh;
}

.mb--10vh {
    margin-bottom: 10vh;
}

.mb--20vh {
    margin-bottom: 20vh;
}

.mb--30vh {
    margin-bottom: 30vh;
}

.mb--40vh {
    margin-bottom: 40vh;
}

.mb--60vh {
    margin-bottom: 60vh;
}

.mb--70vh {
    margin-bottom: 70vh;
}

.mb--80vh {
    margin-bottom: 80vh;
}

.mb--90vh {
    margin-bottom: 90vh;
}

.mb--100vh {
    margin-bottom: 100vh;
}

/* px */

.mb--1px {
    margin-bottom: 1px;
}

.mb--2px {
    margin-bottom: 2px;
}

.mb--3px {
    margin-bottom: 3px;
}

.mb--4px {
    margin-bottom: 4px;
}

.mb--5px {
    margin-bottom: 5px;
}

.mb--6px {
    margin-bottom: 6px;
}

.mb--7px {
    margin-bottom: 7px;
}

.mb--8px {
    margin-bottom: 8px;
}

.mb--9px {
    margin-bottom: 9px;
}

.mb--10px {
    margin-bottom: 10px;
}

.mb--20px {
    margin-bottom: 20px;
}

.mb--30px {
    margin-bottom: 30px;
}

.mb--40px {
    margin-bottom: 40px;
}

.mb--50px {
    margin-bottom: 50px;
}

.mb--60px {
    margin-bottom: 60px;
}

.mb--70px {
    margin-bottom: 70px;
}

.mb--80px {
    margin-bottom: 80px;
}

.mb--90px {
    margin-bottom: 90px;
}

.mb--100px {
    margin-bottom: 100px;
}

.mb--150px {
    margin-bottom: 150px;
}

.mb--200px {
    margin-bottom: 200px;
}

.mb--250px {
    margin-bottom: 250px;
}

.mb--300px {
    margin-bottom: 300px;
}

/* margin-left
------------------------------------------------------------------- */

.ml--a,
.ml--auto {
    margin-left: auto;
}

.ml--0 {
    margin-left: 0;
}

/* em */

.ml--d25e {
    margin-left: 0.25em;
}

.ml--d50e {
    margin-left: 0.50em;
}

.ml--d75e {
    margin-left: 0.75em;
}

.ml--1e {
    margin-left: 1em;
}

.ml--2e {
    margin-left: 2em;
}

.ml--3e {
    margin-left: 3em;
}

.ml--4e {
    margin-left: 4em;
}

.ml--5e {
    margin-left: 5em;
}

.ml--6e {
    margin-left: 6em;
}

.ml--7e {
    margin-left: 7em;
}

.ml--8e {
    margin-left: 8em;
}

.ml--9e {
    margin-left: 9em;
}

.ml--10e {
    margin-left: 10em;
}

/* rem */

.ml--d25r {
    margin-left: 0.25rem;
}

.ml--d50r {
    margin-left: 0.50rem;
}

.ml--d75r {
    margin-left: 0.75rem;
}

.ml--1r {
    margin-left: 1rem;
}

.ml--2r {
    margin-left: 2rem;
}

.ml--3r {
    margin-left: 3rem;
}

.ml--4r {
    margin-left: 4rem;
}

.ml--5r {
    margin-left: 5rem;
}

.ml--6r {
    margin-left: 6rem;
}

.ml--7r {
    margin-left: 7rem;
}

.ml--8r {
    margin-left: 8rem;
}

.ml--9r {
    margin-left: 9rem;
}

.ml--10r {
    margin-left: 10rem;
}

/* % */

.ml--25p {
    margin-left: 25%;
}

.ml--50p {
    margin-left: 50%;
}

.ml--75p {
    margin-left: 75%;
}

.ml--10p {
    margin-left: 10%;
}

.ml--20p {
    margin-left: 20%;
}

.ml--30p {
    margin-left: 30%;
}

.ml--40p {
    margin-left: 40%;
}

.ml--60p {
    margin-left: 60%;
}

.ml--70p {
    margin-left: 70%;
}

.ml--80p {
    margin-left: 80%;
}

.ml--90p {
    margin-left: 90%;
}

.ml--100p {
    margin-left: 100%;
}

/* vw */

.ml--25vw {
    margin-left: 25vw;
}

.ml--50vw {
    margin-left: 50vw;
}

.ml--75vw {
    margin-left: 75vw;
}

.ml--10vw {
    margin-left: 10vw;
}

.ml--20vw {
    margin-left: 20vw;
}

.ml--30vw {
    margin-left: 30vw;
}

.ml--40vw {
    margin-left: 40vw;
}

.ml--60vw {
    margin-left: 60vw;
}

.ml--70vw {
    margin-left: 70vw;
}

.ml--80vw {
    margin-left: 80vw;
}

.ml--90vw {
    margin-left: 90vw;
}

.ml--100vw {
    margin-left: 100vw;
}

/* vh */

.ml--25vh {
    margin-left: 25vh;
}

.ml--50vh {
    margin-left: 50vh;
}

.ml--75vh {
    margin-left: 75vh;
}

.ml--10vh {
    margin-left: 10vh;
}

.ml--20vh {
    margin-left: 20vh;
}

.ml--30vh {
    margin-left: 30vh;
}

.ml--40vh {
    margin-left: 40vh;
}

.ml--60vh {
    margin-left: 60vh;
}

.ml--70vh {
    margin-left: 70vh;
}

.ml--80vh {
    margin-left: 80vh;
}

.ml--90vh {
    margin-left: 90vh;
}

.ml--100vh {
    margin-left: 100vh;
}

/* px */

.ml--1px {
    margin-left: 1px;
}

.ml--2px {
    margin-left: 2px;
}

.ml--3px {
    margin-left: 3px;
}

.ml--4px {
    margin-left: 4px;
}

.ml--5px {
    margin-left: 5px;
}

.ml--6px {
    margin-left: 6px;
}

.ml--7px {
    margin-left: 7px;
}

.ml--8px {
    margin-left: 8px;
}

.ml--9px {
    margin-left: 9px;
}

.ml--10px {
    margin-left: 10px;
}

.ml--20px {
    margin-left: 20px;
}

.ml--30px {
    margin-left: 30px;
}

.ml--40px {
    margin-left: 40px;
}

.ml--50px {
    margin-left: 50px;
}

.ml--60px {
    margin-left: 60px;
}

.ml--70px {
    margin-left: 70px;
}

.ml--80px {
    margin-left: 80px;
}

.ml--90px {
    margin-left: 90px;
}

.ml--100px {
    margin-left: 100px;
}

.ml--150px {
    margin-left: 150px;
}

.ml--200px {
    margin-left: 200px;
}

.ml--250px {
    margin-left: 250px;
}

.ml--300px {
    margin-left: 300px;
}

/* margin-top-bottom
------------------------------------------------------------------- */

.mtb--a,
.mtb--auto {
    margin-top: auto;
    margin-bottom: auto;
}

.mtb--0 {
    margin-top: 0;
    margin-bottom: 0;
}

/* em */

.mtb--d25e {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
}

.mtb--d50e {
    margin-top: 0.50em;
    margin-bottom: 0.50em;
}

.mtb--d75e {
    margin-top: 0.75em;
    margin-bottom: 0.75em;
    margin: 1rem 1rem;
}

.mtb--1e {
    margin-top: 1em;
    margin-bottom: 1em;
}

.mtb--2e {
    margin-top: 2em;
    margin-bottom: 2em;
}

.mtb--3e {
    margin-top: 3em;
    margin-bottom: 3em;
}

.mtb--4e {
    margin-top: 4em;
    margin-bottom: 4em;
}

.mtb--5e {
    margin-top: 5em;
    margin-bottom: 5em;
}

.mtb--6e {
    margin-top: 6em;
    margin-bottom: 6em;
}

.mtb--7e {
    margin-top: 7em;
    margin-bottom: 7em;
}

.mtb--8e {
    margin-top: 8em;
    margin-bottom: 8em;
}

.mtb--9e {
    margin-top: 9em;
    margin-bottom: 9em;
}

.mtb--10e {
    margin-top: 10em;
    margin-bottom: 10em;
}

/* rem */

.mtb--d25r {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
}

.mtb--d50r {
    margin-top: 0.50rem;
    margin-bottom: 0.50rem;
}

.mtb--d75r {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
}

.mtb--1r {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.mtb--2r {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.mtb--3r {
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.mtb--4r {
    margin-top: 4rem;
    margin-bottom: 4rem;
}

.mtb--5r {
    margin-top: 5rem;
    margin-bottom: 5rem;
}

.mtb--6r {
    margin-top: 6rem;
    margin-bottom: 6rem;
}

.mtb--7r {
    margin-top: 7rem;
    margin-bottom: 7rem;
}

.mtb--8r {
    margin-top: 8rem;
    margin-bottom: 8rem;
}

.mtb--9r {
    margin-top: 9rem;
    margin-bottom: 9rem;
}

.mtb--10r {
    margin-top: 10rem;
    margin-bottom: 10rem;
}

/* % */

.mtb--25p {
    margin-top: 25%;
    margin-bottom: 25%;
}

.mtb--50p {
    margin-top: 50%;
    margin-bottom: 50%;
}

.mtb--75p {
    margin-top: 75%;
    margin-bottom: 75%;
}

.mtb--10p {
    margin-top: 10%;
    margin-bottom: 10%;
}

.mtb--20p {
    margin-top: 20%;
    margin-bottom: 20%;
}

.mtb--30p {
    margin-top: 30%;
    margin-bottom: 30%;
}

.mtb--40p {
    margin-top: 40%;
    margin-bottom: 40%;
}

.mtb--60p {
    margin-top: 60%;
    margin-bottom: 60%;
}

.mtb--70p {
    margin-top: 70%;
    margin-bottom: 70%;
}

.mtb--80p {
    margin-top: 80%;
    margin-bottom: 80%;
}

.mtb--90p {
    margin-top: 90%;
    margin-bottom: 90%;
}

.mtb--100p {
    margin-top: 100%;
    margin-bottom: 100%;
}

/* vw */

.mtb--25vw {
    margin-top: 25vw;
    margin-bottom: 25vw;
}

.mtb--50vw {
    margin-top: 50vw;
    margin-bottom: 50vw;
}

.mtb--75vw {
    margin-top: 75vw;
    margin-bottom: 75vw;
}

.mtb--10vw {
    margin-top: 10vw;
    margin-bottom: 10vw;
}

.mtb--20vw {
    margin-top: 20vw;
    margin-bottom: 20vw;
}

.mtb--30vw {
    margin-top: 30vw;
    margin-bottom: 30vw;
}

.mtb--40vw {
    margin-top: 40vw;
    margin-bottom: 40vw;
}

.mtb--60vw {
    margin-top: 60vw;
    margin-bottom: 60vw;
}

.mtb--70vw {
    margin-top: 70vw;
    margin-bottom: 70vw;
    m:1r1r  ;
}

.mtb--80vw {
    margin-top: 80vw;
    margin-bottom: 80vw;
}

.mtb--90vw {
    margin-top: 90vw;
    margin-bottom: 90vw;
}

.mtb--100vw {
    margin-top: 100vw;
    margin-bottom: 100vw;
}

/* vh */

.mtb--25vh {
    margin-top: 25vh;
    margin-bottom: 25vh;
}

.mtb--50vh {
    margin-top: 50vh;
    margin-bottom: 50vh;
}

.mtb--75vh {
    margin-top: 75vh;
    margin-bottom: 75vh;
}

.mtb--10vh {
    margin-top: 10vh;
    margin-bottom: 10vh;
}

.mtb--20vh {
    margin-top: 20vh;
    margin-bottom: 20vh;
}

.mtb--30vh {
    margin-top: 30vh;
    margin-bottom: 30vh;
}

.mtb--40vh {
    margin-top: 40vh;
    margin-bottom: 40vh;
}

.mtb--60vh {
    margin-top: 60vh;
    margin-bottom: 60vh;
}

.mtb--70vh {
    margin-top: 70vh;
    margin-bottom: 70vh;
}

.mtb--80vh {
    margin-top: 80vh;
    margin-bottom: 80vh;
}

.mtb--90vh {
    margin-top: 90vh;
    margin-t: 90vh;
}

.mtb--100vh {
    margin-top: 100vh;
    margin-bottom: 100vh;
}

/* px */

.mtb--1px {
    margin-top: 1px;
    margin-bottom: 1px;
}

.mtb--2px {
    margin-top: 2px;
    margin-bottom: 2px;
}

.mtb--3px {
    margin-top: 3px;
    margin-bottom: 3px;
}

.mtb--4px {
    margin-top: 4px;
    margin-bottom: 4px;
}

.mtb--5px {
    margin-top: 5px;
    margin-bottom: 5px;
}

.mtb--6px {
    margin-top: 6px;
    margin-bottom: 6px;
}

.mtb--7px {
    margin-top: 7px;
    margin-bottom: 7px;
}

.mtb--8px {
    margin-top: 8px;
    margin-bottom: 8px;
}

.mtb--9px {
    margin-top: 9px;
    margin-bottom: 9px;
}

.mtb--10px {
    margin-top: 10px;
    margin-bottom: 10px;
}

.mtb--20px {
    margin-top: 20px;
    margin-bottom: 20px;
}

.mtb--30px {
    margin-top: 30px;
    margin-bottom: 30px;
}

.mtb--40px {
    margin-top: 40px;
    margin-bottom: 40px;
}

.mtb--50px {
    margin-top: 50px;
    margin-bottom: 50px;
}

.mtb--60px {
    margin-top: 60px;
    margin-bottom: 60px;
}

.mtb--70px {
    margin-top: 70px;
    margin-bottom: 70px;
}

.mtb--80px {
    margin-top: 80px;
    margin-bottom: 80px;
}

.mtb--90px {
    margin-top: 90px;
    margin-bottom: 90px;
}

.mtb--100px {
    margin-top: 100px;
    margin-bottom: 100px;
}

.mtb--150px {
    margin-top: 150px;
    margin-bottom: 150px;
}

.mtb--200px {
    margin-top: 200px;
    margin-bottom: 200px;
}

.mtb--250px {
    margin-top: 250px;
    margin-bottom: 250px;
}

.mtb--300px {
    margin-top: 300px;
    margin-bottom: 300px;
}

/* margin-right-left
------------------------------------------------------------------- */

.mrl--a,
.mrl--auto {
    margin-right: auto;
    margin-left: auto;
}

.mrl--0 {
    margin-right: 0;
    margin-left: 0;
}

/* em */

.mrl--d25e {
    margin-right: 0.25em;
    margin-left: 0.25em;
}

.mrl--d50e {
    margin-right: 0.50em;
    margin-left: 0.50em;
}

.mrl--d75e {
    margin-right: 0.75em;
    margin-left: 0.75em;
    margin: 1rem 1rem;
}

.mrl--1e {
    margin-right: 1em;
    margin-left: 1em;
}

.mrl--2e {
    margin-right: 2em;
    margin-left: 2em;
}

.mrl--3e {
    margin-right: 3em;
    margin-left: 3em;
}

.mrl--4e {
    margin-right: 4em;
    margin-left: 4em;
}

.mrl--5e {
    margin-right: 5em;
    margin-left: 5em;
}

.mrl--6e {
    margin-right: 6em;
    margin-left: 6em;
}

.mrl--7e {
    margin-right: 7em;
    margin-left: 7em;
}

.mrl--8e {
    margin-right: 8em;
    margin-left: 8em;
}

.mrl--9e {
    margin-right: 9em;
    margin-left: 9em;
}

.mrl--10e {
    margin-right: 10em;
    margin-left: 10em;
}

/* rem */

.mrl--d25r {
    margin-right: 0.25rem;
    margin-left: 0.25rem;
}

.mrl--d50r {
    margin-right: 0.50rem;
    margin-left: 0.50rem;
}

.mrl--d75r {
    margin-right: 0.75rem;
    margin-left: 0.75rem;
}

.mrl--1r {
    margin-right: 1rem;
    margin-left: 1rem;
}

.mrl--2r {
    margin-right: 2rem;
    margin-left: 2rem;
}

.mrl--3r {
    margin-right: 3rem;
    margin-left: 3rem;
}

.mrl--4r {
    margin-right: 4rem;
    margin-left: 4rem;
}

.mrl--5r {
    margin-right: 5rem;
    margin-left: 5rem;
}

.mrl--6r {
    margin-right: 6rem;
    margin-left: 6rem;
}

.mrl--7r {
    margin-right: 7rem;
    margin-left: 7rem;
}

.mrl--8r {
    margin-right: 8rem;
    margin-left: 8rem;
}

.mrl--9r {
    margin-right: 9rem;
    margin-left: 9rem;
}

.mrl--10r {
    margin-right: 10rem;
    margin-left: 10rem;
}

/* % */

.mrl--25p {
    margin-right: 25%;
    margin-left: 25%;
}

.mrl--50p {
    margin-right: 50%;
    margin-left: 50%;
}

.mrl--75p {
    margin-right: 75%;
    margin-left: 75%;
}

.mrl--10p {
    margin-right: 10%;
    margin-left: 10%;
}

.mrl--20p {
    margin-right: 20%;
    margin-left: 20%;
}

.mrl--30p {
    margin-right: 30%;
    margin-left: 30%;
}

.mrl--40p {
    margin-right: 40%;
    margin-left: 40%;
}

.mrl--60p {
    margin-right: 60%;
    margin-left: 60%;
}

.mrl--70p {
    margin-right: 70%;
    margin-left: 70%;
}

.mrl--80p {
    margin-right: 80%;
    margin-left: 80%;
}

.mrl--90p {
    margin-right: 90%;
    margin-left: 90%;
}

.mrl--100p {
    margin-right: 100%;
    margin-left: 100%;
}

/* vw */

.mrl--25vw {
    margin-right: 25vw;
    margin-left: 25vw;
}

.mrl--50vw {
    margin-right: 50vw;
    margin-left: 50vw;
}

.mrl--75vw {
    margin-right: 75vw;
    margin-left: 75vw;
}

.mrl--10vw {
    margin-right: 10vw;
    margin-left: 10vw;
}

.mrl--20vw {
    margin-right: 20vw;
    margin-left: 20vw;
}

.mrl--30vw {
    margin-right: 30vw;
    margin-left: 30vw;
}

.mrl--40vw {
    margin-right: 40vw;
    margin-left: 40vw;
}

.mrl--60vw {
    margin-right: 60vw;
    margin-left: 60vw;
}

.mrl--70vw {
    margin-right: 70vw;
    margin-left: 70vw;
    m:1r1r  ;
}

.mrl--80vw {
    margin-right: 80vw;
    margin-left: 80vw;
}

.mrl--90vw {
    margin-right: 90vw;
    margin-left: 90vw;
}

.mrl--100vw {
    margin-right: 100vw;
    margin-left: 100vw;
}

/* vh */

.mrl--25vh {
    margin-right: 25vh;
    margin-left: 25vh;
}

.mrl--50vh {
    margin-right: 50vh;
    margin-left: 50vh;
}

.mrl--75vh {
    margin-right: 75vh;
    margin-left: 75vh;
}

.mrl--10vh {
    margin-right: 10vh;
    margin-left: 10vh;
}

.mrl--20vh {
    margin-right: 20vh;
    margin-left: 20vh;
}

.mrl--30vh {
    margin-right: 30vh;
    margin-left: 30vh;
}

.mrl--40vh {
    margin-right: 40vh;
    margin-left: 40vh;
}

.mrl--60vh {
    margin-right: 60vh;
    margin-left: 60vh;
}

.mrl--70vh {
    margin-right: 70vh;
    margin-left: 70vh;
}

.mrl--80vh {
    margin-right: 80vh;
    margin-left: 80vh;
}

.mrl--90vh {
    margin-right: 90vh;
    margin-left: 90vh;
}

.mrl--100vh {
    margin-right: 100vh;
    margin-left: 100vh;
}

/* px */

.mrl--1px {
    margin-right: 1px;
    margin-left: 1px;
}

.mrl--2px {
    margin-right: 2px;
    margin-left: 2px;
}

.mrl--3px {
    margin-right: 3px;
    margin-left: 3px;
}

.mrl--4px {
    margin-right: 4px;
    margin-left: 4px;
}

.mrl--5px {
    margin-right: 5px;
    margin-left: 5px;
}

.mrl--6px {
    margin-right: 6px;
    margin-left: 6px;
}

.mrl--7px {
    margin-right: 7px;
    margin-left: 7px;
}

.mrl--8px {
    margin-right: 8px;
    margin-left: 8px;
}

.mrl--9px {
    margin-right: 9px;
    margin-left: 9px;
}

.mrl--10px {
    margin-right: 10px;
    margin-left: 10px;
}

.mrl--20px {
    margin-right: 20px;
    margin-left: 20px;
}

.mrl--30px {
    margin-right: 30px;
    margin-left: 30px;
}

.mrl--40px {
    margin-right: 40px;
    margin-left: 40px;
}

.mrl--50px {
    margin-right: 50px;
    margin-left: 50px;
}

.mrl--60px {
    margin-right: 60px;
    margin-left: 60px;
}

.mrl--70px {
    margin-right: 70px;
    margin-left: 70px;
}

.mrl--80px {
    margin-right: 80px;
    margin-left: 80px;
}

.mrl--90px {
    margin-right: 90px;
    margin-left: 90px;
}

.mrl--100px {
    margin-right: 100px;
    margin-left: 100px;
}

.mrl--150px {
    margin-right: 150px;
    margin-left: 150px;
}

.mrl--200px {
    margin-right: 200px;
    margin-left: 200px;
}

.mrl--250px {
    margin-right: 250px;
    margin-left: 250px;
}

.mrl--300px {
    margin-right: 300px;
    margin-left: 300px;
}

/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––––––––– margin */

/* padding
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

.p--0 {
    padding: 0;
}

/* em */

.p--d25e {
    padding: 0.25em;
}

.p--d50e {
    padding: 0.50em;
}

.p--d75e {
    padding: 0.75em;
}

.p--1e {
    padding: 1em;
}

.p--2e {
    padding: 2em;
}

.p--3e {
    padding: 3em;
}

.p--4e {
    padding: 4em;
}

.p--5e {
    padding: 5em;
}

.p--6e {
    padding: 6em;
}

.p--7e {
    padding: 7em;
}

.p--8e {
    padding: 8em;
}

.p--9e {
    padding: 9em;
}

.p--10e {
    padding: 10em;
}

/* rem */

.p--d25r {
    padding: 0.25rem;
}

.p--d50r {
    padding: 0.50rem;
}

.p--d75r {
    padding: 0.75rem;
}

.p--1r {
    padding: 1rem;
}

.p--2r {
    padding: 2rem;
}

.p--3r {
    padding: 3rem;
}

.p--4r {
    padding: 4rem;
}

.p--5r {
    padding: 5rem;
}

.p--6r {
    padding: 6rem;
}

.p--7r {
    padding: 7rem;
}

.p--8r {
    padding: 8rem;
}

.p--9r {
    padding: 9rem;
}

.p--10r {
    padding: 10rem;
}

/* % */

.p--25p {
    padding: 25%;
}

.p--50p {
    padding: 50%;
}

.p--75p {
    padding: 75%;
}

.p--10p {
    padding: 10%;
}

.p--20p {
    padding: 20%;
}

.p--30p {
    padding: 30%;
}

.p--40p {
    padding: 40%;
}

.p--60p {
    padding: 60%;
}

.p--70p {
    padding: 70%;
}

.p--80p {
    padding: 80%;
}

.p--90p {
    padding: 90%;
}

.p--100p {
    padding: 100%;
}

/* vw */

.p--25vw {
    padding: 25vw;
}

.p--50vw {
    padding: 50vw;
}

.p--75vw {
    padding: 75vw;
}

.p--10vw {
    padding: 10vw;
}

.p--20vw {
    padding: 20vw;
}

.p--30vw {
    padding: 30vw;
}

.p--40vw {
    padding: 40vw;
}

.p--60vw {
    padding: 60vw;
}

.p--70vw {
    padding: 70vw;
}

.p--80vw {
    padding: 80vw;
}

.p--90vw {
    padding: 90vw;
}

.p--100vw {
    padding: 100vw;
}

/* vh */

.p--25vh {
    padding: 25vh;
}

.p--50vh {
    padding: 50vh;
}

.p--75vh {
    padding: 75vh;
}

.p--10vh {
    padding: 10vh;
}

.p--20vh {
    padding: 20vh;
}

.p--30vh {
    padding: 30vh;
}

.p--40vh {
    padding: 40vh;
}

.p--60vh {
    padding: 60vh;
}

.p--70vh {
    padding: 70vh;
}

.p--80vh {
    padding: 80vh;
}

.p--90vh {
    padding: 90vh;
}

.p--100vh {
    padding: 100vh;
}

/* px */

.p--1px {
    padding: 1px;
}

.p--2px {
    padding: 2px;
}

.p--3px {
    padding: 3px;
}

.p--4px {
    padding: 4px;
}

.p--5px {
    padding: 5px;
}

.p--6px {
    padding: 6px;
}

.p--7px {
    padding: 7px;
}

.p--8px {
    padding: 8px;
}

.p--9px {
    padding: 9px;
}

.p--10px {
    padding: 10px;
}

.p--20px {
    padding: 20px;
}

.p--30px {
    padding: 30px;
}

.p--40px {
    padding: 40px;
}

.p--50px {
    padding: 50px;
}

.p--60px {
    padding: 60px;
}

.p--70px {
    padding: 70px;
}

.p--80px {
    padding: 80px;
}

.p--90px {
    padding: 90px;
}

.p--100px {
    padding: 100px;
}

.p--150px {
    padding: 150px;
}

.p--200px {
    padding: 200px;
}

.p--250px {
    padding: 250px;
}

.p--300px {
    padding: 300px;
}

/* padding-top
------------------------------------------------------------------- */

.pt--0 {
    padding-top: 0;
}

/* em */

.pt--d25e {
    padding-top: 0.25em;
}

.pt--d50e {
    padding-top: 0.50em;
}

.pt--d75e {
    padding-top: 0.75em;
}

.pt--1e {
    padding-top: 1em;
}

.pt--2e {
    padding-top: 2em;
}

.pt--3e {
    padding-top: 3em;
}

.pt--4e {
    padding-top: 4em;
}

.pt--5e {
    padding-top: 5em;
}

.pt--6e {
    padding-top: 6em;
}

.pt--7e {
    padding-top: 7em;
}

.pt--8e {
    padding-top: 8em;
}

.pt--9e {
    padding-top: 9em;
}

.pt--10e {
    padding-top: 10em;
}

/* rem */

.pt--d25r {
    padding-top: 0.25rem;
}

.pt--d50r {
    padding-top: 0.50rem;
}

.pt--d75r {
    padding-top: 0.75rem;
}

.pt--1r {
    padding-top: 1rem;
}

.pt--2r {
    padding-top: 2rem;
}

.pt--3r {
    padding-top: 3rem;
}

.pt--4r {
    padding-top: 4rem;
}

.pt--5r {
    padding-top: 5rem;
}

.pt--6r {
    padding-top: 6rem;
}

.pt--7r {
    padding-top: 7rem;
}

.pt--8r {
    padding-top: 8rem;
}

.pt--9r {
    padding-top: 9rem;
}

.pt--10r {
    padding-top: 10rem;
}

/* % */

.pt--25p {
    padding-top: 25%;
}

.pt--50p {
    padding-top: 50%;
}

.pt--75p {
    padding-top: 75%;
}

.pt--10p {
    padding-top: 10%;
}

.pt--20p {
    padding-top: 20%;
}

.pt--30p {
    padding-top: 30%;
}

.pt--40p {
    padding-top: 40%;
}

.pt--60p {
    padding-top: 60%;
}

.pt--70p {
    padding-top: 70%;
}

.pt--80p {
    padding-top: 80%;
}

.pt--90p {
    padding-top: 90%;
}

.pt--100p {
    padding-top: 100%;
}

/* vw */

.pt--25vw {
    padding-top: 25vw;
}

.pt--50vw {
    padding-top: 50vw;
}

.pt--75vw {
    padding-top: 75vw;
}

.pt--10vw {
    padding-top: 10vw;
}

.pt--20vw {
    padding-top: 20vw;
}

.pt--30vw {
    padding-top: 30vw;
}

.pt--40vw {
    padding-top: 40vw;
}

.pt--60vw {
    padding-top: 60vw;
}

.pt--70vw {
    padding-top: 70vw;
}

.pt--80vw {
    padding-top: 80vw;
}

.pt--90vw {
    padding-top: 90vw;
}

.pt--100vw {
    padding-top: 100vw;
}

/* vh */

.pt--25vh {
    padding-top: 25vh;
}

.pt--50vh {
    padding-top: 50vh;
}

.pt--75vh {
    padding-top: 75vh;
}

.pt--10vh {
    padding-top: 10vh;
}

.pt--20vh {
    padding-top: 20vh;
}

.pt--30vh {
    padding-top: 30vh;
}

.pt--40vh {
    padding-top: 40vh;
}

.pt--60vh {
    padding-top: 60vh;
}

.pt--70vh {
    padding-top: 70vh;
}

.pt--80vh {
    padding-top: 80vh;
}

.pt--90vh {
    padding-top: 90vh;
}

.pt--100vh {
    padding-top: 100vh;
}

/* px */

.pt--1px {
    padding-top: 1px;
}

.pt--2px {
    padding-top: 2px;
}

.pt--3px {
    padding-top: 3px;
}

.pt--4px {
    padding-top: 4px;
}

.pt--5px {
    padding-top: 5px;
}

.pt--6px {
    padding-top: 6px;
}

.pt--7px {
    padding-top: 7px;
}

.pt--8px {
    padding-top: 8px;
}

.pt--9px {
    padding-top: 9px;
}

.pt--10px {
    padding-top: 10px;
}

.pt--20px {
    padding-top: 20px;
}

.pt--30px {
    padding-top: 30px;
}

.pt--40px {
    padding-top: 40px;
}

.pt--50px {
    padding-top: 50px;
}

.pt--60px {
    padding-top: 60px;
}

.pt--70px {
    padding-top: 70px;
}

.pt--80px {
    padding-top: 80px;
}

.pt--90px {
    padding-top: 90px;
}

.pt--100px {
    padding-top: 100px;
}

.pt--150px {
    padding-top: 150px;
}

.pt--200px {
    padding-top: 200px;
}

.pt--250px {
    padding-top: 250px;
}

.pt--300px {
    padding-top: 300px;
}

/* padding-right
------------------------------------------------------------------- */

.pr--0 {
    padding-right: 0;
}

/* em */

.pr--d25e {
    padding-right: 0.25em;
}

.pr--d50e {
    padding-right: 0.50em;
}

.pr--d75e {
    padding-right: 0.75em;
}

.pr--1e {
    padding-right: 1em;
}

.pr--2e {
    padding-right: 2em;
}

.pr--3e {
    padding-right: 3em;
}

.pr--4e {
    padding-right: 4em;
}

.pr--5e {
    padding-right: 5em;
}

.pr--6e {
    padding-right: 6em;
}

.pr--7e {
    padding-right: 7em;
}

.pr--8e {
    padding-right: 8em;
}

.pr--9e {
    padding-right: 9em;
}

.pr--10e {
    padding-right: 10em;
}

/* rem */

.pr--d25r {
    padding-right: 0.25rem;
}

.pr--d50r {
    padding-right: 0.50rem;
}

.pr--d75r {
    padding-right: 0.75rem;
}

.pr--1r {
    padding-right: 1rem;
}

.pr--2r {
    padding-right: 2rem;
}

.pr--3r {
    padding-right: 3rem;
}

.pr--4r {
    padding-right: 4rem;
}

.pr--5r {
    padding-right: 5rem;
}

.pr--6r {
    padding-right: 6rem;
}

.pr--7r {
    padding-right: 7rem;
}

.pr--8r {
    padding-right: 8rem;
}

.pr--9r {
    padding-right: 9rem;
}

.pr--10r {
    padding-right: 10rem;
}

/* % */

.pr--25p {
    padding-right: 25%;
}

.pr--50p {
    padding-right: 50%;
}

.pr--75p {
    padding-right: 75%;
}

.pr--10p {
    padding-right: 10%;
}

.pr--20p {
    padding-right: 20%;
}

.pr--30p {
    padding-right: 30%;
}

.pr--40p {
    padding-right: 40%;
}

.pr--60p {
    padding-right: 60%;
}

.pr--70p {
    padding-right: 70%;
}

.pr--80p {
    padding-right: 80%;
}

.pr--90p {
    padding-right: 90%;
}

.pr--100p {
    padding-right: 100%;
}

/* vw */

.pr--25vw {
    padding-right: 25vw;
}

.pr--50vw {
    padding-right: 50vw;
}

.pr--75vw {
    padding-right: 75vw;
}

.pr--10vw {
    padding-right: 10vw;
}

.pr--20vw {
    padding-right: 20vw;
}

.pr--30vw {
    padding-right: 30vw;
}

.pr--40vw {
    padding-right: 40vw;
}

.pr--60vw {
    padding-right: 60vw;
}

.pr--70vw {
    padding-right: 70vw;
}

.pr--80vw {
    padding-right: 80vw;
}

.pr--90vw {
    padding-right: 90vw;
}

.pr--100vw {
    padding-right: 100vw;
}

/* vh */

.pr--25vh {
    padding-right: 25vh;
}

.pr--50vh {
    padding-right: 50vh;
}

.pr--75vh {
    padding-right: 75vh;
}

.pr--10vh {
    padding-right: 10vh;
}

.pr--20vh {
    padding-right: 20vh;
}

.pr--30vh {
    padding-right: 30vh;
}

.pr--40vh {
    padding-right: 40vh;
}

.pr--60vh {
    padding-right: 60vh;
}

.pr--70vh {
    padding-right: 70vh;
}

.pr--80vh {
    padding-right: 80vh;
}

.pr--90vh {
    padding-right: 90vh;
}

.pr--100vh {
    padding-right: 100vh;
}

/* px */

.pr--1px {
    padding-right: 1px;
}

.pr--2px {
    padding-right: 2px;
}

.pr--3px {
    padding-right: 3px;
}

.pr--4px {
    padding-right: 4px;
}

.pr--5px {
    padding-right: 5px;
}

.pr--6px {
    padding-right: 6px;
}

.pr--7px {
    padding-right: 7px;
}

.pr--8px {
    padding-right: 8px;
}

.pr--9px {
    padding-right: 9px;
}

.pr--10px {
    padding-right: 10px;
}

.pr--20px {
    padding-right: 20px;
}

.pr--30px {
    padding-right: 30px;
}

.pr--40px {
    padding-right: 40px;
}

.pr--50px {
    padding-right: 50px;
}

.pr--60px {
    padding-right: 60px;
}

.pr--70px {
    padding-right: 70px;
}

.pr--80px {
    padding-right: 80px;
}

.pr--90px {
    padding-right: 90px;
}

.pr--100px {
    padding-right: 100px;
}

.pr--150px {
    padding-right: 150px;
}

.pr--200px {
    padding-right: 200px;
}

.pr--250px {
    padding-right: 250px;
}

.pr--300px {
    padding-right: 300px;
}

/* padding-bottom
------------------------------------------------------------------- */

.pb--0 {
    padding-bottom: 0;
}

/* em */

.pb--d25e {
    padding-bottom: 0.25em;
}

.pb--d50e {
    padding-bottom: 0.50em;
}

.pb--d75e {
    padding-bottom: 0.75em;
}

.pb--1e {
    padding-bottom: 1em;
}

.pb--2e {
    padding-bottom: 2em;
}

.pb--3e {
    padding-bottom: 3em;
}

.pb--4e {
    padding-bottom: 4em;
}

.pb--5e {
    padding-bottom: 5em;
}

.pb--6e {
    padding-bottom: 6em;
}

.pb--7e {
    padding-bottom: 7em;
}

.pb--8e {
    padding-bottom: 8em;
}

.pb--9e {
    padding-bottom: 9em;
}

.pb--10e {
    padding-bottom: 10em;
}

/* rem */

.pb--d25r {
    padding-bottom: 0.25rem;
}

.pb--d50r {
    padding-bottom: 0.50rem;
}

.pb--d75r {
    padding-bottom: 0.75rem;
}

.pb--1r {
    padding-bottom: 1rem;
}

.pb--2r {
    padding-bottom: 2rem;
}

.pb--3r {
    padding-bottom: 3rem;
}

.pb--4r {
    padding-bottom: 4rem;
}

.pb--5r {
    padding-bottom: 5rem;
}

.pb--6r {
    padding-bottom: 6rem;
}

.pb--7r {
    padding-bottom: 7rem;
}

.pb--8r {
    padding-bottom: 8rem;
}

.pb--9r {
    padding-bottom: 9rem;
}

.pb--10r {
    padding-bottom: 10rem;
}

/* % */

.pb--25p {
    padding-bottom: 25%;
}

.pb--50p {
    padding-bottom: 50%;
}

.pb--75p {
    padding-bottom: 75%;
}

.pb--10p {
    padding-bottom: 10%;
}

.pb--20p {
    padding-bottom: 20%;
}

.pb--30p {
    padding-bottom: 30%;
}

.pb--40p {
    padding-bottom: 40%;
}

.pb--60p {
    padding-bottom: 60%;
}

.pb--70p {
    padding-bottom: 70%;
}

.pb--80p {
    padding-bottom: 80%;
}

.pb--90p {
    padding-bottom: 90%;
}

.pb--100p {
    padding-bottom: 100%;
}

/* vw */

.pb--25vw {
    padding-bottom: 25vw;
}

.pb--50vw {
    padding-bottom: 50vw;
}

.pb--75vw {
    padding-bottom: 75vw;
}

.pb--10vw {
    padding-bottom: 10vw;
}

.pb--20vw {
    padding-bottom: 20vw;
}

.pb--30vw {
    padding-bottom: 30vw;
}

.pb--40vw {
    padding-bottom: 40vw;
}

.pb--60vw {
    padding-bottom: 60vw;
}

.pb--70vw {
    padding-bottom: 70vw;
}

.pb--80vw {
    padding-bottom: 80vw;
}

.pb--90vw {
    padding-bottom: 90vw;
}

.pb--100vw {
    padding-bottom: 100vw;
}

/* vh */

.pb--25vh {
    padding-bottom: 25vh;
}

.pb--50vh {
    padding-bottom: 50vh;
}

.pb--75vh {
    padding-bottom: 75vh;
}

.pb--10vh {
    padding-bottom: 10vh;
}

.pb--20vh {
    padding-bottom: 20vh;
}

.pb--30vh {
    padding-bottom: 30vh;
}

.pb--40vh {
    padding-bottom: 40vh;
}

.pb--60vh {
    padding-bottom: 60vh;
}

.pb--70vh {
    padding-bottom: 70vh;
}

.pb--80vh {
    padding-bottom: 80vh;
}

.pb--90vh {
    padding-bottom: 90vh;
}

.pb--100vh {
    padding-bottom: 100vh;
}

/* px */

.pb--1px {
    padding-bottom: 1px;
}

.pb--2px {
    padding-bottom: 2px;
}

.pb--3px {
    padding-bottom: 3px;
}

.pb--4px {
    padding-bottom: 4px;
}

.pb--5px {
    padding-bottom: 5px;
}

.pb--6px {
    padding-bottom: 6px;
}

.pb--7px {
    padding-bottom: 7px;
}

.pb--8px {
    padding-bottom: 8px;
}

.pb--9px {
    padding-bottom: 9px;
}

.pb--10px {
    padding-bottom: 10px;
}

.pb--20px {
    padding-bottom: 20px;
}

.pb--30px {
    padding-bottom: 30px;
}

.pb--40px {
    padding-bottom: 40px;
}

.pb--50px {
    padding-bottom: 50px;
}

.pb--60px {
    padding-bottom: 60px;
}

.pb--70px {
    padding-bottom: 70px;
}

.pb--80px {
    padding-bottom: 80px;
}

.pb--90px {
    padding-bottom: 90px;
}

.pb--100px {
    padding-bottom: 100px;
}

.pb--150px {
    padding-bottom: 150px;
}

.pb--200px {
    padding-bottom: 200px;
}

.pb--250px {
    padding-bottom: 250px;
}

.pb--300px {
    padding-bottom: 300px;
}

/* padding-left
------------------------------------------------------------------- */

.pl--0 {
    padding-left: 0;
}

/* em */

.pl--d25e {
    padding-left: 0.25em;
}

.pl--d50e {
    padding-left: 0.50em;
}

.pl--d75e {
    padding-left: 0.75em;
}

.pl--1e {
    padding-left: 1em;
}

.pl--2e {
    padding-left: 2em;
}

.pl--3e {
    padding-left: 3em;
}

.pl--4e {
    padding-left: 4em;
}

.pl--5e {
    padding-left: 5em;
}

.pl--6e {
    padding-left: 6em;
}

.pl--7e {
    padding-left: 7em;
}

.pl--8e {
    padding-left: 8em;
}

.pl--9e {
    padding-left: 9em;
}

.pl--10e {
    padding-left: 10em;
}

/* rem */

.pl--d25r {
    padding-left: 0.25rem;
}

.pl--d50r {
    padding-left: 0.50rem;
}

.pl--d75r {
    padding-left: 0.75rem;
}

.pl--1r {
    padding-left: 1rem;
}

.pl--2r {
    padding-left: 2rem;
}

.pl--3r {
    padding-left: 3rem;
}

.pl--4r {
    padding-left: 4rem;
}

.pl--5r {
    padding-left: 5rem;
}

.pl--6r {
    padding-left: 6rem;
}

.pl--7r {
    padding-left: 7rem;
}

.pl--8r {
    padding-left: 8rem;
}

.pl--9r {
    padding-left: 9rem;
}

.pl--10r {
    padding-left: 10rem;
}

/* % */

.pl--25p {
    padding-left: 25%;
}

.pl--50p {
    padding-left: 50%;
}

.pl--75p {
    padding-left: 75%;
}

.pl--10p {
    padding-left: 10%;
}

.pl--20p {
    padding-left: 20%;
}

.pl--30p {
    padding-left: 30%;
}

.pl--40p {
    padding-left: 40%;
}

.pl--60p {
    padding-left: 60%;
}

.pl--70p {
    padding-left: 70%;
}

.pl--80p {
    padding-left: 80%;
}

.pl--90p {
    padding-left: 90%;
}

.pl--100p {
    padding-left: 100%;
}

/* vw */

.pl--25vw {
    padding-left: 25vw;
}

.pl--50vw {
    padding-left: 50vw;
}

.pl--75vw {
    padding-left: 75vw;
}

.pl--10vw {
    padding-left: 10vw;
}

.pl--20vw {
    padding-left: 20vw;
}

.pl--30vw {
    padding-left: 30vw;
}

.pl--40vw {
    padding-left: 40vw;
}

.pl--60vw {
    padding-left: 60vw;
}

.pl--70vw {
    padding-left: 70vw;
}

.pl--80vw {
    padding-left: 80vw;
}

.pl--90vw {
    padding-left: 90vw;
}

.pl--100vw {
    padding-left: 100vw;
}

/* vh */

.pl--25vh {
    padding-left: 25vh;
}

.pl--50vh {
    padding-left: 50vh;
}

.pl--75vh {
    padding-left: 75vh;
}

.pl--10vh {
    padding-left: 10vh;
}

.pl--20vh {
    padding-left: 20vh;
}

.pl--30vh {
    padding-left: 30vh;
}

.pl--40vh {
    padding-left: 40vh;
}

.pl--60vh {
    padding-left: 60vh;
}

.pl--70vh {
    padding-left: 70vh;
}

.pl--80vh {
    padding-left: 80vh;
}

.pl--90vh {
    padding-left: 90vh;
}

.pl--100vh {
    padding-left: 100vh;
}

/* px */

.pl--1px {
    padding-left: 1px;
}

.pl--2px {
    padding-left: 2px;
}

.pl--3px {
    padding-left: 3px;
}

.pl--4px {
    padding-left: 4px;
}

.pl--5px {
    padding-left: 5px;
}

.pl--6px {
    padding-left: 6px;
}

.pl--7px {
    padding-left: 7px;
}

.pl--8px {
    padding-left: 8px;
}

.pl--9px {
    padding-left: 9px;
}

.pl--10px {
    padding-left: 10px;
}

.pl--20px {
    padding-left: 20px;
}

.pl--30px {
    padding-left: 30px;
}

.pl--40px {
    padding-left: 40px;
}

.pl--50px {
    padding-left: 50px;
}

.pl--60px {
    padding-left: 60px;
}

.pl--70px {
    padding-left: 70px;
}

.pl--80px {
    padding-left: 80px;
}

.pl--90px {
    padding-left: 90px;
}

.pl--100px {
    padding-left: 100px;
}

.pl--150px {
    padding-left: 150px;
}

.pl--200px {
    padding-left: 200px;
}

.pl--250px {
    padding-left: 250px;
}

.pl--300px {
    padding-left: 300px;
}

/* padding-top-bottom
------------------------------------------------------------------- */

.ptb--0 {
    padding-top: 0;
    padding-bottom: 0;
}

/* em */

.ptb--d25e {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
}

.ptb--d50e {
    padding-top: 0.50em;
    padding-bottom: 0.50em;
}

.ptb--d75e {
    padding-top: 0.75em;
    padding-bottom: 0.75em;
    padding: 1rem 1rem;
}

.ptb--1e {
    padding-top: 1em;
    padding-bottom: 1em;
}

.ptb--2e {
    padding-top: 2em;
    padding-bottom: 2em;
}

.ptb--3e {
    padding-top: 3em;
    padding-bottom: 3em;
}

.ptb--4e {
    padding-top: 4em;
    padding-bottom: 4em;
}

.ptb--5e {
    padding-top: 5em;
    padding-bottom: 5em;
}

.ptb--6e {
    padding-top: 6em;
    padding-bottom: 6em;
}

.ptb--7e {
    padding-top: 7em;
    padding-bottom: 7em;
}

.ptb--8e {
    padding-top: 8em;
    padding-bottom: 8em;
}

.ptb--9e {
    padding-top: 9em;
    padding-bottom: 9em;
}

.ptb--10e {
    padding-top: 10em;
    padding-bottom: 10em;
}

/* rem */

.ptb--d25r {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.ptb--d50r {
    padding-top: 0.50rem;
    padding-bottom: 0.50rem;
}

.ptb--d75r {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.ptb--1r {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.ptb--2r {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.ptb--3r {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.ptb--4r {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.ptb--5r {
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.ptb--6r {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.ptb--7r {
    padding-top: 7rem;
    padding-bottom: 7rem;
}

.ptb--8r {
    padding-top: 8rem;
    padding-bottom: 8rem;
}

.ptb--9r {
    padding-top: 9rem;
    padding-bottom: 9rem;
}

.ptb--10r {
    padding-top: 10rem;
    padding-bottom: 10rem;
}

/* % */

.ptb--25p {
    padding-top: 25%;
    padding-bottom: 25%;
}

.ptb--50p {
    padding-top: 50%;
    padding-bottom: 50%;
}

.ptb--75p {
    padding-top: 75%;
    padding-bottom: 75%;
}

.ptb--10p {
    padding-top: 10%;
    padding-bottom: 10%;
}

.ptb--20p {
    padding-top: 20%;
    padding-bottom: 20%;
}

.ptb--30p {
    padding-top: 30%;
    padding-bottom: 30%;
}

.ptb--40p {
    padding-top: 40%;
    padding-bottom: 40%;
}

.ptb--60p {
    padding-top: 60%;
    padding-bottom: 60%;
}

.ptb--70p {
    padding-top: 70%;
    padding-bottom: 70%;
}

.ptb--80p {
    padding-top: 80%;
    padding-bottom: 80%;
}

.ptb--90p {
    padding-top: 90%;
    padding-bottom: 90%;
}

.ptb--100p {
    padding-top: 100%;
    padding-bottom: 100%;
}

/* vw */

.ptb--25vw {
    padding-top: 25vw;
    padding-bottom: 25vw;
}

.ptb--50vw {
    padding-top: 50vw;
    padding-bottom: 50vw;
}

.ptb--75vw {
    padding-top: 75vw;
    padding-bottom: 75vw;
}

.ptb--10vw {
    padding-top: 10vw;
    padding-bottom: 10vw;
}

.ptb--20vw {
    padding-top: 20vw;
    padding-bottom: 20vw;
}

.ptb--30vw {
    padding-top: 30vw;
    padding-bottom: 30vw;
}

.ptb--40vw {
    padding-top: 40vw;
    padding-bottom: 40vw;
}

.ptb--60vw {
    padding-top: 60vw;
    padding-bottom: 60vw;
}

.ptb--70vw {
    padding-top: 70vw;
    padding-bottom: 70vw;
    m:1r1r  ;
}

.ptb--80vw {
    padding-top: 80vw;
    padding-bottom: 80vw;
}

.ptb--90vw {
    padding-top: 90vw;
    padding-bottom: 90vw;
}

.ptb--100vw {
    padding-top: 100vw;
    padding-bottom: 100vw;
}

/* vh */

.ptb--25vh {
    padding-top: 25vh;
    padding-bottom: 25vh;
}

.ptb--50vh {
    padding-top: 50vh;
    padding-bottom: 50vh;
}

.ptb--75vh {
    padding-top: 75vh;
    padding-bottom: 75vh;
}

.ptb--10vh {
    padding-top: 10vh;
    padding-bottom: 10vh;
}

.ptb--20vh {
    padding-top: 20vh;
    padding-bottom: 20vh;
}

.ptb--30vh {
    padding-top: 30vh;
    padding-bottom: 30vh;
}

.ptb--40vh {
    padding-top: 40vh;
    padding-bottom: 40vh;
}

.ptb--60vh {
    padding-top: 60vh;
    padding-bottom: 60vh;
}

.ptb--70vh {
    padding-top: 70vh;
    padding-bottom: 70vh;
}

.ptb--80vh {
    padding-top: 80vh;
    padding-bottom: 80vh;
}

.ptb--90vh {
    padding-top: 90vh;
    padding-t: 90vh;
}

.ptb--100vh {
    padding-top: 100vh;
    padding-bottom: 100vh;
}

/* px */

.ptb--1px {
    padding-top: 1px;
    padding-bottom: 1px;
}

.ptb--2px {
    padding-top: 2px;
    padding-bottom: 2px;
}

.ptb--3px {
    padding-top: 3px;
    padding-bottom: 3px;
}

.ptb--4px {
    padding-top: 4px;
    padding-bottom: 4px;
}

.ptb--5px {
    padding-top: 5px;
    padding-bottom: 5px;
}

.ptb--6px {
    padding-top: 6px;
    padding-bottom: 6px;
}

.ptb--7px {
    padding-top: 7px;
    padding-bottom: 7px;
}

.ptb--8px {
    padding-top: 8px;
    padding-bottom: 8px;
}

.ptb--9px {
    padding-top: 9px;
    padding-bottom: 9px;
}

.ptb--10px {
    padding-top: 10px;
    padding-bottom: 10px;
}

.ptb--20px {
    padding-top: 20px;
    padding-bottom: 20px;
}

.ptb--30px {
    padding-top: 30px;
    padding-bottom: 30px;
}

.ptb--40px {
    padding-top: 40px;
    padding-bottom: 40px;
}

.ptb--50px {
    padding-top: 50px;
    padding-bottom: 50px;
}

.ptb--60px {
    padding-top: 60px;
    padding-bottom: 60px;
}

.ptb--70px {
    padding-top: 70px;
    padding-bottom: 70px;
}

.ptb--80px {
    padding-top: 80px;
    padding-bottom: 80px;
}

.ptb--90px {
    padding-top: 90px;
    padding-bottom: 90px;
}

.ptb--100px {
    padding-top: 100px;
    padding-bottom: 100px;
}

.ptb--150px {
    padding-top: 150px;
    padding-bottom: 150px;
}

.ptb--200px {
    padding-top: 200px;
    padding-bottom: 200px;
}

.ptb--250px {
    padding-top: 250px;
    padding-bottom: 250px;
}

.ptb--300px {
    padding-top: 300px;
    padding-bottom: 300px;
}

/* padding-right-left
------------------------------------------------------------------- */

.prl--0 {
    padding-right: 0;
    padding-left: 0;
}

/* em */

.prl--d25e {
    padding-right: 0.25em;
    padding-left: 0.25em;
}

.prl--d50e {
    padding-right: 0.50em;
    padding-left: 0.50em;
}

.prl--d75e {
    padding-right: 0.75em;
    padding-left: 0.75em;
    padding: 1rem 1rem;
}

.prl--1e {
    padding-right: 1em;
    padding-left: 1em;
}

.prl--2e {
    padding-right: 2em;
    padding-left: 2em;
}

.prl--3e {
    padding-right: 3em;
    padding-left: 3em;
}

.prl--4e {
    padding-right: 4em;
    padding-left: 4em;
}

.prl--5e {
    padding-right: 5em;
    padding-left: 5em;
}

.prl--6e {
    padding-right: 6em;
    padding-left: 6em;
}

.prl--7e {
    padding-right: 7em;
    padding-left: 7em;
}

.prl--8e {
    padding-right: 8em;
    padding-left: 8em;
}

.prl--9e {
    padding-right: 9em;
    padding-left: 9em;
}

.prl--10e {
    padding-right: 10em;
    padding-left: 10em;
}

/* rem */

.prl--d25r {
    padding-right: 0.25rem;
    padding-left: 0.25rem;
}

.prl--d50r {
    padding-right: 0.50rem;
    padding-left: 0.50rem;
}

.prl--d75r {
    padding-right: 0.75rem;
    padding-left: 0.75rem;
}

.prl--1r {
    padding-right: 1rem;
    padding-left: 1rem;
}

.prl--2r {
    padding-right: 2rem;
    padding-left: 2rem;
}

.prl--3r {
    padding-right: 3rem;
    padding-left: 3rem;
}

.prl--4r {
    padding-right: 4rem;
    padding-left: 4rem;
}

.prl--5r {
    padding-right: 5rem;
    padding-left: 5rem;
}

.prl--6r {
    padding-right: 6rem;
    padding-left: 6rem;
}

.prl--7r {
    padding-right: 7rem;
    padding-left: 7rem;
}

.prl--8r {
    padding-right: 8rem;
    padding-left: 8rem;
}

.prl--9r {
    padding-right: 9rem;
    padding-left: 9rem;
}

.prl--10r {
    padding-right: 10rem;
    padding-left: 10rem;
}

/* % */

.prl--25p {
    padding-right: 25%;
    padding-left: 25%;
}

.prl--50p {
    padding-right: 50%;
    padding-left: 50%;
}

.prl--75p {
    padding-right: 75%;
    padding-left: 75%;
}

.prl--10p {
    padding-right: 10%;
    padding-left: 10%;
}

.prl--20p {
    padding-right: 20%;
    padding-left: 20%;
}

.prl--30p {
    padding-right: 30%;
    padding-left: 30%;
}

.prl--40p {
    padding-right: 40%;
    padding-left: 40%;
}

.prl--60p {
    padding-right: 60%;
    padding-left: 60%;
}

.prl--70p {
    padding-right: 70%;
    padding-left: 70%;
}

.prl--80p {
    padding-right: 80%;
    padding-left: 80%;
}

.prl--90p {
    padding-right: 90%;
    padding-left: 90%;
}

.prl--100p {
    padding-right: 100%;
    padding-left: 100%;
}

/* vw */

.prl--25vw {
    padding-right: 25vw;
    padding-left: 25vw;
}

.prl--50vw {
    padding-right: 50vw;
    padding-left: 50vw;
}

.prl--75vw {
    padding-right: 75vw;
    padding-left: 75vw;
}

.prl--10vw {
    padding-right: 10vw;
    padding-left: 10vw;
}

.prl--20vw {
    padding-right: 20vw;
    padding-left: 20vw;
}

.prl--30vw {
    padding-right: 30vw;
    padding-left: 30vw;
}

.prl--40vw {
    padding-right: 40vw;
    padding-left: 40vw;
}

.prl--60vw {
    padding-right: 60vw;
    padding-left: 60vw;
}

.prl--70vw {
    padding-right: 70vw;
    padding-left: 70vw;
    m:1r1r  ;
}

.prl--80vw {
    padding-right: 80vw;
    padding-left: 80vw;
}

.prl--90vw {
    padding-right: 90vw;
    padding-left: 90vw;
}

.prl--100vw {
    padding-right: 100vw;
    padding-left: 100vw;
}

/* vh */

.prl--25vh {
    padding-right: 25vh;
    padding-left: 25vh;
}

.prl--50vh {
    padding-right: 50vh;
    padding-left: 50vh;
}

.prl--75vh {
    padding-right: 75vh;
    padding-left: 75vh;
}

.prl--10vh {
    padding-right: 10vh;
    padding-left: 10vh;
}

.prl--20vh {
    padding-right: 20vh;
    padding-left: 20vh;
}

.prl--30vh {
    padding-right: 30vh;
    padding-left: 30vh;
}

.prl--40vh {
    padding-right: 40vh;
    padding-left: 40vh;
}

.prl--60vh {
    padding-right: 60vh;
    padding-left: 60vh;
}

.prl--70vh {
    padding-right: 70vh;
    padding-left: 70vh;
}

.prl--80vh {
    padding-right: 80vh;
    padding-left: 80vh;
}

.prl--90vh {
    padding-right: 90vh;
    padding-t: 90vh;
}

.prl--100vh {
    padding-right: 100vh;
    padding-left: 100vh;
}

/* px */

.prl--1px {
    padding-right: 1px;
    padding-left: 1px;
}

.prl--2px {
    padding-right: 2px;
    padding-left: 2px;
}

.prl--3px {
    padding-right: 3px;
    padding-left: 3px;
}

.prl--4px {
    padding-right: 4px;
    padding-left: 4px;
}

.prl--5px {
    padding-right: 5px;
    padding-left: 5px;
}

.prl--6px {
    padding-right: 6px;
    padding-left: 6px;
}

.prl--7px {
    padding-right: 7px;
    padding-left: 7px;
}

.prl--8px {
    padding-right: 8px;
    padding-left: 8px;
}

.prl--9px {
    padding-right: 9px;
    padding-left: 9px;
}

.prl--10px {
    padding-right: 10px;
    padding-left: 10px;
}

.prl--20px {
    padding-right: 20px;
    padding-left: 20px;
}

.prl--30px {
    padding-right: 30px;
    padding-left: 30px;
}

.prl--40px {
    padding-right: 40px;
    padding-left: 40px;
}

.prl--50px {
    padding-right: 50px;
    padding-left: 50px;
}

.prl--60px {
    padding-right: 60px;
    padding-left: 60px;
}

.prl--70px {
    padding-right: 70px;
    padding-left: 70px;
}

.prl--80px {
    padding-right: 80px;
    padding-left: 80px;
}

.prl--90px {
    padding-right: 90px;
    padding-left: 90px;
}

.prl--100px {
    padding-right: 100px;
    padding-left: 100px;
}

.prl--150px {
    padding-right: 150px;
    padding-left: 150px;
}

.prl--200px {
    padding-right: 200px;
    padding-left: 200px;
}

.prl--250px {
    padding-right: 250px;
    padding-left: 250px;
}

.prl--300px {
    padding-right: 300px;
    padding-left: 300px;
}

/*ƒ ––––––––––––––––––––––––––––––––––––––––––––––––––––––– padding */


/* top, right, bottom, left
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* top
------------------------------------------------------------------- */

.t--a,
.t--auto {
    top: auto;
}

.t--0 {
    top: 0;
}

/* em */

.t--d25e {
    top: 0.25em;
}

.t--d50e {
    top: 0.50em;
}

.t--d75e {
    top: 0.75em;
}

.t--1e {
    top: 1em;
}

.t--2e {
    top: 2em;
}

.t--3e {
    top: 3em;
}

.t--4e {
    top: 4em;
}

.t--5e {
    top: 5em;
}

.t--6e {
    top: 6em;
}

.t--7e {
    top: 7em;
}

.t--8e {
    top: 8em;
}

.t--9e {
    top: 9em;
}

.t--10e {
    top: 10em;
}

/* rem */

.t--d25r {
    top: 0.25rem;
}

.t--d50r {
    top: 0.50rem;
}

.t--d75r {
    top: 0.75rem;
}

.t--1r {
    top: 1rem;
}

.t--2r {
    top: 2rem;
}

.t--3r {
    top: 3rem;
}

.t--4r {
    top: 4rem;
}

.t--5r {
    top: 5rem;
}

.t--6r {
    top: 6rem;
}

.t--7r {
    top: 7rem;
}

.t--8r {
    top: 8rem;
}

.t--9r {
    top: 9rem;
}

.t--10r {
    top: 10rem;
}

/* % */

.t--25p {
    top: 25%;
}

.t--50p {
    top: 50%;
}

.t--75p {
    top: 75%;
}

.t--10p {
    top: 10%;
}

.t--20p {
    top: 20%;
}

.t--30p {
    top: 30%;
}

.t--40p {
    top: 40%;
}

.t--60p {
    top: 60%;
}

.t--70p {
    top: 70%;
}

.t--80p {
    top: 80%;
}

.t--90p {
    top: 90%;
}

.t--100p {
    top: 100%;
}

/* vw */

.t--25vw {
    top: 25vw;
}

.t--50vw {
    top: 50vw;
}

.t--75vw {
    top: 75vw;
}

.t--10vw {
    top: 10vw;
}

.t--20vw {
    top: 20vw;
}

.t--30vw {
    top: 30vw;
}

.t--40vw {
    top: 40vw;
}

.t--60vw {
    top: 60vw;
}

.t--70vw {
    top: 70vw;
}

.t--80vw {
    top: 80vw;
}

.t--90vw {
    top: 90vw;
}

.t--100vw {
    top: 100vw;
}

/* vh */

.t--25vh {
    top: 25vh;
}

.t--50vh {
    top: 50vh;
}

.t--75vh {
    top: 75vh;
}

.t--10vh {
    top: 10vh;
}

.t--20vh {
    top: 20vh;
}

.t--30vh {
    top: 30vh;
}

.t--40vh {
    top: 40vh;
}

.t--60vh {
    top: 60vh;
}

.t--70vh {
    top: 70vh;
}

.t--80vh {
    top: 80vh;
}

.t--90vh {
    top: 90vh;
}

.t--100vh {
    top: 100vh;
}

/* px */

.t--1px {
    top: 1px;
}

.t--2px {
    top: 2px;
}

.t--3px {
    top: 3px;
}

.t--4px {
    top: 4px;
}

.t--5px {
    top: 5px;
}

.t--6px {
    top: 6px;
}

.t--7px {
    top: 7px;
}

.t--8px {
    top: 8px;
}

.t--9px {
    top: 9px;
}

.t--10px {
    top: 10px;
}

.t--20px {
    top: 20px;
}

.t--30px {
    top: 30px;
}

.t--40px {
    top: 40px;
}

.t--50px {
    top: 50px;
}

.t--60px {
    top: 60px;
}

.t--70px {
    top: 70px;
}

.t--80px {
    top: 80px;
}

.t--90px {
    top: 90px;
}

.t--100px {
    top: 100px;
}

.t--150px {
    top: 150px;
}

.t--200px {
    top: 200px;
}

.t--250px {
    top: 250px;
}

.t--300px {
    top: 300px;
}

/* right
------------------------------------------------------------------- */

.r--a,
.r--auto {
    right: auto;
}

.r--0 {
    right: 0;
}

/* em */

.r--d25e {
    right: 0.25em;
}

.r--d50e {
    right: 0.50em;
}

.r--d75e {
    right: 0.75em;
}

.r--1e {
    right: 1em;
}

.r--2e {
    right: 2em;
}

.r--3e {
    right: 3em;
}

.r--4e {
    right: 4em;
}

.r--5e {
    right: 5em;
}

.r--6e {
    right: 6em;
}

.r--7e {
    right: 7em;
}

.r--8e {
    right: 8em;
}

.r--9e {
    right: 9em;
}

.r--10e {
    right: 10em;
}

/* rem */

.r--d25r {
    right: 0.25rem;
}

.r--d50r {
    right: 0.50rem;
}

.r--d75r {
    right: 0.75rem;
}

.r--1r {
    right: 1rem;
}

.r--2r {
    right: 2rem;
}

.r--3r {
    right: 3rem;
}

.r--4r {
    right: 4rem;
}

.r--5r {
    right: 5rem;
}

.r--6r {
    right: 6rem;
}

.r--7r {
    right: 7rem;
}

.r--8r {
    right: 8rem;
}

.r--9r {
    right: 9rem;
}

.r--10r {
    right: 10rem;
}

/* % */

.r--25p {
    right: 25%;
}

.r--50p {
    right: 50%;
}

.r--75p {
    right: 75%;
}

.r--10p {
    right: 10%;
}

.r--20p {
    right: 20%;
}

.r--30p {
    right: 30%;
}

.r--40p {
    right: 40%;
}

.r--60p {
    right: 60%;
}

.r--70p {
    right: 70%;
}

.r--80p {
    right: 80%;
}

.r--90p {
    right: 90%;
}

.r--100p {
    right: 100%;
}

/* vw */

.r--25vw {
    right: 25vw;
}

.r--50vw {
    right: 50vw;
}

.r--75vw {
    right: 75vw;
}

.r--10vw {
    right: 10vw;
}

.r--20vw {
    right: 20vw;
}

.r--30vw {
    right: 30vw;
}

.r--40vw {
    right: 40vw;
}

.r--60vw {
    right: 60vw;
}

.r--70vw {
    right: 70vw;
}

.r--80vw {
    right: 80vw;
}

.r--90vw {
    right: 90vw;
}

.r--100vw {
    right: 100vw;
}

/* vh */

.r--25vh {
    right: 25vh;
}

.r--50vh {
    right: 50vh;
}

.r--75vh {
    right: 75vh;
}

.r--10vh {
    right: 10vh;
}

.r--20vh {
    right: 20vh;
}

.r--30vh {
    right: 30vh;
}

.r--40vh {
    right: 40vh;
}

.r--60vh {
    right: 60vh;
}

.r--70vh {
    right: 70vh;
}

.r--80vh {
    right: 80vh;
}

.r--90vh {
    right: 90vh;
}

.r--100vh {
    right: 100vh;
}

/* px */

.r--1px {
    right: 1px;
}

.r--2px {
    right: 2px;
}

.r--3px {
    right: 3px;
}

.r--4px {
    right: 4px;
}

.r--5px {
    right: 5px;
}

.r--6px {
    right: 6px;
}

.r--7px {
    right: 7px;
}

.r--8px {
    right: 8px;
}

.r--9px {
    right: 9px;
}

.r--10px {
    right: 10px;
}

.r--20px {
    right: 20px;
}

.r--30px {
    right: 30px;
}

.r--40px {
    right: 40px;
}

.r--50px {
    right: 50px;
}

.r--60px {
    right: 60px;
}

.r--70px {
    right: 70px;
}

.r--80px {
    right: 80px;
}

.r--90px {
    right: 90px;
}

.r--100px {
    right: 100px;
}

.r--150px {
    right: 150px;
}

.r--200px {
    right: 200px;
}

.r--250px {
    right: 250px;
}

.r--300px {
    right: 300px;
}

/* bottom
------------------------------------------------------------------- */

.b--a,
.b--auto {
    bottom: auto;
}

.b--0 {
    bottom: 0;
}

/* em */

.b--d25e {
    bottom: 0.25em;
}

.b--d50e {
    bottom: 0.50em;
}

.b--d75e {
    bottom: 0.75em;
}

.b--1e {
    bottom: 1em;
}

.b--2e {
    bottom: 2em;
}

.b--3e {
    bottom: 3em;
}

.b--4e {
    bottom: 4em;
}

.b--5e {
    bottom: 5em;
}

.b--6e {
    bottom: 6em;
}

.b--7e {
    bottom: 7em;
}

.b--8e {
    bottom: 8em;
}

.b--9e {
    bottom: 9em;
}

.b--10e {
    bottom: 10em;
}

/* rem */

.b--d25r {
    bottom: 0.25rem;
}

.b--d50r {
    bottom: 0.50rem;
}

.b--d75r {
    bottom: 0.75rem;
}

.b--1r {
    bottom: 1rem;
}

.b--2r {
    bottom: 2rem;
}

.b--3r {
    bottom: 3rem;
}

.b--4r {
    bottom: 4rem;
}

.b--5r {
    bottom: 5rem;
}

.b--6r {
    bottom: 6rem;
}

.b--7r {
    bottom: 7rem;
}

.b--8r {
    bottom: 8rem;
}

.b--9r {
    bottom: 9rem;
}

.b--10r {
    bottom: 10rem;
}

/* % */

.b--25p {
    bottom: 25%;
}

.b--50p {
    bottom: 50%;
}

.b--75p {
    bottom: 75%;
}

.b--10p {
    bottom: 10%;
}

.b--20p {
    bottom: 20%;
}

.b--30p {
    bottom: 30%;
}

.b--40p {
    bottom: 40%;
}

.b--60p {
    bottom: 60%;
}

.b--70p {
    bottom: 70%;
}

.b--80p {
    bottom: 80%;
}

.b--90p {
    bottom: 90%;
}

.b--100p {
    bottom: 100%;
}

/* vw */

.b--25vw {
    bottom: 25vw;
}

.b--50vw {
    bottom: 50vw;
}

.b--75vw {
    bottom: 75vw;
}

.b--10vw {
    bottom: 10vw;
}

.b--20vw {
    bottom: 20vw;
}

.b--30vw {
    bottom: 30vw;
}

.b--40vw {
    bottom: 40vw;
}

.b--60vw {
    bottom: 60vw;
}

.b--70vw {
    bottom: 70vw;
}

.b--80vw {
    bottom: 80vw;
}

.b--90vw {
    bottom: 90vw;
}

.b--100vw {
    bottom: 100vw;
}

/* vh */

.b--25vh {
    bottom: 25vh;
}

.b--50vh {
    bottom: 50vh;
}

.b--75vh {
    bottom: 75vh;
}

.b--10vh {
    bottom: 10vh;
}

.b--20vh {
    bottom: 20vh;
}

.b--30vh {
    bottom: 30vh;
}

.b--40vh {
    bottom: 40vh;
}

.b--60vh {
    bottom: 60vh;
}

.b--70vh {
    bottom: 70vh;
}

.b--80vh {
    bottom: 80vh;
}

.b--90vh {
    bottom: 90vh;
}

.b--100vh {
    bottom: 100vh;
}

/* px */

.b--1px {
    bottom: 1px;
}

.b--2px {
    bottom: 2px;
}

.b--3px {
    bottom: 3px;
}

.b--4px {
    bottom: 4px;
}

.b--5px {
    bottom: 5px;
}

.b--6px {
    bottom: 6px;
}

.b--7px {
    bottom: 7px;
}

.b--8px {
    bottom: 8px;
}

.b--9px {
    bottom: 9px;
}

.b--10px {
    bottom: 10px;
}

.b--20px {
    bottom: 20px;
}

.b--30px {
    bottom: 30px;
}

.b--40px {
    bottom: 40px;
}

.b--50px {
    bottom: 50px;
}

.b--60px {
    bottom: 60px;
}

.b--70px {
    bottom: 70px;
}

.b--80px {
    bottom: 80px;
}

.b--90px {
    bottom: 90px;
}

.b--100px {
    bottom: 100px;
}

.b--150px {
    bottom: 150px;
}

.b--200px {
    bottom: 200px;
}

.b--250px {
    bottom: 250px;
}

.b--300px {
    bottom: 300px;
}

/* left
------------------------------------------------------------------- */

.l--a,
.l--auto {
    left: auto;
}

.l--0 {
    left: 0;
}

/* em */

.l--d25e {
    left: 0.25em;
}

.l--d50e {
    left: 0.50em;
}

.l--d75e {
    left: 0.75em;
}

.l--1e {
    left: 1em;
}

.l--2e {
    left: 2em;
}

.l--3e {
    left: 3em;
}

.l--4e {
    left: 4em;
}

.l--5e {
    left: 5em;
}

.l--6e {
    left: 6em;
}

.l--7e {
    left: 7em;
}

.l--8e {
    left: 8em;
}

.l--9e {
    left: 9em;
}

.l--10e {
    left: 10em;
}

/* rem */

.l--d25r {
    left: 0.25rem;
}

.l--d50r {
    left: 0.50rem;
}

.l--d75r {
    left: 0.75rem;
}

.l--1r {
    left: 1rem;
}

.l--2r {
    left: 2rem;
}

.l--3r {
    left: 3rem;
}

.l--4r {
    left: 4rem;
}

.l--5r {
    left: 5rem;
}

.l--6r {
    left: 6rem;
}

.l--7r {
    left: 7rem;
}

.l--8r {
    left: 8rem;
}

.l--9r {
    left: 9rem;
}

.l--10r {
    left: 10rem;
}

/* % */

.l--25p {
    left: 25%;
}

.l--50p {
    left: 50%;
}

.l--75p {
    left: 75%;
}

.l--10p {
    left: 10%;
}

.l--20p {
    left: 20%;
}

.l--30p {
    left: 30%;
}

.l--40p {
    left: 40%;
}

.l--60p {
    left: 60%;
}

.l--70p {
    left: 70%;
}

.l--80p {
    left: 80%;
}

.l--90p {
    left: 90%;
}

.l--100p {
    left: 100%;
}

/* vw */

.l--25vw {
    left: 25vw;
}

.l--50vw {
    left: 50vw;
}

.l--75vw {
    left: 75vw;
}

.l--10vw {
    left: 10vw;
}

.l--20vw {
    left: 20vw;
}

.l--30vw {
    left: 30vw;
}

.l--40vw {
    left: 40vw;
}

.l--60vw {
    left: 60vw;
}

.l--70vw {
    left: 70vw;
}

.l--80vw {
    left: 80vw;
}

.l--90vw {
    left: 90vw;
}

.l--100vw {
    left: 100vw;
}

/* vh */

.l--25vh {
    left: 25vh;
}

.l--50vh {
    left: 50vh;
}

.l--75vh {
    left: 75vh;
}

.l--10vh {
    left: 10vh;
}

.l--20vh {
    left: 20vh;
}

.l--30vh {
    left: 30vh;
}

.l--40vh {
    left: 40vh;
}

.l--60vh {
    left: 60vh;
}

.l--70vh {
    left: 70vh;
}

.l--80vh {
    left: 80vh;
}

.l--90vh {
    left: 90vh;
}

.l--100vh {
    left: 100vh;
}

/* px */

.l--1px {
    left: 1px;
}

.l--2px {
    left: 2px;
}

.l--3px {
    left: 3px;
}

.l--4px {
    left: 4px;
}

.l--5px {
    left: 5px;
}

.l--6px {
    left: 6px;
}

.l--7px {
    left: 7px;
}

.l--8px {
    left: 8px;
}

.l--9px {
    left: 9px;
}

.l--10px {
    left: 10px;
}

.l--20px {
    left: 20px;
}

.l--30px {
    left: 30px;
}

.l--40px {
    left: 40px;
}

.l--50px {
    left: 50px;
}

.l--60px {
    left: 60px;
}

.l--70px {
    left: 70px;
}

.l--80px {
    left: 80px;
}

.l--90px {
    left: 90px;
}

.l--100px {
    left: 100px;
}

.l--150px {
    left: 150px;
}

.l--200px {
    left: 200px;
}

.l--250px {
    left: 250px;
}

.l--300px {
    left: 300px;
}

/*ƒ –––––––––––––––––––––––––––––––––––––– top, right, bottom, left */

/* top, right, bottom, left
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* width, height
------------------------------------------------------------------- */

.w--a,
.w--auto {
    width: auto;
}

.w--0 {
    width: 0;
}

/* em */

.w--d25e {
    width: 0.25em;
}

.w--d50e {
    width: 0.50em;
}

.w--d75e {
    width: 0.75em;
}

.w--1e {
    width: 1em;
}

.w--2e {
    width: 2em;
}

.w--3e {
    width: 3em;
}

.w--4e {
    width: 4em;
}

.w--5e {
    width: 5em;
}

.w--6e {
    width: 6em;
}

.w--7e {
    width: 7em;
}

.w--8e {
    width: 8em;
}

.w--9e {
    width: 9em;
}

.w--10e {
    width: 10em;
}

/* rem */

.w--d25r {
    width: 0.25rem;
}

.w--d50r {
    width: 0.50rem;
}

.w--d75r {
    width: 0.75rem;
}

.w--1r {
    width: 1rem;
}

.w--2r {
    width: 2rem;
}

.w--3r {
    width: 3rem;
}

.w--4r {
    width: 4rem;
}

.w--5r {
    width: 5rem;
}

.w--6r {
    width: 6rem;
}

.w--7r {
    width: 7rem;
}

.w--8r {
    width: 8rem;
}

.w--9r {
    width: 9rem;
}

.w--10r {
    width: 10rem;
}

/* % */

.w--25p {
    width: 25%;
}

.w--50p {
    width: 50%;
}

.w--75p {
    width: 75%;
}

.w--10p {
    width: 10%;
}

.w--20p {
    width: 20%;
}

.w--30p {
    width: 30%;
}

.w--40p {
    width: 40%;
}

.w--60p {
    width: 60%;
}

.w--70p {
    width: 70%;
}

.w--80p {
    width: 80%;
}

.w--90p {
    width: 90%;
}

.w--100p {
    width: 100%;
}

/* vw */

.w--25vw {
    width: 25vw;
}

.w--50vw {
    width: 50vw;
}

.w--75vw {
    width: 75vw;
}

.w--10vw {
    width: 10vw;
}

.w--20vw {
    width: 20vw;
}

.w--30vw {
    width: 30vw;
}

.w--40vw {
    width: 40vw;
}

.w--60vw {
    width: 60vw;
}

.w--70vw {
    width: 70vw;
}

.w--80vw {
    width: 80vw;
}

.w--90vw {
    width: 90vw;
}

.w--100vw {
    width: 100vw;
}

/* vh */

.w--25vh {
    width: 25vh;
}

.w--50vh {
    width: 50vh;
}

.w--75vh {
    width: 75vh;
}

.w--10vh {
    width: 10vh;
}

.w--20vh {
    width: 20vh;
}

.w--30vh {
    width: 30vh;
}

.w--40vh {
    width: 40vh;
}

.w--60vh {
    width: 60vh;
}

.w--70vh {
    width: 70vh;
}

.w--80vh {
    width: 80vh;
}

.w--90vh {
    width: 90vh;
}

.w--100vh {
    width: 100vh;
}

/* px */

.w--1px {
    width: 1px;
}

.w--2px {
    width: 2px;
}

.w--3px {
    width: 3px;
}

.w--4px {
    width: 4px;
}

.w--5px {
    width: 5px;
}

.w--6px {
    width: 6px;
}

.w--7px {
    width: 7px;
}

.w--8px {
    width: 8px;
}

.w--9px {
    width: 9px;
}

.w--10px {
    width: 10px;
}

.w--20px {
    width: 20px;
}

.w--30px {
    width: 30px;
}

.w--40px {
    width: 40px;
}

.w--50px {
    width: 50px;
}

.w--60px {
    width: 60px;
}

.w--70px {
    width: 70px;
}

.w--80px {
    width: 80px;
}

.w--90px {
    width: 90px;
}

.w--100px {
    width: 100px;
}

.w--150px {
    width: 150px;
}

.w--200px {
    width: 200px;
}

.w--250px {
    width: 250px;
}

.w--300px {
    width: 300px;
}

/* height
------------------------------------------------------------------- */

.h--a,
.h--auto {
    height: auto;
}

.h--0 {
    height: 0;
}

/* em */

.h--d25e {
    height: 0.25em;
}

.h--d50e {
    height: 0.50em;
}

.h--d75e {
    height: 0.75em;
}

.h--1e {
    height: 1em;
}

.h--2e {
    height: 2em;
}

.h--3e {
    height: 3em;
}

.h--4e {
    height: 4em;
}

.h--5e {
    height: 5em;
}

.h--6e {
    height: 6em;
}

.h--7e {
    height: 7em;
}

.h--8e {
    height: 8em;
}

.h--9e {
    height: 9em;
}

.h--10e {
    height: 10em;
}

/* rem */

.h--d25r {
    height: 0.25rem;
}

.h--d50r {
    height: 0.50rem;
}

.h--d75r {
    height: 0.75rem;
}

.h--1r {
    height: 1rem;
}

.h--2r {
    height: 2rem;
}

.h--3r {
    height: 3rem;
}

.h--4r {
    height: 4rem;
}

.h--5r {
    height: 5rem;
}

.h--6r {
    height: 6rem;
}

.h--7r {
    height: 7rem;
}

.h--8r {
    height: 8rem;
}

.h--9r {
    height: 9rem;
}

.h--10r {
    height: 10rem;
}

/* % */

.h--25p {
    height: 25%;
}

.h--50p {
    height: 50%;
}

.h--75p {
    height: 75%;
}

.h--10p {
    height: 10%;
}

.h--20p {
    height: 20%;
}

.h--30p {
    height: 30%;
}

.h--40p {
    height: 40%;
}

.h--60p {
    height: 60%;
}

.h--70p {
    height: 70%;
}

.h--80p {
    height: 80%;
}

.h--90p {
    height: 90%;
}

.h--100p {
    height: 100%;
}

/* vw */

.h--25vw {
    height: 25vw;
}

.h--50vw {
    height: 50vw;
}

.h--75vw {
    height: 75vw;
}

.h--10vw {
    height: 10vw;
}

.h--20vw {
    height: 20vw;
}

.h--30vw {
    height: 30vw;
}

.h--40vw {
    height: 40vw;
}

.h--60vw {
    height: 60vw;
}

.h--70vw {
    height: 70vw;
}

.h--80vw {
    height: 80vw;
}

.h--90vw {
    height: 90vw;
}

.h--100vw {
    height: 100vw;
}

/* vh */

.h--25vh {
    height: 25vh;
}

.h--50vh {
    height: 50vh;
}

.h--75vh {
    height: 75vh;
}

.h--10vh {
    height: 10vh;
}

.h--20vh {
    height: 20vh;
}

.h--30vh {
    height: 30vh;
}

.h--40vh {
    height: 40vh;
}

.h--60vh {
    height: 60vh;
}

.h--70vh {
    height: 70vh;
}

.h--80vh {
    height: 80vh;
}

.h--90vh {
    height: 90vh;
}

.h--100vh {
    height: 100vh;
}

/* px */

.h--1px {
    height: 1px;
}

.h--2px {
    height: 2px;
}

.h--3px {
    height: 3px;
}

.h--4px {
    height: 4px;
}

.h--5px {
    height: 5px;
}

.h--6px {
    height: 6px;
}

.h--7px {
    height: 7px;
}

.h--8px {
    height: 8px;
}

.h--9px {
    height: 9px;
}

.h--10px {
    height: 10px;
}

.h--20px {
    height: 20px;
}

.h--30px {
    height: 30px;
}

.h--40px {
    height: 40px;
}

.h--50px {
    height: 50px;
}

.h--60px {
    height: 60px;
}

.h--70px {
    height: 70px;
}

.h--80px {
    height: 80px;
}

.h--90px {
    height: 90px;
}

.h--100px {
    height: 100px;
}

.h--150px {
    height: 150px;
}

.h--200px {
    height: 200px;
}

.h--250px {
    height: 250px;
}

.h--300px {
    height: 300px;
}

/*ƒ ––––––––––––––––––––––––––––––––––––––––––––––––– width, height */

/* text-indent
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

.ti--0 {
    text-indent: 0;
}

.ti--n {
    text-indent: -9999px;
}

/* em */

.ti--d25e {
    text-indent: 0.25em;
}

.ti--d50e {
    text-indent: 0.50em;
}

.ti--d75e {
    text-indent: 0.75em;
}

.ti--1e {
    text-indent: 1em;
}

.ti--2e {
    text-indent: 2em;
}

.ti--3e {
    text-indent: 3em;
}

.ti--4e {
    text-indent: 4em;
}

.ti--5e {
    text-indent: 5em;
}

.ti--6e {
    text-indent: 6em;
}

.ti--7e {
    text-indent: 7em;
}

.ti--8e {
    text-indent: 8em;
}

.ti--9e {
    text-indent: 9em;
}

.ti--10e {
    text-indent: 10em;
}

.ti--nd25e {
    text-indent: -0.25em;
}

.ti--nd50e {
    text-indent: -0.50em;
}

.ti--nd75e {
    text-indent: -0.75em;
}

.ti--n1e {
    text-indent: -1em;
}

.ti--n2e {
    text-indent: -2em;
}

.ti--n3e {
    text-indent: -3em;
}

.ti--n4e {
    text-indent: -4em;
}

.ti--n5e {
    text-indent: -5em;
}

.ti--n6e {
    text-indent: -6em;
}

.ti--n7e {
    text-indent: -7em;
}

.ti--n8e {
    text-indent: -8em;
}

.ti--n9e {
    text-indent: -9em;
}

.ti--n10e {
    text-indent: -10em;
}
/*ƒ ––––––––––––––––––––––––––––––––––––––––––––––––––– text-indent */

/* word-spacing
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

.wos--0 {
    word-spacing: 0;
}

.wos--n {
    word-spacing: -9999px;
}

/* em */

.wos--d25e {
    word-spacing: 0.25em;
}

.wos--d50e {
    word-spacing: 0.50em;
}

.wos--d75e {
    word-spacing: 0.75em;
}

.wos--1e {
    word-spacing: 1em;
}

.wos--2e {
    word-spacing: 2em;
}

.wos--3e {
    word-spacing: 3em;
}

.wos--4e {
    word-spacing: 4em;
}

.wos--5e {
    word-spacing: 5em;
}

.wos--6e {
    word-spacing: 6em;
}

.wos--7e {
    word-spacing: 7em;
}

.wos--8e {
    word-spacing: 8em;
}

.wos--9e {
    word-spacing: 9em;
}

.wos--10e {
    word-spacing: 10em;
}

.wos--nd25e {
    word-spacing: -0.25em;
}

.wos--nd50e {
    word-spacing: -0.50em;
}

.wos--nd75e {
    word-spacing: -0.75em;
}

.wos--n1e {
    word-spacing: -1em;
}

.wos--n2e {
    word-spacing: -2em;
}

.wos--n3e {
    word-spacing: -3em;
}

.wos--n4e {
    word-spacing: -4em;
}

.wos--n5e {
    word-spacing: -5em;
}

.wos--n6e {
    word-spacing: -6em;
}

.wos--n7e {
    word-spacing: -7em;
}

.wos--n8e {
    word-spacing: -8em;
}

.wos--n9e {
    word-spacing: -9em;
}

.wos--n10e {
    word-spacing: -10em;
}
/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––– word-spacing */

/* oppacity
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

.op--0 {
    opacity: 0;
}

.op--d1 {
    opacity: 0.1;
}

.op-d2 {
    opacity: 0.2;
}

.op--d3 {
    opacity: 0.3;
}

.op--d4 {
    opacity: 0.4;
}

.op--d5 {
    opacity: 0.5;
}

.op--d6 {
    opacity: 0.6;
}

.op--d7 {
    opacity: 0.7;
}

.op--d8 {
    opacity: 0.8;
}

.op--d9 {
    opacity: 0.9;
}

.op--1 {
    opacity: 1;
}

/*ƒ –––––––––––––––––––––––––––––––––––––––––––––––––––––– oppacity */

/* border-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* px */

.bdw--1px {
    border-width: 1px;
}

.bdw--2px {
    border-width: 2px;
}

.bdw--3px {
    border-width: 3px;
}

.bdw--4px {
    border-width: 4px;
}

.bdw--5px {
    border-width: 5px;
}

.bdw--6px {
    border-width: 6px;
}

.bdw--7px {
    border-width: 7px;
}

.bdw--8px {
    border-width: 8px;
}

.bdw--9px {
    border-width: 9px;
}

.bdw--10px {
    border-width: 10px;
}

.bdw--20px {
    border-width: 20px;
}

.bdw--30px {
    border-width: 30px;
}

.bdw--40px {
    border-width: 40px;
}

.bdw--50px {
    border-width: 50px;
}

.bdw--60px {
    border-width: 60px;
}

.bdw--70px {
    border-width: 70px;
}

.bdw--80px {
    border-width: 80px;
}

.bdw--90px {
    border-width: 90px;
}

.bdw--100px {
    border-width: 100px;
}

.bdw--150px {
    border-width: 150px;
}

.bdw--200px {
    border-width: 200px;
}

.bdw--250px {
    border-width: 250px;
}

.bdw--300px {
    border-width: 300px;
}

.bdtw--1px {
    border-top-width: 1px;
}

/* border-top-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* px */

.bdtw--1px {
    border-top-width: 1px;
}

.bdtw--2px {
    border-top-width: 2px;
}

.bdtw--3px {
    border-top-width: 3px;
}

.bdtw--4px {
    border-top-width: 4px;
}

.bdtw--5px {
    border-top-width: 5px;
}

.bdtw--6px {
    border-top-width: 6px;
}

.bdtw--7px {
    border-top-width: 7px;
}

.bdtw--8px {
    border-top-width: 8px;
}

.bdtw--9px {
    border-top-width: 9px;
}

.bdtw--10px {
    border-top-width: 10px;
}

.bdtw--20px {
    border-top-width: 20px;
}

.bdtw--30px {
    border-top-width: 30px;
}

.bdtw--40px {
    border-top-width: 40px;
}

.bdtw--50px {
    border-top-width: 50px;
}

.bdtw--60px {
    border-top-width: 60px;
}

.bdtw--70px {
    border-top-width: 70px;
}

.bdtw--80px {
    border-top-width: 80px;
}

.bdtw--90px {
    border-top-width: 90px;
}

.bdtw--100px {
    border-top-width: 100px;
}

.bdtw--150px {
    border-top-width: 150px;
}

.bdtw--200px {
    border-top-width: 200px;
}

.bdtw--250px {
    border-top-width: 250px;
}

.bdtw--300px {
    border-top-width: 300px;
}

/* border-right-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* px */

.bdrw--1px {
    border-right-width: 1px;
}

.bdrw--2px {
    border-right-width: 2px;
}

.bdrw--3px {
    border-right-width: 3px;
}

.bdrw--4px {
    border-right-width: 4px;
}

.bdrw--5px {
    border-right-width: 5px;
}

.bdrw--6px {
    border-right-width: 6px;
}

.bdrw--7px {
    border-right-width: 7px;
}

.bdrw--8px {
    border-right-width: 8px;
}

.bdrw--9px {
    border-right-width: 9px;
}

.bdrw--10px {
    border-right-width: 10px;
}

.bdrw--20px {
    border-right-width: 20px;
}

.bdrw--30px {
    border-right-width: 30px;
}

.bdrw--40px {
    border-right-width: 40px;
}

.bdrw--50px {
    border-right-width: 50px;
}

.bdrw--60px {
    border-right-width: 60px;
}

.bdrw--70px {
    border-right-width: 70px;
}

.bdrw--80px {
    border-right-width: 80px;
}

.bdrw--90px {
    border-right-width: 90px;
}

.bdrw--100px {
    border-right-width: 100px;
}

.bdrw--150px {
    border-right-width: 150px;
}

.bdrw--200px {
    border-right-width: 200px;
}

.bdrw--250px {
    border-right-width: 250px;
}

.bdrw--300px {
    border-right-width: 300px;
}

/* border-bottom-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* px */

.bdbw--1px {
    border-bottom-width: 1px;
}

.bdbw--2px {
    border-bottom-width: 2px;
}

.bdbw--3px {
    border-bottom-width: 3px;
}

.bdbw--4px {
    border-bottom-width: 4px;
}

.bdbw--5px {
    border-bottom-width: 5px;
}

.bdbw--6px {
    border-bottom-width: 6px;
}

.bdbw--7px {
    border-bottom-width: 7px;
}

.bdbw--8px {
    border-bottom-width: 8px;
}

.bdbw--9px {
    border-bottom-width: 9px;
}

.bdbw--10px {
    border-bottom-width: 10px;
}

.bdbw--20px {
    border-bottom-width: 20px;
}

.bdbw--30px {
    border-bottom-width: 30px;
}

.bdbw--40px {
    border-bottom-width: 40px;
}

.bdbw--50px {
    border-bottom-width: 50px;
}

.bdbw--60px {
    border-bottom-width: 60px;
}

.bdbw--70px {
    border-bottom-width: 70px;
}

.bdbw--80px {
    border-bottom-width: 80px;
}

.bdbw--90px {
    border-bottom-width: 90px;
}

.bdbw--100px {
    border-bottom-width: 100px;
}

.bdbw--150px {
    border-bottom-width: 150px;
}

.bdbw--200px {
    border-bottom-width: 200px;
}

.bdbw--250px {
    border-bottom-width: 250px;
}

.bdbw--300px {
    border-bottom-width: 300px;
}

/* border-left-width
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– */

/* px */

.bdlw--1px {
    border-left-width: 1px;
}

.bdlw--2px {
    border-left-width: 2px;
}

.bdlw--3px {
    border-left-width: 3px;
}

.bdlw--4px {
    border-left-width: 4px;
}

.bdlw--5px {
    border-left-width: 5px;
}

.bdlw--6px {
    border-left-width: 6px;
}

.bdlw--7px {
    border-left-width: 7px;
}

.bdlw--8px {
    border-left-width: 8px;
}

.bdlw--9px {
    border-left-width: 9px;
}

.bdlw--10px {
    border-left-width: 10px;
}

.bdlw--20px {
    border-left-width: 20px;
}

.bdlw--30px {
    border-left-width: 30px;
}

.bdlw--40px {
    border-left-width: 40px;
}

.bdlw--50px {
    border-left-width: 50px;
}

.bdlw--60px {
    border-left-width: 60px;
}

.bdlw--70px {
    border-left-width: 70px;
}

.bdlw--80px {
    border-left-width: 80px;
}

.bdlw--90px {
    border-left-width: 90px;
}

.bdlw--100px {
    border-left-width: 100px;
}

.bdlw--150px {
    border-left-width: 150px;
}

.bdlw--200px {
    border-left-width: 200px;
}

.bdlw--250px {
    border-left-width: 250px;
}

.bdlw--300px {
    border-left-width: 300px;
}

/*ƒ –––––––––––––––––––––––––––––––––––––––– primer-emmet-parameter */

-- (double-hiphen)にしているのは、一応競合防止と、
(※例えば『Bootstrap』のm-0margin: 0;で、
 『Emmet』なら競合しても大きく問題出ないような気がしますが)

自分の場合は若干コードをわかりやすくするために、

element .class-property(※種類・属性。主に .(dot) の代わり) と、
element .class--value(※値。主に : (colon) 、= (equal) の代わり)

で分類しようとしているのが理由です。以上です。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0