/* ---------- 縦スクロール ---------- */
@media screen and (max-width: 1023px){

/* font ------------------------------------------------------------------------------------------------------------------------*/
/* フォント */
.font_sans-serif_col{
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}
.font_serif_col{
	font-family: "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}

/* フォントサイズ */
/* default 16px */
.font_10_col{font-size: 10px;}
.font_11_col{font-size: 11px;}
.font_12_col{font-size: 12px;}
.font_13_col{font-size: 13px;}
.font_14_col{font-size: 14px;}
.font_15_col{font-size: 15px;}
.font_16_col{font-size: 16px;}
.font_17_col{font-size: 17px;}
.font_18_col{font-size: 18px;}
.font_19_col{font-size: 19px;}
.font_20_col{font-size: 20px;}
.font_21_col{font-size: 21px;}
.font_22_col{font-size: 22px;}
.font_23_col{font-size: 23px;}
.font_24_col{font-size: 24px;}
.font_25_col{font-size: 25px;}
.font_26_col{font-size: 26px;}
.font_27_col{font-size: 27px;}
.font_28_col{font-size: 28px;}
.font_29_col{font-size: 29px;}
.font_30_col{font-size: 30px;}
.font_31_col{font-size: 31px;}
.font_32_col{font-size: 32px;}
.font_33_col{font-size: 33px;}
.font_34_col{font-size: 34px;}
.font_35_col{font-size: 35px;}
.font_36_col{font-size: 36px;}
.font_37_col{font-size: 37px;}
.font_38_col{font-size: 38px;}
.font_39_col{font-size: 39px;}
.font_40_col{font-size: 40px;}
.font_41_col{font-size: 41px;}
.font_42_col{font-size: 42px;}
.font_43_col{font-size: 43px;}
.font_44_col{font-size: 44px;}
.font_45_col{font-size: 45px;}
.font_46_col{font-size: 46px;}
.font_47_col{font-size: 47px;}
.font_48_col{font-size: 48px;}
.font_49_col{font-size: 49px;}
.font_50_col{font-size: 50px;}
	
/* フォントサイズ 基準値から+- */
.font_100per_col{font-size:-webkit-calc(1rem);font-size : calc(1rem);}
.font_200per_col{font-size:-webkit-calc(2rem);font-size : calc(2rem);}
.font_2up_col{font-size:-webkit-calc(1rem + 2px);font-size : calc(1rem + 2px);}
.font_4up_col{font-size:-webkit-calc(1rem + 4px);font-size : calc(1rem + 4px);}
.font_6up_col{font-size:-webkit-calc(1rem + 6px);font-size : calc(1rem + 6px);}
.font_8up_col{font-size:-webkit-calc(1rem + 8px);font-size : calc(1rem + 8px);}
.font_10up_col{font-size:-webkit-calc(1rem + 10px);font-size : calc(1rem + 10px);}
.font_12up_col{font-size:-webkit-calc(1rem + 12px);font-size : calc(1rem + 12px);}
.font_14up_col{font-size:-webkit-calc(1rem + 14px);font-size : calc(1rem + 14px);}
.font_2dw_col{font-size:-webkit-calc(1rem - 2px);font-size : calc(1rem - 2px);}
.font_4dw_col{font-size:-webkit-calc(1rem - 4px);font-size : calc(1rem - 4px);}
.font_6dw_col{font-size:-webkit-calc(1rem - 6px);font-size : calc(1rem - 6px);}
.font_8dw_col{font-size:-webkit-calc(1rem - 8px);font-size : calc(1rem - 8px);}

/* フォント太さ */
/* default normal */
.font_normal_col{font-weight: normal;}
.font_bold_col{font-weight: bold;}
.font_light_col{font-weight: lighter;}

/* 文字間隔 */
/* default 1px */
.letter_0_col{letter-spacing: 0;}
.letter_1_col{letter-spacing: 1px;}
.letter_2_col{letter-spacing: 2px;}
.letter_3_col{letter-spacing: 3px;}
.letter_4_col{letter-spacing: 4px;}
.letter_5_col{letter-spacing: 5px;}
.letter_6_col{letter-spacing: 6px;}
.letter_7_col{letter-spacing: 7px;}
.letter_8_col{letter-spacing: 8px;}
.letter_9_col{letter-spacing: 9px;}
.letter_10_col{letter-spacing: 10px;}

/* 行間 */
/* line-height 1.5 */
.linehight_0_col{line-height: 0;}
.linehight_h_col{line-height: 0.5;}
.linehight_1_col{line-height: 1;}
.linehight_1-h_col{line-height: 1.5;}
.linehight_2_col{line-height: 2;}
.linehight_2-h_col{line-height: 2.5;}
.linehight_3_col{line-height: 3;}
.linehight_3-h_col{line-height: 3.5;}
.linehight_4_col{line-height: 4;}
.linehight_4-h_col{line-height: 4.5;}
.linehight_5_col{line-height: 5;}

/* フォントスタイル */
/* font-style normal */
.font_style_normal_col{font-style: normal;}
.font_style_italic_col{font-style: italic;}

/* 改行なしの非表示 */
.over_txt_col{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.over_txt_col br{display: none;}

/* 文字揃え */
.txt_center_col{text-align: center;}
.txt_left_col{text-align: left;}
.txt_right_col{text-align: right;}

/* 縦書き・横書き */
.txt_vertical_col{
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}
.txt_horizontal_col{
	-webkit-writing-mode: horizontal-tb;
	-ms-writing-mode: lr-tb;
    writing-mode: horizontal-tb;
}

/* display ------------------------------------------------------------------------------------------------------------------------*/
.d_block_col{display: block;}
.d_none_col{display: none;}
.d_inline_col{display: inline;}
.d_inline_b_col{display: inline-block;}
.d_table_col{display: table;}
.d_table-cell_col{display: table-cell;}
.d_flex_col{
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
	flex-direction: row;
}
/* flex設定 */
.flex_wrap_col{flex-wrap:wrap;}
.flex_nowrap_col{flex-wrap:nowrap;}
.flex_row_col{flex-direction: row;}
.flex_row-re_col{flex-direction: row-reverse;}
.flex_column_col{flex-direction: column;}
.flex_space-between_col{justify-content: space-between;}
.flex_space-around_col{justify-content: space-around;}
.flex_align-auto_col{align-self: auto;}
.flex_align-stretch_col{align-self: stretch;}
.flex_stretch_col{align-items: stretch;}
.flex_top_col{align-items: flex-start;}
.flex_center_col{align-items: center;}
.flex_bottom_col{align-items: flex-end;}
.flex_top-center_col{
    justify-content: center;
    align-items: flex-start;
}
.flex_top-left_col{
    justify-content: flex-start;
    align-items: flex-start;
}
.flex_top-right_col{
    justify-content: flex-end;
    align-items: flex-start;
}
.flex_center-center_col{
    justify-content: center;
    align-items: center;
}
.flex_center-left_col{
    justify-content: flex-start;
    align-items: center;
}
.flex_center-right_col{
    justify-content: flex-end;
    align-items: center;
}
.flex_bottom-center_col{
    justify-content: center;
    align-items: flex-end;
}
.flex_bottom-left_col{
    justify-content: flex-start;
    align-items: flex-end;
}
.flex_bottom-right_col{
    justify-content: flex-end;
    align-items: flex-end;
}
.flex_order1_col{order: 1;}
.flex_order2_col{order: 2;}
.flex_order3_col{order: 3;}
.flex_order4_col{order: 4;}
.flex_order5_col{order: 5;}
.flex_order6_col{order: 6;}
.flex_order7_col{order: 7;}
.flex_order8_col{order: 8;}
.flex_order9_col{order: 9;}
.flex_order10_col{order: 10;}
.flex_order11_col{order: 11;}
.flex_order12_col{order: 12;}

/* 揃え位置 */
.vr_center_col{vertical-align: middle;}
.vr_top_col{vertical-align: top;}
.vr_bottom_col{vertical-align: bottom;}

/* 非表示設定 */
.empty-hide_col:empty{display: none!important;}
.empty-mg_col:empty{margin: 0!important;}
.empty-pd_col:empty{padding: 0!important;}

/* images ------------------------------------------------------------------------------------------------------------------------*/

/* 背景画像 */
.bg_posi_t-l_col{background-position: top left;}
.bg_posi_t-c_col{background-position: top center;}
.bg_posi_t-r_col{background-position: top right;}
.bg_posi_c-c_col{background-position: center center;}
.bg_posi_c-l_col{background-position: center left;}
.bg_posi_c-r_col{background-position: center right;}
.bg_posi_b-l_col{background-position: bottom left;}
.bg_posi_b-c_col{background-position: bottom center;}
.bg_posi_b-r_col{background-position: bottom right;}
.bg_repe_col{background-repeat: repeat;}
.bg_repe-x_col{background-repeat: repeat-x;}
.bg_repe-y_col{background-repeat: repeat-y;}
.bg_repe-no_col{background-repeat: no-repeat;}
.bg_size-cover_col{background-size: cover;}
.bg_size-contain_col{background-size: contain;}
.bg_size-100-auto_col{background-size: 100% auto;}
.bg_size-auto-100_col{background-size: auto 100%;}
.bg_attach-scroll_col{background-attachment: scroll;}
.bg_attach-fixed_col{background-attachment: fixed;}

/* size ------------------------------------------------------------------------------------------------------------------------*/
.width_1280_col,.width_1000_col,.width_900_col,.width_800_col,.width_700_col,.width_600_col,.width_500_col,.width_400_col,.width_300_col,.width_200_col,.width_150_col,.width_100_col,.width_50_col,.width_1280-1000_col,.width_1280-max_col,.width_1000-max_col,.width_900-max_col,.width_800-max_col,.width_700-max_col,.width_600-max_col,.width_500-max_col,.width_400-max_col,.width_300-max_col,.width_200-max_col,.width_150-max_col,.width_100-max_col,.width_50-max_col,.width_max_col,.width_1280-min_col,.width_1000-min_col,.width_900-min_col,.width_800-min_col,.width_700-min_col,.width_600-min_col,.width_500-min_col,.width_400-min_col,.width_300-min_col,.width_200-min_col,.width_150-min_col,.width_100-min_col,.width_50-min_col{
	margin: 0 auto;
	box-sizing: border-box;
}
.width_1280_col{width: 1280px;}
.width_1000_col{width: 1000px;}
.width_900_col{width: 900px;}
.width_800_col{width: 800px;}
.width_700_col{width: 600px;}
.width_600_col{width: 600px;}
.width_500_col{width: 500px;}
.width_400_col{width: 400px;}
.width_300_col{width: 300px;}
.width_200_col{width: 200px;}
.width_150_col{width: 150px;}
.width_100_col{width: 100px;}
.width_50_col{width: 50px;}
.width_40_col{width: 40px;}
.width_30_col{width: 30px;}
.width_20_col{width: 20px;}
.width_10_col{width: 10px;}
.width_5_col{width: 5px;}
.width_1280-1000_col{width: 100%;max-width: 1280px;min-width: 1000px;}
.width_1280-max_col{width: 100%;max-width: 1280px;}
.width_1000-max_col{width: 100%;max-width: 1000px;}
.width_900-max_col{width: 100%;max-width: 900px;}
.width_800-max_col{width: 100%;max-width: 800px;}
.width_700-max_col{width: 100%;max-width: 600px;}
.width_600-max_col{width: 100%;max-width: 600px;}
.width_500-max_col{width: 100%;max-width: 500px;}
.width_400-max_col{width: 100%;max-width: 400px;}
.width_300-max_col{width: 100%;max-width: 300px;}
.width_200-max_col{width: 100%;max-width: 200px;}
.width_150-max_col{width: 100%;max-width: 150px;}
.width_100-max_col{width: 100%;max-width: 100px;}
.width_50-max_col{width: 100%;max-width: 50px;}
.width_max_col{width: 100%;max-width: 100%;min-width: 100%;}
.width_1280-min_col{width: 100%;min-width: 1280px;}
.width_1000-min_col{width: 100%;min-width: 1000px;}
.width_900-min_col{width: 100%;min-width: 900px;}
.width_800-min_col{width: 100%;min-width: 800px;}
.width_700-min_col{width: 100%;min-width: 600px;}
.width_600-min_col{width: 100%;min-width: 600px;}
.width_500-min_col{width: 100%;min-width: 500px;}
.width_400-min_col{width: 100%;min-width: 400px;}
.width_300-min_col{width: 100%;min-width: 300px;}
.width_200-min_col{width: 100%;min-width: 200px;}
.width_150-min_col{width: 100%;min-width: 150px;}
.width_100-min_col{width: 100%;min-width: 100px;}
.width_50-min_col{width: 100%;min-width: 50px;}

/* width_per */
.width_10per_col{width: 10%!important;}
.width_20per_col{width: 20%!important;}
.width_25per_col{width: 25%!important;}
.width_30per_col{width: 30%!important;}
.width_33per_col{width: 33.333%!important;}
.width_40per_col{width: 40%!important;}
.width_50per_col{width: 50%!important;}
.width_60per_col{width: 60%!important;}
.width_70per_col{width: 70%!important;}
.width_80per_col{width: 80%!important;}
.width_90per_col{width: 90%!important;}
.width_100per_col{width: 100%!important;}
.width_10per_col,.width_20per_col,.width_25per_col,.width_30per_col,.width_33per_col,.width_40per_col,.width_50per_col,.width_60per_col,.width_70per_col,.width_80per_col,.width_90per_col,.width_100per_col{box-sizing: border-box;}

/* grid */
.grid_1_col{width: 8.33333%!important;}
.grid_2_col{width: 16.66667%!important;}
.grid_3_col{width: 25%!important;}
.grid_4_col{width: 33.33333%!important;}
.grid_5_col{width: 41.66667%!important;}
.grid_6_col{width: 50%!important;}
.grid_7_col{width: 58.33333%!important;}
.grid_8_col{width: 66.66667%!important;}
.grid_9_col{width: 75%!important;}
.grid_10_col{width: 83.33333%!important;}
.grid_11_col{width: 91.66667%!important;}
.grid_12_col{width: 100%!important;}
.grid_1_col,.grid_2_col,.grid_3_col,.grid_4_col,.grid_5_col,.grid_6_col,.grid_7_col,.grid_8_col,.grid_9_col,.grid_10_col,.grid_11_col,.grid_12_col{box-sizing: border-box;}

/* column */
.column_1_col,.column_2_col,.column_3_col,.column_4_col,.column_5_col,.column_6_col,.column_7_col,.column_8_col,.column_9_col,.column_10_col,.column_11_col,.column_12_col{
	display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
	flex-direction: row;
}
.column_12_col .column{width: 8.33333%!important;box-sizing: border-box;}
.column_10_col .column{width: 10%!important;box-sizing: border-box;}
.column_9_col .column{width: 11.11111%!important;box-sizing: border-box;}
.column_8_col .column{width: 12.5%!important;box-sizing: border-box;}
.column_7_col .column{width: 14.285%!important;box-sizing: border-box;}
.column_6_col .column{width: 16.66667%!important;box-sizing: border-box;}
.column_5_col .column{width: 20%!important;box-sizing: border-box;}
.column_4_col .column{width: 25%!important;box-sizing: border-box;}
.column_3_col .column{width: 33.333%!important;box-sizing: border-box;}
.column_2_col .column{width: 50%!important;box-sizing: border-box;}
.column_1_col .column{width: 100%!important;box-sizing: border-box;}

/* height */
.heightauto_col{height: auto;}
.height100per_col{height: 100%;}
.height5vh_col{height: 5vh;}
.height10vh_col{height: 10vh;}
.height15vh_col{height: 15vh;}
.height20vh_col{height: 20vh;}
.height25vh_col{height: 25vh;}
.height30vh_col{height: 30vh;}
.height35vh_col{height: 35vh;}
.height40vh_col{height: 40vh;}
.height45vh_col{height: 45vh;}
.height50vh_col{height: 50vh;}
.height55vh_col{height: 55vh;}
.height60vh_col{height: 60vh;}
.height65vh_col{height: 65vh;}
.height70vh_col{height: 70vh;}
.height75vh_col{height: 75vh;}
.height80vh_col{height: 80vh;}
.height85vh_col{height: 85vh;}
.height90vh_col{height: 90vh;}
.height95vh_col{height: 95vh;}
.height100vh_col{height: 100vh;}

/* margin / padding ------------------------------------------------------------------------------------------------------------------------*/

/* margin */
.mg_center_col{margin: 0 auto;}
.mg_clear_col{margin: 0;}
.mg_5per_col{margin: 5%;}
.mg_10per_col{margin: 10%;}
.mg_t-b5per_col{margin: 5% 0;}
.mg_l-r5per_col{margin: 0 5%;}
.mg_t-b10per_col{margin: 10% 0;}
.mg_l-r10per_col{margin: 0 10%;}
.mg_t-5px_col{margin-top: 5px;}
.mg_t-10px_col{margin-top: 10px;}
.mg_t-15px_col{margin-top: 15px;}
.mg_t-20px_col{margin-top: 20px;}
.mg_t-25px_col{margin-top: 25px;}
.mg_t-30px_col{margin-top: 30px;}
.mg_t-35px_col{margin-top: 35px;}
.mg_t-40px_col{margin-top: 40px;}
.mg_t-45px_col{margin-top: 45px;}
.mg_t-50px_col{margin-top: 50px;}
.mg_t-100px_col{margin-top: 100px;}
.mg_t-150px_col{margin-top: 150px;}
.mg_t-200px_col{margin-top: 200px;}
.mg_b-5px_col{margin-bottom: 5px;}
.mg_b-10px_col{margin-bottom: 10px;}
.mg_b-15px_col{margin-bottom: 15px;}
.mg_b-20px_col{margin-bottom: 20px;}
.mg_b-25px_col{margin-bottom: 25px;}
.mg_b-30px_col{margin-bottom: 30px;}
.mg_b-35px_col{margin-bottom: 35px;}
.mg_b-40px_col{margin-bottom: 40px;}
.mg_b-45px_col{margin-bottom: 45px;}
.mg_b-50px_col{margin-bottom: 50px;}
.mg_b-100px_col{margin-bottom: 100px;}
.mg_b-150px_col{margin-bottom: 150px;}
.mg_b-200px_col{margin-bottom: 200px;}
.mg_l-5px_col{margin-left: 5px;}
.mg_l-10px_col{margin-left: 10px;}
.mg_l-15px_col{margin-left: 15px;}
.mg_l-20px_col{margin-left: 20px;}
.mg_l-25px_col{margin-left: 25px;}
.mg_l-30px_col{margin-left: 30px;}
.mg_l-35px_col{margin-left: 35px;}
.mg_l-40px_col{margin-left: 40px;}
.mg_l-45px_col{margin-left: 45px;}
.mg_l-50px_col{margin-left: 50px;}
.mg_l-100px_col{margin-left: 100px;}
.mg_l-150px_col{margin-left: 150px;}
.mg_l-200px_col{margin-left: 200px;}
.mg_r-5px_col{margin-right: 5px;}
.mg_r-10px_col{margin-right: 10px;}
.mg_r-15px_col{margin-right: 15px;}
.mg_r-20px_col{margin-right: 20px;}
.mg_r-25px_col{margin-right: 25px;}
.mg_r-30px_col{margin-right: 30px;}
.mg_r-35px_col{margin-right: 35px;}
.mg_r-40px_col{margin-right: 40px;}
.mg_r-45px_col{margin-right: 45px;}
.mg_r-50px_col{margin-right: 50px;}
.mg_r-100px_col{margin-right: 100px;}
.mg_r-150px_col{margin-right: 150px;}
.mg_r-200px_col{margin-right: 200px;}

/* padding */
.pd_clear_col{padding: 0;}
.pd_5per_col{padding: 5%;}
.pd_10per_col{padding: 10%;}
.pd_t-b5per_col{padding: 5% 0;}
.pd_l-r5per_col{padding: 0 5%;}
.pd_t-b10per_col{padding: 10% 0;}
.pd_l-r10per_col{padding: 0 10%;}
.pd_50px_col{padding: 50px;}
.pd_40px_col{padding: 40px;}
.pd_30px_col{padding: 30px;}
.pd_20px_col{padding: 20px;}
.pd_10px_col{padding: 10px;}
.pd_5px_col{padding: 5px;}
.pd_t-5px_col{padding-top: 5px;}
.pd_t-10px_col{padding-top: 10px;}
.pd_t-15px_col{padding-top: 15px;}
.pd_t-20px_col{padding-top: 20px;}
.pd_t-25px_col{padding-top: 25px;}
.pd_t-30px_col{padding-top: 30px;}
.pd_t-35px_col{padding-top: 35px;}
.pd_t-40px_col{padding-top: 40px;}
.pd_t-45px_col{padding-top: 45px;}
.pd_t-50px_col{padding-top: 50px;}
.pd_t-100px_col{padding-top: 100px;}
.pd_t-150px_col{padding-top: 150px;}
.pd_t-200px_col{padding-top: 200px;}
.pd_b-5px_col{padding-bottom: 5px;}
.pd_b-10px_col{padding-bottom: 10px;}
.pd_b-15px_col{padding-bottom: 15px;}
.pd_b-20px_col{padding-bottom: 20px;}
.pd_b-25px_col{padding-bottom: 25px;}
.pd_b-30px_col{padding-bottom: 30px;}
.pd_b-35px_col{padding-bottom: 35px;}
.pd_b-40px_col{padding-bottom: 40px;}
.pd_b-45px_col{padding-bottom: 45px;}
.pd_b-50px_col{padding-bottom: 50px;}
.pd_b-100px_col{padding-bottom: 100px;}
.pd_b-150px_col{padding-bottom: 150px;}
.pd_b-200px_col{padding-bottom: 200px;}
.pd_l-5px_col{padding-left: 5px;}
.pd_l-10px_col{padding-left: 10px;}
.pd_l-15px_col{padding-left: 15px;}
.pd_l-20px_col{padding-left: 20px;}
.pd_l-25px_col{padding-left: 25px;}
.pd_l-30px_col{padding-left: 30px;}
.pd_l-35px_col{padding-left: 35px;}
.pd_l-40px_col{padding-left: 40px;}
.pd_l-45px_col{padding-left: 45px;}
.pd_l-50px_col{padding-left: 50px;}
.pd_l-100px_col{padding-left: 100px;}
.pd_l-150px_col{padding-left: 150px;}
.pd_l-200px_col{padding-left: 200px;}
.pd_r-5px_col{padding-right: 5px;}
.pd_r-10px_col{padding-right: 10px;}
.pd_r-15px_col{padding-right: 15px;}
.pd_r-20px_col{padding-right: 20px;}
.pd_r-25px_col{padding-right: 25px;}
.pd_r-30px_col{padding-right: 30px;}
.pd_r-35px_col{padding-right: 35px;}
.pd_r-40px_col{padding-right: 40px;}
.pd_r-45px_col{padding-right: 45px;}
.pd_r-50px_col{padding-right: 50px;}
.pd_r-100px_col{padding-right: 100px;}
.pd_r-150px_col{padding-right: 150px;}
.pd_r-200px_col{padding-right: 200px;}

/* offset per */
.offset-0per_col{margin-left: 0;}
.offset-10per_col{margin-left: 10%;}
.offset-20per_col{margin-left: 20%;}
.offset-30per_col{margin-left: 30%;}
.offset-40per_col{margin-left: 40%;}
.offset-50per_col{margin-left: 50%;}
.offset-60per_col{margin-left: 60%;}
.offset-70per_col{margin-left: 70%;}
.offset-80per_col{margin-left: 80%;}
.offset-90per_col{margin-left: 90%;}

/* offset grid */
.offset-0_col{margin-left: 0;}
.offset-1_col{margin-left: 8.33333%;}
.offset-2_col{margin-left: 16.66667%;}
.offset-3_col{margin-left: 25%;}
.offset-4_col{margin-left: 33.33333%;}
.offset-5_col{margin-left: 41.66667%;}
.offset-6_col{margin-left: 50%;}
.offset-7_col{margin-left: 58.33333%;}
.offset-8_col{margin-left: 66.66667%;}
.offset-9_col{margin-left: 75%;}
.offset-10_col{margin-left: 83.33333%;}
.offset-11_col{margin-left: 91.66667%;}
.offset-0r_col{margin-right: 0;}
.offset-1r_col{margin-right: 8.33333%;}
.offset-2r_col{margin-right: 16.66667%;}
.offset-3r_col{margin-right: 25%;}
.offset-4r_col{margin-right: 33.33333%;}
.offset-5r_col{margin-right: 41.66667%;}
.offset-6r_col{margin-right: 50%;}
.offset-7r_col{margin-right: 58.33333%;}
.offset-8r_col{margin-right: 66.66667%;}
.offset-9r_col{margin-right: 75%;}
.offset-10r_col{margin-right: 83.33333%;}
.offset-11r_col{margin-right: 91.66667%;}


/* decoration ------------------------------------------------------------------------------------------------------------------------*/

/* box-shadow */
.shadow_col{box-shadow: 0 5px 10px rgba(0,0,0,0.3);}
.shadow-l_col{box-shadow: 0 2px 4px rgba(0,0,0,0.15);}
.shadow-b_col{box-shadow: 0 5px 10px rgba(0,0,0,0.5);}

/* text-shadow */
.txt_shadow_col{text-shadow: 0 2px 4px rgba(0,0,0,0.3);}
.txt_shadow-l_col{text-shadow: 0 1px 2px rgba(0,0,0,0.15);}
.txt_shadow-b_col{text-shadow: 0 5px 10px rgba(0,0,0,0.3);}

/* border */
.border_clear_col{border: none;}
.border_so1_col{border: 1px solid;}
.border_so2_col{border: 2px solid;}
.border_so3_col{border: 3px solid;}
.border_so4_col{border: 4px solid;}
.border_so5_col{border: 5px solid;}
.border_so10_col{border: 10px solid;}
.border_do1_col{border: 1px dotted;}
.border_do2_col{border: 2px dotted;}
.border_do3_col{border: 3px dotted;}
.border_do4_col{border: 4px dotted;}
.border_do5_col{border: 5px dotted;}
.border_do10_col{border: 10px dotted;}
.border_da1_col{border: 1px dashed;}
.border_da2_col{border: 2px dashed;}
.border_da3_col{border: 3px dashed;}
.border_da4_col{border: 4px dashed;}
.border_da5_col{border: 5px dashed;}
.border_da10_col{border: 10px dashed;}
.border_db1_col{border: 1px double;}
.border_db2_col{border: 2px double;}
.border_db3_col{border: 3px double;}
.border_db4_col{border: 4px double;}
.border_db5_col{border: 5px double;}
.border_db10_col{border: 10px double;}
.border_so1-t_col{border-top: 1px solid;}
.border_so2-t_col{border-top: 2px solid;}
.border_so3-t_col{border-top: 3px solid;}
.border_so4-t_col{border-top: 4px solid;}
.border_so5-t_col{border-top: 5px solid;}
.border_so10-t_col{border-top: 10px solid;}
.border_do1-t_col{border-top: 1px dotted;}
.border_do2-t_col{border-top: 2px dotted;}
.border_do3-t_col{border-top: 3px dotted;}
.border_do4-t_col{border-top: 4px dotted;}
.border_do5-t_col{border-top: 5px dotted;}
.border_do10-t_col{border-top: 10px dotted;}
.border_da1-t_col{border-top: 1px dashed;}
.border_da2-t_col{border-top: 2px dashed;}
.border_da3-t_col{border-top: 3px dashed;}
.border_da4-t_col{border-top: 4px dashed;}
.border_da5-t_col{border-top: 5px dashed;}
.border_da10-t_col{border-top: 10px dashed;}
.border_db1-t_col{border-top: 1px double;}
.border_db2-t_col{border-top: 2px double;}
.border_db3-t_col{border-top: 3px double;}
.border_db4-t_col{border-top: 4px double;}
.border_db5-t_col{border-top: 5px double;}
.border_db10-t_col{border-top: 10px double;}
.border_so1-b_col{border-bottom: 1px solid;}
.border_so2-b_col{border-bottom: 2px solid;}
.border_so3-b_col{border-bottom: 3px solid;}
.border_so4-b_col{border-bottom: 4px solid;}
.border_so5-b_col{border-bottom: 5px solid;}
.border_so10-b_col{border-bottom: 10px solid;}
.border_do1-b_col{border-bottom: 1px dotted;}
.border_do2-b_col{border-bottom: 2px dotted;}
.border_do3-b_col{border-bottom: 3px dotted;}
.border_do4-b_col{border-bottom: 4px dotted;}
.border_do5-b_col{border-bottom: 5px dotted;}
.border_do10-b_col{border-bottom: 10px dotted;}
.border_da1-b_col{border-bottom: 1px dashed;}
.border_da2-b_col{border-bottom: 2px dashed;}
.border_da3-b_col{border-bottom: 3px dashed;}
.border_da4-b_col{border-bottom: 4px dashed;}
.border_da5-b_col{border-bottom: 5px dashed;}
.border_da10-b_col{border-bottom: 10px dashed;}
.border_db1-b_col{border-bottom: 1px double;}
.border_db2-b_col{border-bottom: 2px double;}
.border_db3-b_col{border-bottom: 3px double;}
.border_db4-b_col{border-bottom: 4px double;}
.border_db5-b_col{border-bottom: 5px double;}
.border_db10-b_col{border-bottom: 10px double;}
.border_so1-l_col{border-left: 1px solid;}
.border_so2-l_col{border-left: 2px solid;}
.border_so3-l_col{border-left: 3px solid;}
.border_so4-l_col{border-left: 4px solid;}
.border_so5-l_col{border-left: 5px solid;}
.border_so10-l_col{border-left: 10px solid;}
.border_do1-l_col{border-left: 1px dotted;}
.border_do2-l_col{border-left: 2px dotted;}
.border_do3-l_col{border-left: 3px dotted;}
.border_do4-l_col{border-left: 4px dotted;}
.border_do5-l_col{border-left: 5px dotted;}
.border_do10-l_col{border-left: 10px dotted;}
.border_da1-l_col{border-left: 1px dashed;}
.border_da2-l_col{border-left: 2px dashed;}
.border_da3-l_col{border-left: 3px dashed;}
.border_da4-l_col{border-left: 4px dashed;}
.border_da5-l_col{border-left: 5px dashed;}
.border_da10-l_col{border-left: 10px dashed;}
.border_db1-l_col{border-left: 1px double;}
.border_db2-l_col{border-left: 2px double;}
.border_db3-l_col{border-left: 3px double;}
.border_db4-l_col{border-left: 4px double;}
.border_db5-l_col{border-left: 5px double;}
.border_db10-l_col{border-left: 10px double;}
.border_so1-r_col{border-right: 1px solid;}
.border_so2-r_col{border-right: 2px solid;}
.border_so3-r_col{border-right: 3px solid;}
.border_so4-r_col{border-right: 4px solid;}
.border_so5-r_col{border-right: 5px solid;}
.border_so10-r_col{border-right: 10px solid;}
.border_do1-r_col{border-right: 1px dotted;}
.border_do2-r_col{border-right: 2px dotted;}
.border_do3-r_col{border-right: 3px dotted;}
.border_do4-r_col{border-right: 4px dotted;}
.border_do5-r_col{border-right: 5px dotted;}
.border_do10-r_col{border-right: 10px dotted;}
.border_da1-r_col{border-right: 1px dashed;}
.border_da2-r_col{border-right: 2px dashed;}
.border_da3-r_col{border-right: 3px dashed;}
.border_da4-r_col{border-right: 4px dashed;}
.border_da5-r_col{border-right: 5px dashed;}
.border_da10-r_col{border-right: 10px dashed;}
.border_db1-r_col{border-right: 1px double;}
.border_db2-r_col{border-right: 2px double;}
.border_db3-r_col{border-right: 3px double;}
.border_db4-r_col{border-right: 4px double;}
.border_db5-r_col{border-right: 5px double;}
.border_db10-r_col{border-right: 10px double;}

/* 角丸 */
.border_rad2_col{border-radius: 2px;}
.border_rad3_col{border-radius: 3px;}
.border_rad4_col{border-radius: 4px;}
.border_rad5_col{border-radius: 5px;}
.border_rad10_col{border-radius: 10px;}
.border_rad50per_col{border-radius: 50%;}

/* opacity */
.opacity01_col{opacity: 0.1;}
.opacity02_col{opacity: 0.2;}
.opacity03_col{opacity: 0.3;}
.opacity04_col{opacity: 0.4;}
.opacity05_col{opacity: 0.5;}
.opacity06_col{opacity: 0.6;}
.opacity07_col{opacity: 0.7;}
.opacity08_col{opacity: 0.8;}
.opacity09_col{opacity: 0.9;}
.opacity1_col{opacity: 1;}
.opacity0_col{opacity: 0;}

/* motion */
.motion03s_col{transition: all 0.3s;}
.motion05s_col{transition: all 0.5s;}
.motion1s_col{transition: all 1s;}

/* hover */
.hvr_opa01_col:hover{opacity: 0.1;}
.hvr_opa02_col:hover{opacity: 0.2;}
.hvr_opa03_col:hover{opacity: 0.3;}
.hvr_opa04_col:hover{opacity: 0.4;}
.hvr_opa05_col:hover{opacity: 0.5;}
.hvr_opa06_col:hover{opacity: 0.6;}
.hvr_opa07_col:hover{opacity: 0.7;}
.hvr_opa08_col:hover{opacity: 0.8;}
.hvr_opa09_col:hover{opacity: 0.9;}
.hvr_opa1_col:hover{opacity: 1;}
.hvr_opa0_col:hover{opacity: 0;}

/* overflow */
.over_hide_col{overflow: hidden;}
.over_hide-x_col{overflow-x: hidden;}
.over_hide-y_col{overflow-y: hidden;}


/* other ------------------------------------------------------------------------------------------------------------------------*/
/* position */
.posi_rel_col{position: relative;}
.posi_abs_col{position: absolute;}
.posi_fix_col{position: fixed;}
.posi_sta_col{position: static;}

/* 真ん中 */
.posi_center_col{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
}