@charset "utf-8";
*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}
* {
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-variant-numeric: lining-nums;
  word-break: keep-all;
  margin: 0;
  padding: 0;
}
*:focus{outline:none}
html {
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
  -webkit-text-size-adjust: none; 
	-moz-text-size-adjust: none; 
	-ms-text-size-adjust: none; 
}
html,body {
  width:100%;
  height:100%;
}
body{
  font-family:'Pretendard', 'Pretendard-Regular', 'Noto Sans KR', AppleGothic, 'Dotum', sans-serif;
  font-style:normal;
  font-weight:400;
  background-color:#fff;
  -webkit-font-smoothing:antialiased;
  -webkit-touch-callout: none;

  min-width: 100%;
  overflow-x: hidden;
  color: #344054;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {display:block}
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

fieldset,
img {border:0;}
img{
  max-width: 100%;
  vertical-align: bottom;
}
dl,
li,
menu,
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:after,
blockquote:before,
q:after,
q:before {
  content: "";
  content: none;
}
table {border-spacing:0;border-collapse:collapse;font-size:inherit;line-height:100%}
caption{position:absolute; left:-99999999999999px; font-size:0px; width:0px; height:0px;}

h1,
h2,
h3,
h4,
h5,
h6 {font-size:100%;}
del,
ins {text-decoration:none}
abbr,
acronym {border:0;font-variant:normal}
sup {vertical-align:text-top}
sub {vertical-align:text-bottom}
a,
a:active,
a:hover {
  color: inherit;
  text-decoration: none;
}
a:active {
  background-color: transparent;
}

/* form reset */
input,
button,
textarea,
select,
option,
optgroup {
  vertical-align: middle;
  font-size: inherit; 
  font-family: inherit; 
  font-weight:inherit;
  font-style:inherit;
  color: inherit;
  line-height:normal;
  background:transparent;
  border:0;
  border-radius: 0; /* iSO 둥근모서리 제거 */
  -webkit-border-radius:0;
  outline-style: none;  /* 포커스시 발생하는 효과 제거 */
  outline: none;
}
button,
select,
textarea,
input[type=text], 
input[type=password], 
input[type=email], 
input[type=url], 
input[type=search], 
input[type=tel], 
input[type=number], 
input[type=datetime]{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
}
input::-ms-clear {
  display: none;
}
button {
  cursor: pointer;
}
select::-ms-expand {display:none}
textarea{
  resize:none;
}

/* Change the color to your own background color 
크롬에서 input 자동완성 백그라운드 색 제거 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  box-shadow: 0 0 0 10000px white inset;
  -webkit-box-shadow: 0 0 0 10000px white inset !important;
  transition: background-color 5000s;
  -webkit-transition: background-color 5000s;
}
input:-webkit-autofill{
  -webkit-text-fill-color: #98A2B3 !important;
}

#skipnavi{position:absolute;top:-1px;left:0;background-color:#333;z-index:999999}
#skipnavi a{position:absolute;top:0;left:0;padding:10px 25px;margin-top:-100px;text-align:center;line-height:1;white-space:nowrap;background:#000;}
#skipnavi a:link{color:#333;}
#skipnavi a:focus{margin-top:0;text-decoration:underline;color:#fff}


.w-25{width:25% !important}
.w-50{width:50% !important}
.w-75{width:75% !important}
.w-100{width:100% !important}
.w-auto{width:auto !important}
.h-25{height:25% !important}
.h-50{height:50% !important}
.h-75{height:75% !important}
.h-100{height:100% !important}
.h-auto{height:auto !important}
.mw-100{max-width:100% !important}
.mh-100{max-height:100% !important}
.min-vw-100{min-width:100vw !important}
.min-vh-100{min-height:100vh !important}
.vw-100{width:100vw !important}
.vh-100{height:100vh !important}
.m-0{margin:0 !important}
.mt-0{margin-top:0 !important}
.mr-0{margin-right:0 !important}
.mb-0{margin-bottom:0 !important}
.ml-0{margin-left:0 !important}
.p-0{padding:0 !important}
.pt-0{padding-top:0 !important}
.pr-0{padding-right:0 !important}
.pb-0{padding-bottom:0 !important}
.pl-0{padding-left:0 !important}
.m-auto{margin:auto !important}
.mt-auto,.my-auto{margin-top:auto !important}
.mr-auto,.mx-auto{margin-right:auto !important}
.mb-auto,.my-auto{margin-bottom:auto !important}
.ml-auto,.mx-auto{margin-left:auto !important}

.mt4{margin-top: 4px !important;}
.mt8{margin-top: 8px !important;}
.mt12{margin-top: 12px !important;}
.mt16{margin-top: 16px !important;}
.mt20{margin-top: 20px !important;}
.mt28{margin-top: 28px !important;}
.mt32{margin-top: 32px !important;}
.mt36{margin-top: 36px !important;}
.mt40{margin-top: 40px !important;}

.pt4{padding-top: 4px !important;}
.pt8{padding-top: 8px !important;}
.pt12{padding-top: 12px !important;}
.pt16{padding-top: 16px !important;}
.pt20{padding-top: 20px !important;}
.pt24{padding-top: 24px !important;}
.pt28{padding-top: 28px !important;}
.pt32{padding-top: 32px !important;}
.pt36{padding-top: 36px !important;}
.pt40{padding-top: 40px !important;}

.pb4{padding-bottom: 4px !important;}
.pb8{padding-bottom: 8px !important;}
.pb12{padding-bottom: 12px !important;}
.pb16{padding-bottom: 16px !important;}
.pb20{padding-bottom: 20px !important;}
.pb24{padding-bottom: 24px !important;}
.pb28{padding-bottom: 28px !important;}
.pb32{padding-bottom: 32px !important;}
.pb36{padding-bottom: 36px !important;}
.pb40{padding-bottom: 40px !important;}

.ml12{margin-left: 12px;}
.ml20{margin-left: 20px;}
.ml28{margin-left: 28px;}

.fr{float:right;} 
.fl{float:left;} 

.center{text-align:center !important;} 
.right{text-align:right;} 
.left{text-align:left !important;}

.flex{
	display: flex;
}
.flex_col{
	display: flex;
  flex-direction: column;
}
.flex_center{
	display: flex;
  justify-content: center;
  align-items: center;
}
.flex_sb{
	display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.flex_sb_center{
	display: flex;
  justify-content: space-between;
  align-items: center;
}

.clearfix{width:100%}
.clearfix:after,.clearfix:before{content:"";display:block;visibility:hidden;clear:both}

.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}
.hidden,
.blind {overflow:hidden;clip:rect(1px,1px,1px,1px);position:absolute !important;width:1px;height:1px}
.caption {
  overflow: hidden;
  line-height: 0;
  text-indent: -9999px;
}
.screen_out {
  position: absolute;
  width: 0;
  height: 0;
}
.show {
  display: block;
}
.hide {
  display: none;
}

.ellipsis {
  width: 90%;
  display: block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ellipsis2{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
  line-height: 1.6em;
	max-height: calc(1em * 1.6em * 2);
}

body.scroll-off{overflow:hidden}
body.scroll-off header.scroll{-webkit-box-shadow:none;box-shadow:none}



::selection{background:#0C0F27;color:#fff;}
::-moz-selection{background:#0C0F27;color:#fff;}

::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:#E4E7EC;}
::-webkit-scrollbar-thumb{background-color: #ADB5C2; border-radius: 4px;}