/**
 * Created by PhpStorm.
 * Date         : 2021-11-09
 * Developer    : SeHwan Hwang
 * Description  : wp_grid.css
 * ⓒ 2021. WebPlanet Co. All Rights Reserved.
 */

@charset "utf-8";


/**********************************************************************************************************************/
/**********************************************************************************************************************/
/* 레이아웃 FLEX */
/**********************************************************************************************************************/
/**********************************************************************************************************************/

.wp_wrap .wp_flex {display: flex; flex-wrap: wrap;}

.wp_wrap .wp_flex > * {width: 100%; max-width: 100%;}

.wp_wrap .wp_flex > .wp_f-1 {flex: 0 0 auto; width: 8.33333333%;}
.wp_wrap .wp_flex > .wp_f-2 {flex: 0 0 auto; width: 16.66666667%;}
.wp_wrap .wp_flex > .wp_f-3 {flex: 0 0 auto; width: 25%;}
.wp_wrap .wp_flex > .wp_f-4 {flex: 0 0 auto; width: 33.33333333%;}
.wp_wrap .wp_flex > .wp_f-5 {flex: 0 0 auto; width: 41.66666667%;}
.wp_wrap .wp_flex > .wp_f-6 {flex: 0 0 auto; width: 50%;}
.wp_wrap .wp_flex > .wp_f-7 {flex: 0 0 auto; width: 58.33333333%;}
.wp_wrap .wp_flex > .wp_f-8 {flex: 0 0 auto; width: 66.66666667%;}
.wp_wrap .wp_flex > .wp_f-9 {flex: 0 0 auto; width: 75%;}
.wp_wrap .wp_flex > .wp_f-10 {flex: 0 0 auto; width: 83.33333333%;}
.wp_wrap .wp_flex > .wp_f-11 {flex: 0 0 auto; width: 91.66666667%;}
.wp_wrap .wp_flex > .wp_f-12 {flex: 0 0 auto; width: 100%;}

@media (min-width: 576px) {
    .wp_wrap .wp_flex > .wp_f_sm-1 {flex: 0 0 auto; width: 8.33333333%;}
    .wp_wrap .wp_flex > .wp_f_sm-2 {flex: 0 0 auto; width: 16.66666667%;}
    .wp_wrap .wp_flex > .wp_f_sm-3 {flex: 0 0 auto; width: 25%;}
    .wp_wrap .wp_flex > .wp_f_sm-4 {flex: 0 0 auto; width: 33.33333333%;}
    .wp_wrap .wp_flex > .wp_f_sm-5 {flex: 0 0 auto; width: 41.66666667%;}
    .wp_wrap .wp_flex > .wp_f_sm-6 {flex: 0 0 auto; width: 50%;}
    .wp_wrap .wp_flex > .wp_f_sm-7 {flex: 0 0 auto; width: 58.33333333%;}
    .wp_wrap .wp_flex > .wp_f_sm-8 {flex: 0 0 auto; width: 66.66666667%;}
    .wp_wrap .wp_flex > .wp_f_sm-9 {flex: 0 0 auto; width: 75%;}
    .wp_wrap .wp_flex > .wp_f_sm-10 {flex: 0 0 auto; width: 83.33333333%;}
    .wp_wrap .wp_flex > .wp_f_sm-11 {flex: 0 0 auto; width: 91.66666667%;}
    .wp_wrap .wp_flex > .wp_f_sm-12 {flex: 0 0 auto; width: 100%;}
}

@media (min-width: 768px) {
    .wp_wrap .wp_flex > .wp_f_md-1 {flex: 0 0 auto; width: 8.33333333%;}
    .wp_wrap .wp_flex > .wp_f_md-2 {flex: 0 0 auto; width: 16.66666667%;}
    .wp_wrap .wp_flex > .wp_f_md-3 {flex: 0 0 auto; width: 25%;}
    .wp_wrap .wp_flex > .wp_f_md-4 {flex: 0 0 auto; width: 33.33333333%;}
    .wp_wrap .wp_flex > .wp_f_md-5 {flex: 0 0 auto; width: 41.66666667%;}
    .wp_wrap .wp_flex > .wp_f_md-6 {flex: 0 0 auto; width: 50%;}
    .wp_wrap .wp_flex > .wp_f_md-7 {flex: 0 0 auto; width: 58.33333333%;}
    .wp_wrap .wp_flex > .wp_f_md-8 {flex: 0 0 auto; width: 66.66666667%;}
    .wp_wrap .wp_flex > .wp_f_md-9 {flex: 0 0 auto; width: 75%;}
    .wp_wrap .wp_flex > .wp_f_md-10 {flex: 0 0 auto; width: 83.33333333%;}
    .wp_wrap .wp_flex > .wp_f_md-11 {flex: 0 0 auto; width: 91.66666667%;}
    .wp_wrap .wp_flex > .wp_f_md-12 {flex: 0 0 auto; width: 100%;}
}

@media (min-width: 992px) {
    .wp_wrap .wp_flex > .wp_f_lg-1 {flex: 0 0 auto; width: 8.33333333%;}
    .wp_wrap .wp_flex > .wp_f_lg-2 {flex: 0 0 auto; width: 16.66666667%;}
    .wp_wrap .wp_flex > .wp_f_lg-3 {flex: 0 0 auto; width: 25%;}
    .wp_wrap .wp_flex > .wp_f_lg-4 {flex: 0 0 auto; width: 33.33333333%;}
    .wp_wrap .wp_flex > .wp_f_lg-5 {flex: 0 0 auto; width: 41.66666667%;}
    .wp_wrap .wp_flex > .wp_f_lg-6 {flex: 0 0 auto; width: 50%;}
    .wp_wrap .wp_flex > .wp_f_lg-7 {flex: 0 0 auto; width: 58.33333333%;}
    .wp_wrap .wp_flex > .wp_f_lg-8 {flex: 0 0 auto; width: 66.66666667%;}
    .wp_wrap .wp_flex > .wp_f_lg-9 {flex: 0 0 auto; width: 75%;}
    .wp_wrap .wp_flex > .wp_f_lg-10 {flex: 0 0 auto; width: 83.33333333%;}
    .wp_wrap .wp_flex > .wp_f_lg-11 {flex: 0 0 auto; width: 91.66666667%;}
    .wp_wrap .wp_flex > .wp_f_lg-12 {flex: 0 0 auto; width: 100%;}
}

@media (min-width: 1200px) {
    .wp_wrap .wp_flex > .wp_f_xl-1 {flex: 0 0 auto; width: 8.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xl-2 {flex: 0 0 auto; width: 16.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xl-3 {flex: 0 0 auto; width: 25%;}
    .wp_wrap .wp_flex > .wp_f_xl-4 {flex: 0 0 auto; width: 33.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xl-5 {flex: 0 0 auto; width: 41.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xl-6 {flex: 0 0 auto; width: 50%;}
    .wp_wrap .wp_flex > .wp_f_xl-7 {flex: 0 0 auto; width: 58.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xl-8 {flex: 0 0 auto; width: 66.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xl-9 {flex: 0 0 auto; width: 75%;}
    .wp_wrap .wp_flex > .wp_f_xl-10 {flex: 0 0 auto; width: 83.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xl-11 {flex: 0 0 auto; width: 91.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xl-12 {flex: 0 0 auto; width: 100%;}
}

@media (min-width: 1400px) {
    .wp_wrap .wp_flex > .wp_f_xxl-1 {flex: 0 0 auto; width: 8.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xxl-2 {flex: 0 0 auto; width: 16.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xxl-3 {flex: 0 0 auto; width: 25%;}
    .wp_wrap .wp_flex > .wp_f_xxl-4 {flex: 0 0 auto; width: 33.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xxl-5 {flex: 0 0 auto; width: 41.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xxl-6 {flex: 0 0 auto; width: 50%;}
    .wp_wrap .wp_flex > .wp_f_xxl-7 {flex: 0 0 auto; width: 58.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xxl-8 {flex: 0 0 auto; width: 66.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xxl-9 {flex: 0 0 auto; width: 75%;}
    .wp_wrap .wp_flex > .wp_f_xxl-10 {flex: 0 0 auto; width: 83.33333333%;}
    .wp_wrap .wp_flex > .wp_f_xxl-11 {flex: 0 0 auto; width: 91.66666667%;}
    .wp_wrap .wp_flex > .wp_f_xxl-12 {flex: 0 0 auto; width: 100%;}
}
/**********************************************************************************************************************/
/* 레이아웃 FLEX */
/**********************************************************************************************************************/


/**********************************************************************************************************************/
/**********************************************************************************************************************/
/* 레이아웃 GRID */
/**********************************************************************************************************************/
/**********************************************************************************************************************/
.wp_wrap .wp_grid {display: grid; grid-template-columns: repeat(1, 1fr);}

.wp_wrap .wp_grid.wp_g-1 {grid-template-columns: repeat(1, 1fr);}
.wp_wrap .wp_grid.wp_g-2 {grid-template-columns: repeat(2, 1fr);}
.wp_wrap .wp_grid.wp_g-3 {grid-template-columns: repeat(3, 1fr);}
.wp_wrap .wp_grid.wp_g-4 {grid-template-columns: repeat(4, 1fr);}
.wp_wrap .wp_grid.wp_g-5 {grid-template-columns: repeat(5, 1fr);}
.wp_wrap .wp_grid.wp_g-6 {grid-template-columns: repeat(6, 1fr);}
.wp_wrap .wp_grid.wp_g-7 {grid-template-columns: repeat(7, 1fr);}
.wp_wrap .wp_grid.wp_g-8 {grid-template-columns: repeat(8, 1fr);}
.wp_wrap .wp_grid.wp_g-9 {grid-template-columns: repeat(9, 1fr);}
.wp_wrap .wp_grid.wp_g-10 {grid-template-columns: repeat(10, 1fr);}
.wp_wrap .wp_grid.wp_g-11 {grid-template-columns: repeat(11, 1fr);}
.wp_wrap .wp_grid.wp_g-12 {grid-template-columns: repeat(12, 1fr);}

.wp_wrap .wp_grid.wp_g_gap-1 {gap: 1px;}
.wp_wrap .wp_grid.wp_g_gap-2 {gap: 2px;}
.wp_wrap .wp_grid.wp_g_gap-3 {gap: 3px;}
.wp_wrap .wp_grid.wp_g_gap-4 {gap: 4px;}
.wp_wrap .wp_grid.wp_g_gap-5 {gap: 5px;}
.wp_wrap .wp_grid.wp_g_gap-6 {gap: 6px;}
.wp_wrap .wp_grid.wp_g_gap-7 {gap: 7px;}
.wp_wrap .wp_grid.wp_g_gap-8 {gap: 8px;}
.wp_wrap .wp_grid.wp_g_gap-9 {gap: 9px;}
.wp_wrap .wp_grid.wp_g_gap-10 {gap: 10px;}
.wp_wrap .wp_grid.wp_g_gap-15 {gap: 15px;}
.wp_wrap .wp_grid.wp_g_gap-20 {gap: 20px;}
.wp_wrap .wp_grid.wp_g_gap-25 {gap: 25px;}
.wp_wrap .wp_grid.wp_g_gap-30 {gap: 30px;}


@media (min-width: 576px) {
    .wp_wrap .wp_grid.wp_g_sm-1 {grid-template-columns: repeat(1, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-2 {grid-template-columns: repeat(2, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-3 {grid-template-columns: repeat(3, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-4 {grid-template-columns: repeat(4, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-5 {grid-template-columns: repeat(5, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-6 {grid-template-columns: repeat(6, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-7 {grid-template-columns: repeat(7, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-8 {grid-template-columns: repeat(8, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-9 {grid-template-columns: repeat(9, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-10 {grid-template-columns: repeat(10, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-11 {grid-template-columns: repeat(11, 1fr);}
    .wp_wrap .wp_grid.wp_g_sm-12 {grid-template-columns: repeat(12, 1fr);}

    .wp_wrap .wp_grid.wp_g_gap_sm-1 {gap: 1px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-2 {gap: 2px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-3 {gap: 3px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-4 {gap: 4px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-5 {gap: 5px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-6 {gap: 6px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-7 {gap: 7px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-8 {gap: 8px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-9 {gap: 9px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-10 {gap: 10px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-15 {gap: 15px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-20 {gap: 20px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-25 {gap: 25px;}
    .wp_wrap .wp_grid.wp_g_gap_sm-30 {gap: 30px;}
}

@media (min-width: 768px) {
    .wp_wrap .wp_grid.wp_g_md-1 {grid-template-columns: repeat(1, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-2 {grid-template-columns: repeat(2, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-3 {grid-template-columns: repeat(3, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-4 {grid-template-columns: repeat(4, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-5 {grid-template-columns: repeat(5, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-6 {grid-template-columns: repeat(6, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-7 {grid-template-columns: repeat(7, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-8 {grid-template-columns: repeat(8, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-9 {grid-template-columns: repeat(9, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-10 {grid-template-columns: repeat(10, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-11 {grid-template-columns: repeat(11, 1fr);}
    .wp_wrap .wp_grid.wp_g_md-12 {grid-template-columns: repeat(12, 1fr);}

    .wp_wrap .wp_grid.wp_g_gap_md-10 {gap: 10px;}
    .wp_wrap .wp_grid.wp_g_gap_md-15 {gap: 15px;}
    .wp_wrap .wp_grid.wp_g_gap_md-20 {gap: 20px;}
    .wp_wrap .wp_grid.wp_g_gap_md-25 {gap: 25px;}
    .wp_wrap .wp_grid.wp_g_gap_md-30 {gap: 30px;}
    .wp_wrap .wp_grid.wp_g_gap_md-35 {gap: 35px;}
    .wp_wrap .wp_grid.wp_g_gap_md-40 {gap: 40px;}
    .wp_wrap .wp_grid.wp_g_gap_md-45 {gap: 45px;}
    .wp_wrap .wp_grid.wp_g_gap_md-50 {gap: 50px;}
}

@media (min-width: 992px) {
    .wp_wrap .wp_grid.wp_g_lg-1 {grid-template-columns: repeat(1, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-2 {grid-template-columns: repeat(2, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-3 {grid-template-columns: repeat(3, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-4 {grid-template-columns: repeat(4, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-5 {grid-template-columns: repeat(5, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-6 {grid-template-columns: repeat(6, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-7 {grid-template-columns: repeat(7, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-8 {grid-template-columns: repeat(8, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-9 {grid-template-columns: repeat(9, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-10 {grid-template-columns: repeat(10, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-11 {grid-template-columns: repeat(11, 1fr);}
    .wp_wrap .wp_grid.wp_g_lg-12 {grid-template-columns: repeat(12, 1fr);}

    .wp_wrap .wp_grid.wp_g_gap_lg-10 {gap: 10px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-20 {gap: 20px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-30 {gap: 30px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-40 {gap: 40px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-50 {gap: 50px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-60 {gap: 60px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-70 {gap: 70px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-80 {gap: 80px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-90 {gap: 90px;}
    .wp_wrap .wp_grid.wp_g_gap_lg-100 {gap: 100px;}
}

@media (min-width: 1200px) {
    .wp_wrap .wp_grid.wp_g_xl-1 {grid-template-columns: repeat(1, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-2 {grid-template-columns: repeat(2, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-3 {grid-template-columns: repeat(3, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-4 {grid-template-columns: repeat(4, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-5 {grid-template-columns: repeat(5, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-6 {grid-template-columns: repeat(6, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-7 {grid-template-columns: repeat(7, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-8 {grid-template-columns: repeat(8, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-9 {grid-template-columns: repeat(9, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-10 {grid-template-columns: repeat(10, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-11 {grid-template-columns: repeat(11, 1fr);}
    .wp_wrap .wp_grid.wp_g_xl-12 {grid-template-columns: repeat(12, 1fr);}

    .wp_wrap .wp_grid.wp_g_gap_xl-10 {gap: 10px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-20 {gap: 20px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-30 {gap: 30px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-40 {gap: 40px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-50 {gap: 50px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-60 {gap: 60px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-70 {gap: 70px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-80 {gap: 80px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-90 {gap: 90px;}
    .wp_wrap .wp_grid.wp_g_gap_xl-100 {gap: 100px;}
}

@media (min-width: 1400px) {
    .wp_wrap .wp_grid.wp_g_xxl-1 {grid-template-columns: repeat(1, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-2 {grid-template-columns: repeat(2, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-3 {grid-template-columns: repeat(3, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-4 {grid-template-columns: repeat(4, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-5 {grid-template-columns: repeat(5, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-6 {grid-template-columns: repeat(6, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-7 {grid-template-columns: repeat(7, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-8 {grid-template-columns: repeat(8, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-9 {grid-template-columns: repeat(9, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-10 {grid-template-columns: repeat(10, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-11 {grid-template-columns: repeat(11, 1fr);}
    .wp_wrap .wp_grid.wp_g_xxl-12 {grid-template-columns: repeat(12, 1fr);}

    .wp_wrap .wp_grid.wp_g_gap_xxl-10 {gap: 10px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-20 {gap: 20px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-30 {gap: 30px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-40 {gap: 40px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-50 {gap: 50px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-60 {gap: 60px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-70 {gap: 70px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-80 {gap: 80px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-90 {gap: 90px;}
    .wp_wrap .wp_grid.wp_g_gap_xxl-100 {gap: 100px;}
}
/**********************************************************************************************************************/
/* 레이아웃 GRID */
/**********************************************************************************************************************/