/*
  * Util css - By Raine 20190315
  * 命名規則: 前面一定要加個 u- 標示為util。排序請由小到大遞增，方便查找。
  * 這檔案為純css, 非scss
  */

/*
  * margin
  */
.t-mr {
    text-align: right;
}
.t-ml {
    text-align: left;
}
.u-mr-4 {
    margin-right: 4px !important;
}
.u-mt-6 {
    margin-top: 6px !important;
}
.u-mt-8 {
    margin-top: 8px !important;
}
.u-mr-8 {
    margin-right: 8px !important;
}
.u-mb-8 {
    margin-bottom: 8px !important;
}
.u-ml-9 {
    margin-left: 9px !important;
}
.u-mr-9 {
    margin-right: 9px !important;
}
.u-mb-10 {
    margin-bottom: 10px !important;
}
.u-ml-10 {
    margin-left: 10px !important;
}
.u-mt-10 {
    margin-top: 10px !important;
}
.u-mt-16 {
    margin-top: 16px !important;
}
.u-mr-16 {
    margin-right: 16px !important;
}
.u-mb-16 {
    margin-bottom: 16px !important;
}
.u-ml-16 {
    margin-left: 16px !important;
}
.u-ml-18 {
    margin-left: 18px !important;
}
.u-mr-18 {
    margin-right: 18px !important;
}
.u-mt-20 {
    margin-top: 20px !important;
}
.u-mb-24 {
    margin-bottom: 24px !important;
}
.u-ml-24 {
    margin-left: 24px !important;
}
.u-mr-24 {
    margin-right: 24px !important;
}
.u-mt-24 {
    margin-top: 24px !important;
}
.u-mr-25 {
    margin-right: 25px !important;
}
.u-ml-25 {
    margin-left: 25px !important;
}
.u-mr-26 {
    margin-right: 26px !important;
}
.u-mt-28 {
    margin-top: 28px !important;
}
.u-mr-30 {
    margin-right: 30px !important;
}
.u-ml-30 {
    margin-left: 30px !important;
}
.u-mb-30 {
    margin-bottom: 30px !important;
}
.u-mt-30 {
    margin-top: 30px !important;
}
.u-mr-32 {
    margin-right: 32px !important;
}
.u-ml-32 {
    margin-left: 32px !important;
}
.u-mb-32 {
    margin-bottom: 32px !important;
}
.u-mt-32 {
    margin-top: 32px !important;
}
.u-mt-40 {
    margin-top: 40px !important;
}
.u-mr-40 {
    margin-right: 40px !important;
}
.u-mt-40 {
    margin-top: 40px !important;
}
.u-mb-40 {
    margin-bottom: 40px !important;
}
.u-ml-40 {
    margin-left: 40px !important;
}
.u-mt-48 {
    margin-top: 48px !important;
}
.u-mb-48 {
    margin-bottom: 48px !important;
}
.u-ml-50 {
    margin-left: 50px !important;
}
.u-mr-50 {
    margin-right: 50px !important;
}
.u-mb-52 {
    margin-bottom: 52px !important;
}
.u-mt-52 {
    margin-top: 52px !important;
}
.u-mt-56 {
    margin-top: 56px !important;
}
.u-mt-64 {
    margin-top: 64px !important;
}
.u-mt-104 {
    margin-top: 104px !important;
}
.u-mt-140 {
    margin-top: 140px !important;
}
.u-ml-152 {
    margin-left: 152px !important;
}
.u-mr-152 {
    margin-right: 152px !important;
}

/*
  * padding
  */
.u-pl-8 {
    padding-left: 8px !important;
}
.u-pr-8 {
    padding-right: 8px !important;
}
.u-pl-10 {
    padding-left: 10px !important;
}
.u-pr-10 {
    padding-right: 10px !important;
}
.u-pl-16 {
    padding-left: 16px !important;
}
.u-pl-32 {
    padding-left: 32px !important;
}
.u-pl-40 {
    padding-left: 40px !important;
}
.u-pr-40 {
    padding-right: 40px !important;
}
.u-pb-40 {
    padding-bottom: 40px !important;
}

/*
  * width
  */
.u-w-100 {
    width: 100% !important;
}

/*
  * flex
  */
.u-row-flex-between {
    display: flex !important;
    justify-content: space-between !important;
}
.u-row-flex-around {
    display: flex !important;
    justify-content: space-around !important;
}
.u-row-flex-center {
    display: flex !important;
    justify-content: center !important;
}
.u-row-flex-start {
    display: flex !important;
    justify-content: flex-start !important;
}