/****************************************
*     Margin
****************************************/
.margin-0{ margin: 0; }

.margin-t5{ margin-top: 5px; }
.margin-t10{ margin-top: 10px; }
.margin-t20{ margin-top: 20px; }


/****************************************
*     Padding
****************************************/




/****************************************
*     Width
****************************************/




/****************************************
*     Height
****************************************/


/****************************************
*     Font
****************************************/



.text-al { text-align: left; }
.text-ac { text-align: center; }
.text-ar { text-align: right; }


/****************************************
*     Etc
****************************************/


/****************************************
*     Margin
****************************************/
.mg_0{ margin: 0; }

.mt_20{ margin-top: 20px; }

.mgt_0{ margin-top: 0; }
.mgt_5{ margin-top: 5px; }
.mgt_10{ margin-top: 10px; }
.mgt_15{ margin-top: 15px; }
.mgt_20{ margin-top: 20px; }
.mgt_50{ margin-top: 50px; }
.mgt_80{ margin-top: 80px; }
.mgt_100{ margin-top: 100px; }

.mgb_0{ margin-bottom: 0; }
.mgb_5{ margin-bottom: 5px; }
.mgb_10{ margin-bottom: 10px; }
.mgb_15{ margin-bottom: 15px; }
.mgb_20{ margin-bottom: 20px; }

.mgl_0{ margin-left: 0; }
.mgl_5{ margin-left: 5px; }
.mgl_10{ margin-left: 10px; }
.mgl_15{ margin-left: 15px; }
.mgl_20{ margin-left: 20px; }

.mgr_0{ margin-right: 0; }
.mgr_5{ margin-right: 5px; }
.mgr_10{ margin-right: 10px; }
.mgr_15{ margin-right: 15px; }
.mgr_20{ margin-right: 20px; }


.mglr_10{ margin-left: 10px; margin-right: 10px; }
.mglr_20{ margin-left: 20px; margin-right: 20px; }

/****************************************
*     Padding
****************************************/
.pd_0{ padding: 0; }
.pd_10{ padding: 10px; }

.pdtb_4{ padding-top: 4px; padding-bottom: 4px; }
.pdtb_12{ padding-top: 12px; padding-bottom: 12px; }
.pdtb_13{ padding-top: 13px; padding-bottom: 13px; }
.pdtb_14{ padding-top: 14px; padding-bottom: 14px; }
.pdtb_15{ padding-top: 15px; padding-bottom: 15px; }


.pdlr_10{ padding-left: 10px; padding-right: 10px; }


/****************************************
*     Width
****************************************/
.wd_45p{ width: 45%; }
.wd_50p{ width: 50%; }
.wd_60p{ width: 60%; }
.wd_70p{ width: 70%; }
.wd_80p{ width: 80%; }
.wd_90p{ width: 90%; }
.wd_100p{ width: 100%; }
.wd_10{ width: 10px; } .wd_20{ width: 20px; } .wd_30{ width: 30px; } .wd_40{ width: 40px; } .wd_50{ width: 50px; }
.wd_60{ width: 60px; } .wd_70{ width: 70px; } .wd_80{ width: 80px; } .wd_90{ width: 90px; } .wd_100{ width: 100px; }
.wd_100{ width: 100px; } .wd_150{ width: 150px; } .wd_200{ width: 200px; }

/****************************************
*     Height
****************************************/
.ht_100p{ height: 100%; }
.ht_10{ height: 10px; } .ht_20{ height: 20px; } .ht_30{ height: 30px; } .ht_40{ height: 40px; } .ht_50{ height: 50px; }
.ht_60{ height: 60px; } .ht_70{ height: 70px; } .ht_80{ height: 80px; } .ht_90{ height: 90px; } .ht_100{ height: 100px; }

/****************************************
*     Font
****************************************/
/* color */
.color_dim_gray{ color: #696969; }

/* size */
.fs_08{ font-size: 0.8rem; }
.fs_09{ font-size: 0.9rem; }
.fs_10{ font-size: 1.0rem; }
.fs_11{ font-size: 1.1rem; }
.fs_12{ font-size: 1.2rem; }
.fs_13{ font-size: 1.3rem; } .fs_14{ font-size: 1.4rem; } .fs_15{ font-size: 1.5rem; }
.fs_16{ font-size: 1.6rem; } .fs_17{ font-size: 1.7rem; } .fs_18{ font-size: 1.8rem; } .fs_19{ font-size: 1.9rem; } .fs_20{ font-size: 2.0rem; }
.fs_30{ font-size: 3.0rem; }

/* font weight */
.fw_normal{ font-weight: normal; }
.fw_bold{ font-weight: bold; }
.fw_300{ font-weight: 300; } .fw_400{ font-weight: 400; } .fw_500{ font-weight: 500; }
.fw_600{ font-weight: 600; } .fw_700{ font-weight: 700; } .fw_800{ font-weight: 800; } .fw_900{ font-weight: 900; }

/* text align */
.ta_l{ text-align: left; } .ta_c{ text-align: center; } .ta_r{ text-align: right; }

/* text-overflow */
.to_ellipsis{ text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

/* white space */
.ws_normal{ white-space: normal; }

/* word break */
.wb_normal{ word-break: normal; }
.wb_keep_all{ word-break: keep-all; }
.wb_break_all{ word-break: break-all; }
.wb_break_word{ word-break: break-word; }





/* border */
.bd_none{ border: none; }

/* overflow */
.of_v{ overflow: visible; }
.of_h{ overflow: hidden; }
.of_s{ overflow: scroll; }
.of_a{ overflow: auto; }

.of_x_s{ overflow-x: scroll; }

.of_y_s{ overflow-y: scroll; }

/* flex */
.fx_d_c{ display: flex; flex-direction: column; }
.fx_d_cr{ display: flex; flex-direction: column-reverse; }
.fx_d_r{ display: flex; flex-direction: row; }
.fx_d_rr{ display: flex; flex-direction: row-reverse; }

.fx_w_w{ flex-wrap: wrap; }
.fx_w_wr{ flex-wrap: wrap-reverse; }
.fx_w_nr{ flex-wrap: nowrap; }

.fx_jc_fs{ justify-content: flex-start; }
.fx_jc_fe{ justify-content: flex-end; }
.fx_jc_c{ justify-content: center; }
.fx_jc_sb{ justify-content: space-between; }
.fx_jc_sa{ justify-content: space-around; }
.fx_jc_se{ justify-content: space-evenly; }

.fx_ai_fs{ align-items: flex-start; }
.fx_ai_fe{ align-items: flex-end; }
.fx_ai_c{ align-items: center; }
.fx_ai_b{ align-items: baseline; }

.fx_ac_fs{ align-content: flex-start; }
.fx_ac_fe{ align-content: flex-end; }
.fx_ac_c{  align-content: center; }
.fx_ac_sb{ align-content: space-between; }
.fx_ac_sa{ align-content: space-around; }
.fx_ac_se{ align-content: space-evenly; }

.gap_5{ gap: 5px; }
.gap_10{ gap: 10px; }
.gap_15{ gap: 15px; }
.gap_20{ gap: 20px; }

/* display */
.dp_block{ display: block; }
.dp_iblock{ display: inline-block; }
.dp_none{ display: none; }

/* box-sizing */
.bs_cb{ box-sizing: content-box; }
.bs_bb{ box-sizing: border-box; }

/* box-shadow */
.bsd_black_10{
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
}



/* nobr */
.nobr{ white-space: nowrap; }


/**/
.user_select_none{
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


