@charset "utf-8";

/*************************************************************************************************
 
 *  Web Font
 
 *************************************************************************************************/

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.6/dist/web/static/pretendard.css");

/* 에스코어드림 */
/* @import url('https://webfontworld.github.io/SCoreDream/SCoreDream.css'); */




/* Material 아이콘  폰트 */
/* <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" /> */
/* fallback */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 100 700;
  src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v154/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsLjBuVY.woff2) format('woff2');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
body {
  --google-font-color-materialiconstwotone:none;
}

/*************************************************************************************************
 
 *  Reset Css
 
 *************************************************************************************************/

:root {
    /* 변수명 이용 예시 -> background-color: var(--background-color); */

    /* Typing */
    --font-family: 'Roboto', "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, Roboto, "Apple SD Gothic Neo", "Noto Sans KR", "Segoe UI", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;

    --font-pretendard: "Pretendard Variable", "Noto Sans JP", Pretendard, -apple-system, BlinkMacSystemFont, Roboto, "Noto Sans SC", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;

    --font-sCoreDream: "SCoreDream", "Pretendard Variable", "Noto Sans JP", Pretendard, -apple-system, BlinkMacSystemFont, Roboto, "Noto Sans SC", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;

    --font-material: 'Material Symbols Outlined', 'Roboto', "Noto Sans KR", sans-serif;


    /* color */
    --black: #111;
    --black2: #222;
    --black3: #333;
    --black4: #444;
    --black5: #555;
    --black6: #666;
    --black7: #777;


    --gray-text: #666666;
    --gray-text2: #9B9B9B;

    --gray-line: #ddd;
    --gray-line2: #E6E6E6;
    --gray-line3: #fafafa;

    --gray-bg-welcome: #F1F9FD;
    --gray-bg-table: #F9FAFB;
    --gray-bg-app: #F1F5F9;

    --red-color: #ed5565;
    --red2-color: #da4453;
    --green-color: #a0d468;
    --green2-color: #8cc152;
    --mint-color: #48cfad;
    --mint2-color: #37bc9b;
    --blue-color: #5d9cec;
    --blue2-color: #4a89dc;


    /* 공통 색깔 변수 */
    --primary-navy-deep: #000137;
    --primary-navy: #02055a;
    --primary-blue: #02198b;
    --primary-blue2: #253da1;
    --primary-sky: #b0dbf1;
    --primary-blue-light: #EFF1FD;

    --mainBtnNavy: #01055B;
}
  

html {scroll-behavior: smooth; width: 100%; height: 100%;}
body{overflow-x: hidden; width: 100%; height: 100%;}

/* common */
html,body,div,span,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,blockquote,p,address,pre,cite,form,fieldset,table,th,td,legend,label, header, footer, section, article, figure, main{margin:0;padding:0;border:0;font-size:15px; font-weight: 400; letter-spacing:-.03em; color: var(--black-text); font-family: var(--font-family); box-sizing: border-box; line-height: 1.3;}
input,textarea,select{margin:0;padding:0; border: 0; box-sizing: border-box;}

a{text-decoration:none; cursor: pointer; color: #090D2B; box-sizing: border-box;}

body{color:#776f67;letter-spacing:0;-webkit-text-size-adjust:none}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
fieldset,img,abbr,acronym,label{border:0 none}
.blind,legend{display:block;overflow:hidden;position:absolute;top:-1000em;left:0}
blockquote:before,blockquote:after,q:before,q:after{content:''}
ol,ul,dl{list-style:none}
hr{display:none}
fieldset{border:0}
label,select,input,textarea{vertical-align:middle}
img{vertical-align:top; -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop')"; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop'); max-width: 100%;}
button {background:none; margin:0; padding:0; border:0 none; cursor:pointer;}

p,
strong,
b,
em,
span,
a{font-family: inherit; font-weight: inherit; font-size: inherit; color: inherit; line-height: inherit;}

.txt_cut1,.txt_cut2,.txt_cut3,.txt_cut4,.txt_cut5{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-box-orient:vertical;word-wrap:break-word}
.txt_cut1{-webkit-line-clamp:1/* 라인수 */}
.txt_cut2{-webkit-line-clamp:2/* 라인수 */}
.txt_cut3{-webkit-line-clamp:3/* 라인수 */}
.txt_cut4{-webkit-line-clamp:4/* 라인수 */}
.txt_cut5{-webkit-line-clamp:5/* 라인수 */}

.autoH:after{display:block;clear:both;content:' '}

address,caption,em,cite{font-weight:normal;font-style:normal}
ins{text-decoration:none}
del{text-decoration:line-through}

table{border-collapse:separate;border:0 none;border-spacing:0}
caption{font-weight:normal;text-align:left; display: none;}

.bs{box-shadow:0 3px 0 rgba(0,0,0,.2)}

input,
select{
  /* appearance: none;
  -webkit-appearance: none;
  -webkit-border-radius: 0; */
}
select {
  -webkit-appearance: none;
  -moz-appearance: none; 
  appearance: none;

  /*화살표 배경 넣기*/
  background: #fff url('../images/ic_select_arrow.svg') no-repeat right 10px center;
  padding-right: 32px;
}

select::-ms-expand{
  /* 화살표 없애기 for IE10, 11*/ 
  display:none;
}

input,
input:focus,
select,
a,
textarea{font-family: var(--font-family);}

/* number 타입 숫자 컨트롤 버튼 제거 */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {-webkit-appearance: none;  margin: 0;}
input[type=number] { -moz-appearance: textfield;}
input[type=button] { -webkit-appearance: none; }

/* input {
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    -webkit-border-radius:0
} */


@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}


.textL{text-align: left;}
.textC{text-align: center;}
.textR{text-align: right;}





/*************************************************************************************************
 
 *  Etc Style
 
 *************************************************************************************************/
.clearfix {clear:both;height:40px;}
hr.border {width:14px;height:1px;display:inline-block;text-align:center;margin:20px 0;background:#036;}
.blind {visibility:hidden;position:absolute;top:0;left:0;width:0;height:0;font-size:0;line-height:0;}
.accessibilityWrap dd a {display:block;position:absolute;top:-10000px;left:0;z-index:10000;width:100%;background:#333;color:#fff;font-size:16px;text-align:center;padding:20px 0;}
.accessibilityWrap dd a:focus {top:0;}
.center {text-align:center;}






/*************************************************************************************************
 
 *  Gab
 
 *************************************************************************************************/
 .gab10 {width: 100%; height: 10px;}
 .gab15 {width: 100%; height: 15px;}
 .gab20 {width: 100%; height: 20px;}
 .gab25 {width: 100%; height: 25px;}
 .gab30 {width: 100%; height: 30px;}
 .gab35 {width: 100%; height: 35px;}
 .gab40 {width: 100%; height: 40px;}
 .gab50 {width: 100%; height: 50px;}
 .gab60 {width: 100%; height: 60px;}
 .gab70 {width: 100%; height: 70px;}
 .gab80 {width: 100%; height: 80px;}
 .gab90 {width: 100%; height: 90px;}
 .gab100 {width: 100%; height: 100px;}
 
 .gab-w-5 {display: inline-block; vertical-align: middle; height: 1px; width: 5px;}
 .gab-w-10 {display: inline-block; vertical-align: middle; height: 1px; width: 10px;}
 .gab-w-15 {display: inline-block; vertical-align: middle; height: 1px; width: 15px;}
 .gab-w-20 {display: inline-block; vertical-align: middle; height: 1px; width: 20px;}
 .gab-w-25 {display: inline-block; vertical-align: middle; height: 1px; width: 25px;}
 .gab-w-30 {display: inline-block; vertical-align: middle; height: 1px; width: 30px;}
 .gab-w-35 {display: inline-block; vertical-align: middle; height: 1px; width: 35px;}
 .gab-w-40 {display: inline-block; vertical-align: middle; height: 1px; width: 40px;}
 .gab-w-45 {display: inline-block; vertical-align: middle; height: 1px; width: 45px;}
 .gab-w-50 {display: inline-block; vertical-align: middle; height: 1px; width: 50px;}
 
 
 @media screen and (max-width:1000px){	
     .gab10 {width: 100%; height: 10px;}
     .gab15 {width: 100%; height: 12px;}
     .gab20 {width: 100%; height: 15px;}
     .gab25 {width: 100%; height: 18px;}
     .gab30 {width: 100%; height: 20px;}
     .gab35 {width: 100%; height: 20px;}
     .gab40 {width: 100%; height: 20px;}
     .gab50 {width: 100%; height: 25px;}
     .gab60 {width: 100%; height: 30px;}
     .gab70 {width: 100%; height: 35px;}
     .gab80 {width: 100%; height: 40px;}
     .gab90 {width: 100%; height: 45px;}
     .gab100 {width: 100%; height: 50px;}
 
     .gab-w-5 {width: 2px;}
     .gab-w-10 {width: 5px;}
     .gab-w-15 {width: 8px;}
     .gab-w-20 {width: 13px;}
     .gab-w-25 {width: 15px;}
     .gab-w-30 {width: 18px;}
     .gab-w-35 {width: 20px;}
     .gab-w-40 {width: 20px;}
     .gab-w-45 {width: 25px;}
     .gab-w-50 {width: 28px;}
 }
 
 /* MARGIN */
 .mgA0 { margin:0; }
 
 .mgT0 { margin-top:0px }
 .mgT5 { margin-top:5px }
 .mgT10 { margin-top:10px }
 .mgT15 { margin-top:15px }
 .mgT20 { margin-top:20px }
 .mgT25 { margin-top:25px }
 .mgT30 { margin-top:30px }
 .mgT35 { margin-top:35px }
 .mgT40 { margin-top:40px }
 .mgT45 { margin-top:45px }
 .mgT50 { margin-top:50px }
 .mgT55 { margin-top:55px }
 .mgT60 { margin-top:60px }
 .mgT65 { margin-top:65px }
 .mgT70 { margin-top:70px }
 
 .mgL5 { margin-left:5px }
 .mgL10 { margin-left:10px }
 .mgL15 { margin-left:15px }
 .mgL20 { margin-left:20px }
 .mgL25 { margin-left:25px }
 .mgL30 { margin-left:30px }
 .mgL35 { margin-left:35px }
 .mgL40 { margin-left:40px }
 .mgL45 { margin-left:45px }
 .mgL50 { margin-left:50px }
 .mgL55 { margin-left:55px }
 .mgL60 { margin-left:60px }
 .mgL65 { margin-left:65px }
 
 .mgR1 { margin-right:1px }
 .mgR5 { margin-right:5px }
 .mgR10 { margin-right:10px }
 .mgR15 { margin-right:15px }
 .mgR20 { margin-right:20px }
 .mgR25 { margin-right:25px }
 .mgR30 { margin-right:30px }
 .mgR35 { margin-right:35px }
 .mgR40 { margin-right:40px }
 .mgR45 { margin-right:45px }
 .mgR50 { margin-right:50px }
 .mgR55 { margin-right:55px }
 .mgR60 { margin-right:60px }
 .mgR80 { margin-right:80px }
 
 .mgB5 { margin-bottom:5px }
 .mgB10 { margin-bottom:10px }
 .mgB15 { margin-bottom:15px }
 .mgB20 { margin-bottom:20px }
 .mgB25 { margin-bottom:25px }
 .mgB30 { margin-bottom:30px }
 .mgB35 { margin-bottom:35px }
 .mgB40 { margin-bottom:40px }
 .mgB45 { margin-bottom:45px }
 .mgB50 { margin-bottom:50px }
 .mgB55 { margin-bottom:55px }
 .mgB70 { margin-bottom:70px }
 
 
 
 /* PADDING */
 .pdA0{padding:0;}
 .pdA5{padding:5px;}
 .pdA10{padding:10px;}
 .pdA20{padding:20px;}
 
 .pdT0{padding-top:0px}
 .pdT5{padding-top:5px}
 .pdT6{padding-top:6px}
 .pdT10{padding-top:10px}
 .pdT15{padding-top:15px}
 .pdT20{padding-top:20px}
 .pdT25{padding-top:25px}
 .pdT30{padding-top:30px}
 .pdT35{padding-top:35px}
 .pdT40{padding-top:40px}
 .pdT45{padding-top:45px}
 .pdT50{padding-top:50px}
 
 .pdL5{padding-left:5px}
 .pdL10{padding-left:10px}
 .pdL15{padding-left:15px}
 .pdL20{padding-left:20px}
 .pdL25{padding-left:25px}
 .pdL30{padding-left:30px}
 .pdL35{padding-left:35px}
 .pdL40{padding-left:40px}
 .pdL45{padding-left:45px}
 
 .pdR5{padding-right:5px}
 .pdR10{padding-right:10px}
 .pdR15{padding-right:15px}
 .pdR20{padding-right:20px}
 .pdR25{padding-right:25px}
 .pdR30{padding-right:30px}
 .pdR35{padding-right:35px}
 .pdR40{padding-right:40px}
 .pdR45{padding-right:45px}
 
 .pdB5{padding-bottom:5px}
 .pdB10{padding-bottom:10px}
 .pdB15{padding-bottom:15px}
 .pdB20{padding-bottom:20px}
 .pdB25{padding-bottom:25px}
 .pdB30{padding-bottom:30px}
 .pdB35{padding-bottom:35px}
 .pdB40{padding-bottom:40px}
 .pdB45{padding-bottom:45px}