/* connect-b ltr */
@charset "utf-8";

/* reset */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, address, img, strong, b, u, i, ul, li, ol, form, label, table, tr, td, th, thead, tbody, tfoot, button, input, select, textarea {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
  box-sizing: border-box;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

ul, ol {
  list-style: none;
}

a {
  text-decoration: none;
  color: inherit;
  background-color: transparent;
}

img, video {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  height: auto;
}

button, input, select, textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1;
  margin: 0;
  background: none;
  border: none;
}

textarea {
  resize: none;
}

strong, b, em {
  font-weight: bold;
  font-style: normal;
}

code, kbd, samp {
  font-family: 'IBM Plex Mono', monospace;
  line-height: 1.5;
}

label {
  cursor: pointer;
}

pre, p, li {
  line-height: 1.5;
  word-break: keep-all;
}

/* table */
table {
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}
th, td {
  text-align: left;
}


/* animation */
@keyframes fadein {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes bounceInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}


/* common */
*, *:before, *:after {
    box-sizing: border-box;
}

html{
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body{
  line-height: 1.5;
  font-weight:400; 
  font-size:16px; 
  color:#373737;
}

code {
  padding:0 3px; 
  border-radius:3px; 
  background-color: #eee;
}

.mask {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: -1;
  transform: translateZ(0);
  will-change: opacity;
  transition: opacity 0.3s ease, visibility 0s linear 0.3s, z-index 0s linear 0.3s;
}

.mask.on {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 3;
  transition: opacity 0.3s ease, visibility 0s linear 0s, z-index 0s linear 0s;
}

.hidden { display:none;}


::-webkit-input-placeholder,:-moz-placeholder, ::-moz-placeholder , :-ms-input-placeholder,::placeholder {color:#000; opacity:0.3;}


/* Skip Navigation */
.skipNav{position: fixed;left: 0;top: -2px;width: 100%;overflow: hidden;margin: 0 auto;z-index: 300}
.skipNav a{display: block;height: 1px;margin-top: -2px;overflow: hidden;text-align: center;font-size: 0;line-height: 0;background: #333}
.skipNav a:active,.skipNav a:focus{height: 40px;font-size: 16px;line-height: 40px;font-weight: 700;color: #fff;z-index: 10000;text-decoration: underline;outline-offset: -2px;}
.skipNav a:active:after,.skipNav a:focus:after{content: '';display: block;width: 100%;box-sizing: border-box;height: 100%;position: absolute;left: 0;top: 0;}


/* 자동완성스크롤 */
.related_wrap{scrollbar-width: thin; scrollbar-color: #C1C1C1 transparent; clip-path: inset(0 round 20px)}
.related_wrap::-webkit-scrollbar{display:block;width: 5px;margin-right:14px;}
.related_wrap::-webkit-scrollbar-track{background: transparent;}
.related_wrap::-webkit-scrollbar-thumb{background: #C1C1C1;border-radius: 20px;}
.related_wrap::-webkit-scrollbar-button:start:decrement, 
.related_wrap::-webkit-scrollbar-button:end:increment{width: 0;height: 0;}

/* ::-webkit-scrollbar{width: 0px; height: 0px; border: 0;} */
::-webkit-scrollbar-track{background: #fff; -webkit-border-radius: 0px; border-radius:0px; -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0)}
::-webkit-scrollbar-thumb{height: 0px; width: 0px; background: rgba(0,0,0,0); -webkit-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0)} 
::-webkit-scrollbar-button:start:decrement, 
::-webkit-scrollbar-button:end:increment{display: block; height: 0px; /*background: url("../images/bg.png") #fff*/}