@charset "utf-8";
/*-------------------------------------------------------------------
	파일정의 : 전역스타일 공통
	작성날짜 : YYYY-MM-DD 홍길동
	참고사항 : 가이드화 하는 것을 권장하며, 예외의 경우에만 사용한다.
	분류순서 : General > Grid Layout > Custom Color > Fixed Size & Gutter
	속성순서 : 표시 > 위치 > 넘침/흐름 > 크기/간격 > 박스모양 > 폰트/정렬 > 기타
-------------------------------------------------------------------*/

/*-------------------------------------------------------------------
    ## Responsive
-------------------------------------------------------------------*/
/* Only None (OS, Device, Screen) */
.dv-ios-only,.dv-and-only {display:none !important;}
.dv-pc-only,.dv-mobile-only {display:none !important;}

/* Only Block (OS, Device, Screen) */
.dv-ios  .dv-ios-only,
.dv-and  .dv-and-only,
.dv-pc  .dv-pc-only,
.dv-mobile  .dv-mobile-only {display:block !important;}

/*-------------------------------------------------------------------
    ## General
-------------------------------------------------------------------*/
/* IR */
.blind {position:absolute; top:-9999px; left:-9999px; z-index:0; width:1px; height:1px; overflow:hidden;}
.blind-area {display:block; position:absolute !important; left:0; right:0; top:0; bottom:0; z-index:0 !important; color:transparent; text-indent:-9999px;}

/* Body Fixed */
.is-bodyFixed {position:fixed; left:0; top:0; width:100%; height:100%; overflow:hidden;}

/* Link */
a {color:#333; text-decoration:none;}

/* Display */
.dis-ib {display:inline-block;}
.dis-b {display:block;}
.dis-n {display:none;}
.dis-t {display:table; width:100%;}
.dis-tc {display:table-cell;}

/* Align */
.align-t {vertical-align:top !important;}
.align-m {vertical-align:middle !important;}
.align-b {vertical-align:bottom !important;}
.align-l {text-align:left !important;}
.align-c {text-align:center !important;}
.align-r {text-align:right !important;}
.align-j {text-align:justify; -moz-text-align-last:justify; -webkit-text-align-last:justify; text-align-last:justify;}

/* Align - Layer */
.centered-t {position:absolute !important; left:50%; top:0; transform:translateX(-50%);}
.centered-r {position:absolute !important; right:0; top:50%; transform:translateY(-50%);}
@media all and (min-width:960px){ /* 2023.06 웹접근성 보완 : 모바일 픽스 이슈로 데스크탑에서만 오른쪽 정렬되는 클래스 생성 */
    .centered-r-desktop {position:absolute !important; right:0; top:50%; transform:translateY(-50%);}
}
.centered-b {position:absolute !important; left:50%; bottom:0; transform:translateX(-50%);}
.centered-l {position:absolute !important; left:0; top:50%; transform:translateY(-50%);}
.centered-c {position:absolute !important; left:50%; top:50%; transform:translate(-50%,-50%);}

/* Console Log */
.consoleLog {position:fixed; left:50%; top:50%; z-index:2000; transform:translate(-50%,-50%); width:70%; background-color:#fff; box-shadow:1px 1px 3px 1px rgba(0,0,0,0.2);}
.consoleLog::before {content:'Log View'; display:block; padding:5px 10px 7px; background-color:#f5f5f5; font-size:14px;}
.consoleLog .consoleLog-scroll {max-height:70vh; overflow-y:auto;}
.consoleLog .consoleLog-item {display:block; padding:5px 10px 6px; word-break:break-all; font-size:12px;}
.consoleLog .consoleLog-item + .js-consoleLog-item {border-top:1px solid #f5f5f5;}

/*-------------------------------------------------------------------
    ## Layout
-------------------------------------------------------------------*/
/* Grid Default */
.grid-wrap {overflow:hidden;}
.grid:after {clear:both; display:block; content:'';}
.grid > .col {float:left; min-height:1px;}/*  transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out 0s; -moz-transition:all 0.3s ease-out 0s; -o-transition:all 0.3s ease-out 0s; */
.grid > .col.right {float:right;}

/* Grid Table */
.grid-table {display:table; table-layout:fixed; width:100%;}
.grid-table > .col {display:table-cell;}

/* Grid Fluide (구조적인 설계를 대체하지 않음) */
.grid-fluid {max-width:100%; width:auto;}

/* 너비 - 자신의 칸수 */
.grid > .col.col-1  {width:8.33333333%;}
.grid > .col.col-2  {width:16.6666%;}
.grid > .col.col-3  {width:25%;}
.grid > .col.col-4  {width:33.3333%;}
.grid > .col.col-5  {width:41.66666667%;}
.grid > .col.col-6  {width:50%;}
.grid > .col.col-7  {width:58.33333333%;}
.grid > .col.col-8  {width:66.66666667%;}
.grid > .col.col-9  {width:75%;}
.grid > .col.col-10 {width:83.33333334%;}
.grid > .col.col-11 {width:91.66666667%;}
.grid > .col.col-12 {width:100%;}

/* 너비 - 자시 칸수 */
.grid.col-2 > .col  {width:50%;}
.grid.col-3 > .col  {width:33.3333%;}
.grid.col-3 > .col:first-child {width:33.3334%;}
.grid.col-4 > .col  {width:25%;}
.grid.col-5 > .col  {width:20%;}
.grid.col-6 > .col  {width:16.6666%;}
.grid.col-6 > .col:first-child {width:16.667%;}
.grid.col-7 > .col  {width:14.2857142%;}
.grid.col-7 > .col:first-child {width:14.2857148%;}
.grid.col-8 > .col  {width:12.5%;}
.grid.col-9 > .col  {width:11.1111%;}
.grid.col-9 > .col:first-child {width:11.1112%;}
.grid.col-10 > .col {width:10%;}
.grid.col-12 > .col {width:8.3333%;}
.grid.col-12 > .col:first-child {width:8.3334%;}

/*-------------------------------------------------------------------
    ## Custom Color
-------------------------------------------------------------------*/
/* 글자색 의미 */
.color-primary {color:#a40033 !important;}
