/* ===================================================================================*/
/* 彈性區塊設定 */
/* ===================================================================================*/
/* 設定為彈性區塊 橫向排列 */
.DV_FLEX_HORIZONTAL {
    /* 指定 內部區塊為彈性排列 */
    display: -moz-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    /* 指定 排列方向為橫排 */
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
}

/* 設定為彈性區塊 縱向排列 */
.DV_FLEX_VERTICAL {
    /* 指定 內部區塊為彈性排列 */
    display: -moz-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    /* 指定 排列方向為縱排 */
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

/* 設定為彈性區塊 多行 */
.DV_FLEX_WARP {
    flex-wrap: wrap;
}

/* 設定為彈性區塊 單行 */
.DV_FLEX_NOWARP {
    flex-wrap: nowrap;
}

/* 設定為彈性區塊 擴大或縮小 */
.DV_FLEX_GROW {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: auto;
}
/* ===================================================================================*/
/* 彈性區塊 排列方式 設定 */
/* ===================================================================================*/
/* 設定為彈性區塊 開始位置排列 */
.DV_FLEX_START {
    /* 指定 排列開始位置 */
    -moz-box-pack: start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

/* 設定為彈性區塊 尾部位置排列 */
.DV_FLEX_END {
    /* 指定 排列開始位置 */
    -moz-box-pack: end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

/* 設定為彈性區塊 平均分配 */
.DV_FLEX_JUSTIFY {
    -moz-box-pack: justify;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-flex-pack: justify;
    justify-content: space-between;
}
/* 設定為彈性區塊 平均分配 */

.DV_FLEX_CENTER {
    -moz-box-pack: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-flex-pack: center;
    justify-content: center;
}
/* ===================================================================================*/
/* 彈性區塊 排列方式 設定 */
/* ===================================================================================*/
/* 設定為彈性區塊 對齊方向-開始位置 */
.DV_FLEX_ALIGN_START {
    -moz-box-align: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-flex-align: start;
    align-items: flex-start;
}

/* 設定為彈性區塊 對齊方向-居中 */
.DV_FLEX_ALIGN_CENTER {
    -moz-box-align: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-flex-align: center;
    align-items: center;
}

/* 設定為彈性區塊 對齊方向-終端 */
.DV_FLEX_ALIGN_END {
    -moz-box-align: end;
    -webkit-box-align: end;
    -ms-flex-align: end;
    -webkit-flex-align: end;
    align-items: flex-end;
}