@charset "utf-8";
/*-------------------------------------------------------------------
    파일정의 : 전역스타일 공통
    작성날짜 : 2020-04-13 이형석
    참고사항 : 공통으로 사용 할 요소들의 형태 정의 
    분류순서 : General(버튼, 테이블, 폼, )
    속성순서 : 표시 > 위치 > 넘침/흐름 > 크기/간격 > 박스모양 > 폰트/정렬 > 기타
-------------------------------------------------------------------*/
/*-------------------------------------------------------------------
 css 수정 /삭제시 주석 작성 방식 (Common.css 파일은 수정 시 팀원 전체 공지 후 등록 수정 한다.)
 2013.01.01(수정/삭제일자) | 홍길동(수정/삭제자) | 디자인 변경으로 인한 기존 칼라값 변경(수정/삭제사유) 
-------------------------------------------------------------------*/
/*-------------------------------------------------------------------
    ## Reset
-------------------------------------------------------------------*/
/*@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700,800|Noto+Sans+KR:100,400,500,700&display=swap&subset=korean');*/

*{ margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
body { height:100%; font-size:14px; font-family:'Pretendard', sans-serif;  background:#222; color:#333;}/* default 폰트 정의 내용 */
h1, h2, h3, h4, h5, h6 { color:inherit; font-family:inherit; font-size:inherit; font-weight:inherit; letter-spacing:inherit; line-height:inherit;}
span,div,a,b,label {color:inherit; font-family:inherit;font-size:inherit; font-weight:inherit; letter-spacing:inherit; line-height:inherit;}
button { border:0; background:none; outline:none;}
table { border-collapse:collapse; border:0}
/* 그누보드 사용 시 아래 코드 주석 처리*/
a { text-decoration:none;}
em { font-style:normal;}
ul,ol,li,dl,dt,dd { list-style:none;}
button { cursor:pointer; border:0;}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:inherit;}
input[type=text],input[type=password], textarea {
-webkit-transition:all 0.30s ease-in-out;
-moz-transition:all 0.30s ease-in-out;
-ms-transition:all 0.30s ease-in-out;
-o-transition:all 0.30s ease-in-out;
outline:none;
}
input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {
-webkit-box-shadow:0 0 5px #9ed4ff;
-moz-box-shadow:0 0 5px #9ed4ff;
box-shadow:0 0 5px #9ed4ff;
border:1px solid #558ab7 !important;
}

/*-------------------------------------------------------------------
    ## Settings - structure
-------------------------------------------------------------------*/
.clear { clear:both;}
.inner { position:relative; width:1200px; margin:0 auto;} /*width 값은 해당 사이트 디자인 별 적용 변경 사용*/
.inner:after { display:block; visibility:hidden; clear:both; content:""}
/*-------------------------------------------------------------------
    ## Settings - 사용자 정의 1
-------------------------------------------------------------------*/ 
/* Display */
.dis-ib {display:inline-block;}
.dis-b {display:block;}
.dis-i {display:inline;}
.dis-n {display:none;}
.dis-f {display:-webkit-box;display:-ms-flexbox;display:flex;}
.dv-mobile .dis-ib-mo {display:inline-block;}
.dv-mobile .dis-b-mo {display:block;}
.dv-pc .dis-ib-pc {display:inline-block;}
.dv-pc .dis-b-pc {display:block;}
 
/* Margin */
.mar-t0 {margin-top:0 !important;}
.mar-r0 {margin-right:0 !important;}
.mar-b0 {margin-bottom:0 !important;}
.mar-l0 {margin-left:0 !important;}
 
/* Padding */
.pad-t0 {padding-top:0 !important}
.pad-r0 {padding-right:0 !important}
.pad-b0 {padding-bottom:0 !important}
.pad-l0 {padding-left:0 !important}
 
/* Border */
.bdr-t0 {border-top-width:0 !important;}
.bdr-r0 {border-right-width:0 !important;}
.bdr-b0 {border-bottom-width:0 !important;}
.bdr-l0 {border-left-width:0 !important;}
.bdr-1 {border:1px solid #ddd !important;}
 
/* Align - Inline */
.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 - Position */
.pos-ct {position:absolute !important; left:50%; top:0; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%);}
.pos-cr {position:absolute !important; right:0; top:50%; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%);}
.pos-cb {position:absolute !important; left:50%; bottom:0; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%);}
.pos-cl {position:absolute !important; left:0; top:50%; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%);}
.pos-cc {position:absolute !important; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%);}

/*-------------------------------------------------------------------
    ## Settings - 사용자 정의 2
-------------------------------------------------------------------*/
/* color primary background*/
.primary { background:#0676bb !important;}
.gray_dark { background:#222 !important;}
.gray { background:#666 !important;}
.gray_light { background:#ddd !important;}
.white { background:#fff!important;}
/* color secondary background*/
.green{ background: #32ba94 !important;}
.blue{ background: #34a1fd !important;}
.yellow{ background: #fdbd12 !important;}
.red{ background: #f44336 !important;}
.gray_second{ background: #333333 !important;}
.green_light{ background: #bef2d5 !important;}
.blue_light{ background: #d5e2f9 !important;}
.yellow_light{ background: #ffeea1 !important;}
.red_light{ background: #fed2d2 !important;}
/* font */

/*-------------------------------------------------------------------
    ## General
-------------------------------------------------------------------*/
/* button */
.btn_wrap{ display:inline-block; margin: 30px 0 0;}
.btn_wrap > * { margin: 0 4px;}
.btn-type01{position:relative; display:inline-block; text-align:center; width:240px; padding:0 20px;line-height:50px;  color:#fff; font-size:16px;}
.btn-type02{display:inline-block; min-width:590px; padding:0 20px; border:1px solid #ddd; line-height:50px; height:50px;font-size:16px; background: #fff !important;}
.btn-type02.gray { border:1px solid #666; color:#666;}
.btn-type02.primary { border:1px solid #d72041; color:#d72041;}
.btn-type02.blue { border:1px solid #34a1fd; color:#34a1fd;}
.btn-type02 span { float:right; line-height:50px;}
.btn-type03{display:inline-block; min-width:400px; padding:0 20px; font-weight:700; line-height:60px;color:#fff; font-size:18px; text-align:center;}
.btn-type04{display:inline-block; padding:0 20px; color:#fff;line-height:30px; height:30px; text-align:center; border-radius:3px;}
.btn-type05{display:inline-block; width:100%; padding:0 20px; font-weight:700; line-height:60px;color:#fff; font-size:18px; text-align:center;}

/* table */
table.tbl01{width:100%; border:1px solid #ddd; border-top:2px solid #333; margin-bottom: 20px;}
table.tbl01 caption{display:none;}
table.tbl01 thead th{padding:10px 20px; text-align:center; font-weight:700; color:#333; border:1px solid #ddd; background:#f9f9f9; vertical-align:middle; word-break:keep-all;}
table.tbl01 tbody td{padding:10px 20px; text-align:center; border:1px solid #ddd; word-break:keep-all;}
table.tbl01 tbody td strong{font-weight:700; color:#0676bb;}
table.tbl01 tbody th{padding:10px 20px; text-align:center; font-weight:700; color:#333; border:1px solid #ddd; background:#f9f9f9; vertical-align:middle; word-break:keep-all;}
table.tbl01 tbody th strong{color:#0676bb;}
table.tbl02{width:100%; border:1px solid #ddd; border-top:2px solid #333;margin-bottom: 20px;}
table.tbl02 caption{display:none;}
table.tbl02 thead th{padding:15px 5px; text-align:center; font-weight:700; color:#333; border:1px solid #ddd; background:#f8f6f5; vertical-align:middle; word-break:keep-all;}
table.tbl02.low_line thead th{line-height: 20px;padding:10px 5px;}
table.tbl02 thead td{padding:10px 19px 9px; text-align:left; border:1px solid #ddd;}
table.tbl02 tbody td{padding:10px 5px; text-align:center; border:1px solid #ddd; vertical-align:middle; word-break:keep-all;}
table.tbl02 tbody td .tbl02_select_wrap select { width:130px;}/*기본으로 사용 하되 컨텐츠에 따라 Select width 값을 contents_guide에서 변경 사용 */

/* checkbox radiobox */
.hide { display: none; }
input[type="checkbox"] + .far,
input[type="checkbox"] + label > .far,
input[type="radio"] + .far,
input[type="radio"] + label > .far { cursor: pointer; }

input[type="checkbox"] + .fa-circle:before,
input[type="checkbox"] + label > .fa-circle:before,
input[type="radio"] + .fa-circle:before,
input[type="radio"] + label > .fa-circle:before { content: "\f111";} /* Circle Unchecked */
input[type="checkbox"] + .fa-square:before,
input[type="checkbox"] + label > .fa-square:before,
input[type="radio"] + .fa-square:before,
input[type="radio"] + label > .fa-square:before { content: "\f0c8"; } /* Square Unchecked */

input[type="checkbox"]:checked + .fa-circle:before,
input[type="checkbox"]:checked + label > .fa-circle:before,
input[type="radio"]:checked + .fa-circle:before,
input[type="radio"]:checked + label > .fa-circle:before { content: "\f058";color:#34a1fd;} /* Circle Checked */
input[type="checkbox"]:checked + .fa-square:before,
input[type="checkbox"]:checked + label > .fa-square:before,
input[type="radio"]:checked + .fa-square:before,
input[type="radio"]:checked + label > .fa-square:before { content: "\f14a";} /* Square Checked */

/******************************
bullet 
******************************/
dl{ clear: both;}
dl.dlList01 dt{font-weight:700; color:#34a1fd; margin:32px 0 0;}
dl.dlList01 dt:first-child{margin:0;}
dl.dlList01 dd{margin:5px 0 5px; word-break:keep-all;}
dl.dlList01 dd.dlList01Bullet01 span{position:relative; display:block; padding:0 0 0 14px;}
dl.dlList01 dd.dlList01Bullet01 span:after{content:""; display:block; width:4px; height:4px; background:#34a1fd; position:absolute; top:8px; left:0;}
dl.dlList01 dd.dlList01Bullet02 > span{position:relative; display:block; padding:0 0 0 25px;}
dl.dlList01 dd.dlList01Bullet02 > span strong{position:absolute; top:0; left:0; font-weight:700; color:#34a1fd;}
.indent{padding-left:15px;}