@charset "utf-8";

/*-------------------------------------------------------------------
    파일정의 : 유틸리티
-------------------------------------------------------------------*/

/* float */
.cf::after{ display: block; clear: both; content: ""; }

.fl-none{ float: none; }

.fl-l{ float: left; }
.fl-r{ float: right; }

/* Display */

/* Margin */
.m0{ margin: 0px !important; }

.mt0{ margin-top: 0 !important; }
.mt4{ margin-top: 0.4rem !important; }
.mt5{ margin-top: 0.5rem !important; }
.mt10{ margin-top: 1rem !important; }
.mt12{ margin-top: 1.2rem !important; }
.mt15{ margin-top: 1.5rem !important; }
.mt16{ margin-top: 1.6rem !important; }
.mt20{ margin-top: 2rem !important; }
.mt24{ margin-top: 2.4rem !important; }
.mt25{ margin-top: 2.5rem !important; }
.mt30{ margin-top: 3rem !important; }
.mt35{ margin-top: 3.5rem !important; }
.mt40{ margin-top: 4rem !important; }
.mt45{ margin-top: 4.5rem !important; }
.mt50{ margin-top: 5rem !important; }
.mt55{ margin-top: 5.5rem !important; }
.mt60{ margin-top: 6rem !important; }
.mt65{ margin-top: 6.5rem !important; }
.mt70{ margin-top: 7rem !important; }
.mt75{ margin-top: 7.5rem !important; }
.mt80{ margin-top: 8rem !important; }
.mt85{ margin-top: 8.5rem !important; }
.mt90{ margin-top: 9rem !important; }
.mt95{ margin-top: 9.5rem !important; }
.mt100{ margin-top: 10rem !important; }

.mb0{ margin-bottom: 0 !important; }
.mb4{ margin-bottom: 0.4rem !important; }
.mb5{ margin-bottom: 0.5rem !important; }
.mb10{ margin-bottom: 1rem !important; }
.mb12{ margin-bottom: 1.2rem !important; }
.mb15{ margin-bottom: 1.5rem !important; }
.mb16{ margin-bottom: 1.6rem !important; }
.mb20{ margin-bottom: 2rem !important; }
.mb24{ margin-bottom: 2.4rem !important; }
.mb25{ margin-bottom: 2.5rem !important; }
.mb30{ margin-bottom: 3rem !important; }
.mb35{ margin-bottom: 3.5rem !important; }
.mb40{ margin-bottom: 4rem !important; }
.mb45{ margin-bottom: 4.5rem !important; }
.mb50{ margin-bottom: 5rem !important; }
.mb55{ margin-bottom: 5.5rem !important; }
.mb60{ margin-bottom: 6rem !important; }
.mb65{ margin-bottom: 6.5rem !important; }
.mb70{ margin-bottom: 7rem !important; }
.mb75{ margin-bottom: 7.5rem !important; }
.mb80{ margin-bottom: 8rem !important; }
.mb85{ margin-bottom: 8.5rem !important; }
.mb90{ margin-bottom: 9rem !important; }
.mb95{ margin-bottom: 9.5rem !important; }
.mb100{ margin-bottom: 10rem !important; }

/* Padding */
.p0{ padding: 0px !important; }

.pt0{ padding-top: 0px !important; }
.pt4{ padding-top: 0.4rem !important; }
.pt5{ padding-top: 0.5rem !important; }
.pt10{ padding-top: 1rem !important; }
.pt12{ padding-top: 1.2rem !important; }
.pt15{ padding-top: 1.5rem !important; }
.pt16{ padding-top: 1.6rem !important; }
.pt20{ padding-top: 2rem !important; }
.pt24{ padding-top: 2.4rem !important; }
.pt25{ padding-top: 2.5rem !important; }
.pt30{ padding-top: 3rem !important; }
.pt35{ padding-top: 3.5rem !important; }
.pt40{ padding-top: 4rem !important; }
.pt45{ padding-top: 4.5rem !important; }
.pt50{ padding-top: 5rem !important; }
.pt55{ padding-top: 5.5rem !important; }
.pt60{ padding-top: 6rem !important; }
.pt65{ padding-top: 6.5rem !important; }
.pt70{ padding-top: 7rem !important; }
.pt75{ padding-top: 7.5rem !important; }
.pt80{ padding-top: 8rem !important; }
.pt85{ padding-top: 8.5rem !important; }
.pt90{ padding-top: 9rem !important; }
.pt95{ padding-top: 9.5rem !important; }
.pt100{ padding-top: 10rem !important; }

.pb0{ padding-bottom: 0px !important; }
.pb4{ padding-bottom: 0.4rem !important; }
.pb5{ padding-bottom: 0.5rem !important; }
.pb10{ padding-bottom: 1rem !important; }
.pb12{ padding-bottom: 1.2rem !important; }
.pb15{ padding-bottom: 1.5rem !important; }
.pb16{ padding-bottom: 1.6rem !important; }
.pb20{ padding-bottom: 2rem !important; }
.pb24{ padding-bottom: 2.4rem !important; }
.pb25{ padding-bottom: 2.5rem !important; }
.pb30{ padding-bottom: 3rem !important; }
.pb35{ padding-bottom: 3.5rem !important; }
.pb40{ padding-bottom: 4rem !important; }
.pb45{ padding-bottom: 4.5rem !important; }
.pb50{ padding-bottom: 5rem !important; }
.pb55{ padding-bottom: 5.5rem !important; }
.pb60{ padding-bottom: 6rem !important; }
.pb65{ padding-bottom: 6.5rem !important; }
.pb70{ padding-bottom: 7rem !important; }
.pb75{ padding-bottom: 7.5rem !important; }
.pb80{ padding-bottom: 8rem !important; }
.pb85{ padding-bottom: 8.5rem !important; }
.pb90{ padding-bottom: 9rem !important; }
.pb95{ padding-bottom: 9.5rem !important; }
.pb100{ padding-bottom: 10rem !important; }

/* width */
.wp100 {width: 100% !important;}

.w95 {width: 9.5rem !important; flex: none !important;}

/* Align*/
.ta-l{ text-align: left; }
.ta-c{ text-align: center; }
.ta-r{ text-align: right; }

/* 말줄임 */

/* Flexible */
.d-flex {display: flex !important;}

.flex-direction-column {flex-direction: column !important;}

.flex-wrap-wrap {flex-wrap: wrap !important;}

.justify-content-start {justify-content: flex-start !important;}
.justify-content-center {justify-content: center !important;}
.justify-content-end {justify-content: flex-end !important;}
.justify-content-between {justify-content: space-between !important;}

.align-items-start {align-items: flex-start !important;}
.align-items-end {align-items: flex-end !important;}
.align-items-center {align-items: center !important;}
.align-items-stretch {align-items: stretch !important;}

.flex-none {flex: none !important;}

.gap-0 {gap: 0 !important;}
.gap-1 {gap: 5px !important;}
.gap-2 {gap: 10px !important;}
.gap-3 {gap: 15px !important;}
.gap-4 {gap: 20px !important;}
.gap-5 {gap: 25px !important;}

.flex01{ flex: 1 0 !important; min-width: 0 !important; min-height: 0 !important;}
.flex02{ flex: 2 0 !important; min-width: 0 !important; min-height: 0 !important;}
.flex03{ flex: 3 0 !important; min-width: 0 !important; min-height: 0 !important;}
.flex04{ flex: 4 0 !important; min-width: 0 !important; min-height: 0 !important;}
.flex05{ flex: 5 0 !important; min-width: 0 !important; min-height: 0 !important;}
.flex06{ flex: 6 0 !important; min-width: 0 !important; min-height: 0 !important;}

/*-------------------------------------------------------------------
    @Only (Display 스타일은 다양하므로 숨길경우만 사용)
-------------------------------------------------------------------*/
/* Device */
@media screen and (min-width: 1131px){
    .hide-pc {
        display: none !important;
    }
}
@media screen and (max-width: 1130px) and (min-width: 641px){
    .hide-tablet {
        display: none !important;
    }
}
@media screen and (max-width: 640px){
    .hide-mobile {
        display: none !important;
    }
}

/*-------------------------------------------------------------------
    @Color Set
    - 배경: bg-, 텍스트: txt-, 라인: line-
    - 밝은: -light, 어두운: -dark, 더 밝은/어두운: ~er
-------------------------------------------------------------------*/
/* 기본 */
.bg-none {background-color:transparent !important;}
.txt-none {color:transparent !important;}
.line-none {border-color:transparent !important;}
 
/* 배경 */

/* 텍스트 */
.txt-green {color: #0A6E23 !important;}
.txt-dark {color: #333333 !important;}
.txt-blue {color: #3375D7 !important;}
.txt-red {color: #ED1A3B !important;}

/* 라인 */

@media screen and (max-width: 1449px) {}

@media screen and (max-width: 1129px) {
    /*-------------------------------------------------------------------
        @Only (Display 스타일은 다양하므로 숨길경우만 사용)
    -------------------------------------------------------------------*/
    /* Device */
    .hide-pc {display: block !important;}

    .hide-mo {display: none !important;}
}

@media screen and (max-width: 959px) {}

@media screen and (max-width: 639px) {
    /*-------------------------------------------------------------------
        @Only (Display 스타일은 다양하므로 숨길경우만 사용)
    -------------------------------------------------------------------*/
    /* Device */
    /* .hide-pc {display: none !important;} */
}