@charset "UTF-8";

/* 12er Raster */

.show2000, .show1200, .show1024, .show768, .show600, .show550 { display: none; }

.row { display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: flex; justify-content: space-between; flex-flow: row wrap; }
.row.left { justify-content: flex-start; }
.row.right { justify-content: flex-end; }

.col_l_1 { width: calc(1/12*100%); }
.col_l_2 { width: calc(2/12*100%); }
.col_l_3 { width: calc(3/12*100%); }
.col_l_4 { width: calc(4/12*100%); }
.col_l_5 { width: calc(5/12*100%); }
.col_l_6 { width: calc(6/12*100%); }
.col_l_7 { width: calc(7/12*100%); }
.col_l_8 { width: calc(8/12*100%); }
.col_l_9 { width: calc(9/12*100%); }
.col_l_10 { width: calc(10/12*100%); }
.col_l_11 { width: calc(11/12*100%); }
.col_l_12 { width: 100%; }

.col_l_sp_1 { width: calc(1/12*100% - (1 - 1/12)*50px); }
.col_l_sp_2 { width: calc(2/12*100% - (1 - 2/12)*50px); }
.col_l_sp_3 { width: calc(3/12*100% - (1 - 3/12)*50px); }
.col_l_sp_4 { width: calc(4/12*100% - (1 - 4/12)*50px); }
.col_l_sp_5 { width: calc(5/12*100% - (1 - 5/12)*50px); }
.col_l_sp_6 { width: calc(6/12*100% - (1 - 6/12)*50px); }
.col_l_sp_7 { width: calc(7/12*100% - (1 - 7/12)*50px); }
.col_l_sp_8 { width: calc(8/12*100% - (1 - 8/12)*50px); }
.col_l_sp_9 { width: calc(9/12*100% - (1 - 9/12)*50px); }
.col_l_sp_10 { width: calc(10/12*100% - (1 - 10/12)*50px); }
.col_l_sp_11 { width: calc(11/12*100% - (1 - 11/12)*50px); }

.content .col_l_sp_1 { width: calc(1/12*100% - (1 - 1/12)*30px); }
.content .col_l_sp_2 { width: calc(2/12*100% - (1 - 2/12)*30px); }
.content .col_l_sp_3 { width: calc(3/12*100% - (1 - 3/12)*30px); }
.content .col_l_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.content .col_l_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.content .col_l_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.content .col_l_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.content .col_l_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.content .col_l_sp_9 { width: calc(9/12*100% - (1 - 9/12)*30px); }
.content .col_l_sp_10 { width: calc(10/12*100% - (1 - 10/12)*30px); }
.content .col_l_sp_11 { width: calc(11/12*100% - (1 - 11/12)*30px); }

.col_l_5_10 { width: 20%; }
.col_l_sp_5_10 { width: calc(2/10*100% - (1 - 2/10)*50px); }

/* Breackpoints */

@media all and ( min-width: 1800px ) {

.col_xl_1 { width: calc(1/12*100%); }
.col_xl_2 { width: calc(2/12*100%); }
.col_xl_3 { width: calc(3/12*100%); }
.col_xl_4 { width: calc(4/12*100%); }
.col_xl_5 { width: calc(5/12*100%); }
.col_xl_6 { width: calc(6/12*100%); }
.col_xl_7 { width: calc(7/12*100%); }
.col_xl_8 { width: calc(8/12*100%); }
.col_xl_9 { width: calc(9/12*100%); }
.col_xl_10 { width: calc(10/12*100%); }
.col_xl_11 { width: calc(11/12*100%); }
.col_xl_12 { width: 100%; }

.col_xl_sp_1 { width: calc(1/12*100% - (1 - 1/12)*50px); }
.col_xl_sp_2 { width: calc(2/12*100% - (1 - 2/12)*50px); }
.col_xl_sp_3 { width: calc(3/12*100% - (1 - 3/12)*50px); }
.col_xl_sp_4 { width: calc(4/12*100% - (1 - 4/12)*50px); }
.col_xl_sp_5 { width: calc(5/12*100% - (1 - 5/12)*50px); }
.col_xl_sp_6 { width: calc(6/12*100% - (1 - 6/12)*50px); }
.col_xl_sp_7 { width: calc(7/12*100% - (1 - 7/12)*50px); }
.col_xl_sp_8 { width: calc(8/12*100% - (1 - 8/12)*50px); }
.col_xl_sp_9 { width: calc(9/12*100% - (1 - 9/12)*50px); }
.col_xl_sp_10 { width: calc(10/12*100% - (1 - 10/12)*50px); }
.col_xl_sp_11 { width: calc(11/12*100% - (1 - 11/12)*50px); }

}

@media all and ( max-width: 1400px ) {

.col_m_1 { width: calc(1/12*100%); }
.col_m_2 { width: calc(2/12*100%); }
.col_m_3 { width: calc(3/12*100%); }
.col_m_4 { width: calc(4/12*100%); }
.col_m_5 { width: calc(5/12*100%); }
.col_m_6 { width: calc(6/12*100%); }
.col_m_7 { width: calc(7/12*100%); }
.col_m_8 { width: calc(8/12*100%); }
.col_m_9 { width: calc(9/12*100%); }
.col_m_10 { width: calc(10/12*100%); }
.col_m_11 { width: calc(11/12*100%); }
.col_m_12 { width: 100%; }

.col_m_sp_1 { width: calc(1/12*100% - (1 - 1/12)*50px); }
.col_m_sp_2 { width: calc(2/12*100% - (1 - 2/12)*50px); }
.col_m_sp_3 { width: calc(3/12*100% - (1 - 3/12)*50px); }
.col_m_sp_4 { width: calc(4/12*100% - (1 - 4/12)*50px); }
.col_m_sp_5 { width: calc(5/12*100% - (1 - 5/12)*50px); }
.col_m_sp_6 { width: calc(6/12*100% - (1 - 6/12)*50px); }
.col_m_sp_7 { width: calc(7/12*100% - (1 - 7/12)*50px); }
.col_m_sp_8 { width: calc(8/12*100% - (1 - 8/12)*50px); }
.col_m_sp_9 { width: calc(9/12*100% - (1 - 9/12)*50px); }
.col_m_sp_10 { width: calc(10/12*100% - (1 - 10/12)*50px); }
.col_m_sp_11 { width: calc(11/12*100% - (1 - 11/12)*50px); }

.content .col_m_sp_1 { width: calc(1/12*100% - (1 - 1/12)*30px); }
.content .col_m_sp_2 { width: calc(2/12*100% - (1 - 2/12)*30px); }
.content .col_m_sp_3 { width: calc(3/12*100% - (1 - 3/12)*30px); }
.content .col_m_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.content .col_m_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.content .col_m_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.content .col_m_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.content .col_m_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.content .col_m_sp_9 { width: calc(9/12*100% - (1 - 9/12)*30px); }
.content .col_m_sp_10 { width: calc(10/12*100% - (1 - 10/12)*30px); }
.content .col_m_sp_11 { width: calc(11/12*100% - (1 - 11/12)*30px); }

}

@media all and ( max-width: 1024px ) {

.col_s_1 { width: calc(1/12*100%); }
.col_s_2 { width: calc(2/12*100%); }
.col_s_3 { width: calc(3/12*100%); }
.col_s_4 { width: calc(4/12*100%); }
.col_s_5 { width: calc(5/12*100%); }
.col_s_6 { width: calc(6/12*100%); }
.col_s_7 { width: calc(7/12*100%); }
.col_s_8 { width: calc(8/12*100%); }
.col_s_9 { width: calc(9/12*100%); }
.col_s_10 { width: calc(10/12*100%); }
.col_s_11 { width: calc(11/12*100%); }
.col_s_12 { width: 100%; }

.col_s_sp_1 { width: calc(1/12*100% - (1 - 1/12)*30px); }
.col_s_sp_2 { width: calc(2/12*100% - (1 - 2/12)*30px); }
.col_s_sp_3 { width: calc(3/12*100% - (1 - 3/12)*30px); }
.col_s_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.col_s_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.col_s_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.col_s_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.col_s_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.col_s_sp_9 { width: calc(9/12*100% - (1 - 9/12)*30px); }
.col_s_sp_10 { width: calc(10/12*100% - (1 - 10/12)*30px); }
.col_s_sp_11 { width: calc(11/12*100% - (1 - 11/12)*30px); }

.content .col_s_sp_1 { width: calc(1/12*100% - (1 - 1/12)*30px); }
.content .col_s_sp_2 { width: calc(2/12*100% - (1 - 2/12)*30px); }
.content .col_s_sp_3 { width: calc(3/12*100% - (1 - 3/12)*30px); }
.content .col_s_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.content .col_s_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.content .col_s_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.content .col_s_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.content .col_s_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.content .col_s_sp_9 { width: calc(9/12*100% - (1 - 9/12)*30px); }
.content .col_s_sp_10 { width: calc(10/12*100% - (1 - 10/12)*30px); }
.content .col_s_sp_11 { width: calc(11/12*100% - (1 - 11/12)*30px); }

.content .col_s_12 { width: 100%; }

}

@media all and ( max-width: 768px ) {

.col_xs_1 { width: calc(1/12*100%); }
.col_xs_2 { width: calc(2/12*100%); }
.col_xs_3 { width: calc(3/12*100%); }
.col_xs_4 { width: calc(4/12*100%); }
.col_xs_5 { width: calc(5/12*100%); }
.col_xs_6 { width: calc(6/12*100%); }
.col_xs_7 { width: calc(7/12*100%); }
.col_xs_8 { width: calc(8/12*100%); }
.col_xs_9 { width: calc(9/12*100%); }
.col_xs_10 { width: calc(10/12*100%); }
.col_xs_11 { width: calc(11/12*100%); }
.col_xs_12 { width: 100%; }
  
.col_xs_sp_1 { width: calc(1/12*100% - (1 - 1/12)*30px); }
.col_xs_sp_2 { width: calc(2/12*100% - (1 - 2/12)*30px); }
.col_xs_sp_3 { width: calc(3/12*100% - (1 - 3/12)*30px); }
.col_xs_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.col_xs_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.col_xs_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.col_xs_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.col_xs_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.col_xs_sp_9 { width: calc(9/12*100% - (1 - 9/12)*30px); }
.col_xs_sp_10 { width: calc(10/12*100% - (1 - 10/12)*30px); }
.col_xs_sp_11 { width: calc(11/12*100% - (1 - 11/12)*30px); }

.content .col_xs_sp_1 { width: calc(1/12*100% - (1 - 1/12)*30px); }
.content .col_xs_sp_2 { width: calc(2/12*100% - (1 - 2/12)*30px); }
.content .col_xs_sp_3 { width: calc(3/12*100% - (1 - 3/12)*30px); }
.content .col_xs_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.content .col_xs_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.content .col_xs_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.content .col_xs_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.content .col_xs_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.content .col_xs_sp_9 { width: calc(9/12*100% - (1 - 9/12)*30px); }
.content .col_xs_sp_10 { width: calc(10/12*100% - (1 - 10/12)*30px); }
.content .col_xs_sp_11 { width: calc(11/12*100% - (1 - 11/12)*30px); }
.content .col_xs_12 { width: 100%; }

}

@media all and ( max-width: 550px ) {

.col_xxs_4 { width: calc(4/12*100%); }
.col_xxs_5 { width: calc(5/12*100%); }
.col_xxs_6 { width: calc(6/12*100%); }
.col_xxs_7 { width: calc(7/12*100%); }
.col_xxs_8 { width: calc(8/12*100%); }
.col_xxs_9 { width: calc(9/12*100%); }
.col_xxs_10 { width: calc(10/12*100%); }
.col_xxs_11 { width: calc(11/12*100%); }
.col_xxs_12 { width: 100%; }
  
.col_xxs_sp_4 { width: calc(4/12*100% - (1 - 4/12)*20px); }
.col_xxs_sp_5 { width: calc(5/12*100% - (1 - 5/12)*20px); }
.col_xxs_sp_6 { width: calc(6/12*100% - (1 - 6/12)*20px); }
.col_xxs_sp_7 { width: calc(7/12*100% - (1 - 7/12)*20px); }
.col_xxs_sp_8 { width: calc(8/12*100% - (1 - 8/12)*20px); }

.content .col_xxs_sp_4 { width: calc(4/12*100% - (1 - 4/12)*30px); }
.content .col_xxs_sp_5 { width: calc(5/12*100% - (1 - 5/12)*30px); }
.content .col_xxs_sp_6 { width: calc(6/12*100% - (1 - 6/12)*30px); }
.content .col_xxs_sp_7 { width: calc(7/12*100% - (1 - 7/12)*30px); }
.content .col_xxs_sp_8 { width: calc(8/12*100% - (1 - 8/12)*30px); }
.content .col_xxs_12 { width: 100%; }
  
}