@charset "utf-8";

/* bootstrap */
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

/* font */
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

@font-face {
  font-family: 'hufs_L';
  src: url(/Web-home/_UI/font/hufs/hufs_L.eot);
  src: url(/Web-home/_UI/font/hufs/hufs_L.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/hufs/hufs_L.woff) format('woff'), url(/Web-home/_UI/font/hufs/hufs_L.woff2) format('woff2');
}
@font-face {
  font-family: 'hufs_M';
  src: url(/Web-home/_UI/font/hufs/hufs_M.eot);
  src: url(/Web-home/_UI/font/hufs/hufs_M.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/hufs/hufs_M.woff) format('woff'), url(/Web-home/_UI/font/hufs/hufs_M.woff2) format('woff2');
}
@font-face {
  font-family: 'hufs_B';
  src: url(/Web-home/_UI/font/hufs/hufs_B.eot);
  src: url(/Web-home/_UI/font/hufs/hufs_B.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/hufs/hufs_B.woff) format('woff'), url(/Web-home/_UI/font/hufs/hufs_B.woff2) format('woff2');
}
@font-face {
  font-family:'Noto Sans KR';
  font-style:normal;
  font-weight:100;
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Thin.eot);
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Thin.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Thin.woff) format('woff'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Thin.woff2) format('woff2');
}
@font-face {
  font-family:'Noto Sans KR';
  font-style:normal;
  font-weight:300;
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Light.eot);
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Light.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Light.woff) format('woff'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Light.woff2) format('woff2');
}
@font-face {
  font-family:'Noto Sans KR';
  font-style:normal;
  font-weight:400;
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Regular.eot);
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Regular.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Regular.woff) format('woff'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Regular.woff2) format('woff2');
}
@font-face {
  font-family:'Noto Sans KR';
  font-style:normal;
  font-weight:500;
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Medium.eot);
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Medium.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Medium.woff) format('woff'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Medium.woff2) format('woff2');
}
@font-face {
  font-family:'Noto Sans KR';
  font-style:normal;
  font-weight:700;
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Bold.eot);
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Bold.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Bold.woff) format('woff'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Bold.woff2) format('woff2');
}
@font-face {
  font-family:'Noto Sans KR';
  font-style:normal;
  font-weight:900;
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Black.eot);
  src: url(/Web-home/_UI/font/notosanskr/NotoSansKR-Black.eot?#iefix) format('embedded-opentype'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Black.woff) format('woff'), url(/Web-home/_UI/font/notosanskr/NotoSansKR-Black.woff2) format('woff2');
} 

*,:after,:before,::after,::before{box-sizing:border-box;-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

html,body{overflow:visible;width:100%;height:100%;  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-size:16px;  line-height:1.5; color:#333;letter-spacing:0;word-wrap:break-word}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,p,button{margin:0;padding:0}
body{word-break:keep-all}
header,article,section,nav,footer{display:block}
img,fieldset,iframe,button{border:0 none}
li{list-style:none}
img{vertical-align:top;width:auto;max-width:100%}
i,em,address{font-style:normal}
label,button{cursor:pointer}
button{ font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-weight:300; background-color:transparent;overflow:visible;border:0}
a,button,input{border:0 none}
a:link,a:active,a:visited{text-decoration:none;color:#000}
a:hover{text-decoration:none;color:#2247a6;transition:all .125s cubic-bezier(0.7,0,0.3,1)}
legend{*width:0;width:0;height:0;font-size:0;position:absolute;z-index:-1}
table{width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;text-align:center}
caption{width:0;height:0;padding:0;font-size:0;opacity:0}
th{text-align:center}
input::-ms-clear{display:none}
input,button{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; font-weight:300; }
input[type="button"],input[type="submit"],
button {-webkit-appearance:none;-moz-appearance:none;appearance:none;}
input:focus, button:focus, a:focus, select:focus, option:focus, textarea:focus{outline: none;}
input[type="radio"]{position:relative;top:2px}
pre{white-space:pre-line;background-color:#fff;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;overflow-y:auto}
select::-ms-expand{display:none}
textarea{resize:none}
figure{text-align:center}
h1,h2,h3,h4,h5,h6,strong{font-weight:500}
a.focus, button.focus, input.focus{ position: relative }
a.focus::before, button.focus::before, input.focus::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border:1px double #ff3000;}
.hidden{position:absolute;top:-9999px;left:-9999px}
.slick-slide {outline: none}
.simplemodal-wrap{font-size:13px}
._obj ._relative{position:relative}

@page{size:1800px;margin:0}

@media print {
    .wrap-header,.wrap-sub-visual,.wrap-sub-navi,.wrap-footer,.wrap-page-top{display:none}
}

@media only screen and (min-width : 320px) and (max-width : 767px) {
  html, body {-webkit-text-size-adjust: none; -o-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none;}
}


/* common */
:root {
  --navy: #002d56;
  --light-blue: #3EDBFD;
  --grn: #008395;
}

.sr-only {position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0, 0, 0, 0);white-space: nowrap;border: 0;}
.text-nowrap {text-wrap: nowrap !important;}
.contain {margin: 0 auto;padding: 0 20px;max-width: 1340px;}
.text-body {color: #333 !important;}
.text-white {color: #fff !important;}
.text-navy {color: var(--navy) !important;}
.text-grn {color: var(--grn) !important;}
.text-lightblue {color: var(--light-blue) !important;}
.text-deco-dot {position: relative;display: inline-block;}
.text-deco-dot::after {content: '';position: absolute;top: 0px;right: -16px; display: block;width: 8px;height: 8px;border-radius: 500px;background: #fff;}
.text-deco-dot.text-body::after {background-color: #333;}
.text-deco-dot.text-grn::after {background-color: var(--grn);}
.text-deco-dot.text-lightblue::after {background-color: var(--light-blue);}

.display01 {font-size: 60px !important;font-family: 'hufs_M' !important;line-height: 1.2;letter-spacing: -1px;text-transform: uppercase;}
.display02 {font-size: 48px !important;font-family: 'hufs_M' !important;}
.display03 {font-size: 32px !important;}
.display04 {font-size: 28px !important;}
.display05 {font-size: 20px !important;}
@media screen and (max-width:1024px) {
  .text-deco-dot::after {width: 6px;height: 6px;}
  .display01 {font-size:38px !important;}
  .display02 {font-size:28px !important;}
  .display03 {font-size: 20px !important;}
  .display04 {font-size: 20px !important;}
  .display05 {font-size: 18px !important;}
}

