/* Reset */
*, *::before, *::after {
  margin:0;
  padding:0;
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  font-family: "NotoSansKR", sans-serif;
  font-size:62.5% !important;
  color:#191919;
  font-weight:400;
  word-break: keep-all;
  word-wrap: break-word;
  box-sizing: border-box;
  -webkit-animation: fadein .3s ease forwards;
  animation: fadein .3s ease forwards;
  opacity: 0;
}

html::-webkit-scrollbar {
  display: none;
}

html {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

body {
  font-size:1.6rem;
}

a {
  color:inherit;
  outline: none;
  text-decoration: none;
}

ol,ul {
  list-style: none;
}

b, strong {
  font-weight:700;
}

img {
  max-width:100%;
}

button {
  font-family:inherit;
  background-color:transparent;
  border:none;
  outline:none;
  cursor:pointer;
}

select{
  outline: none;
  border:1px solid transparent;
  font-family:inherit;
  -moz-appearance:none;
  -webkit-appearance:none;
  appearance:none;
  background-color:#fff;
  background-size:8px auto;
  background-image: url('/child/img/common/btn_select.png');
  background-repeat:no-repeat;
  background-position:right 20px center;
}

input, textarea, select {
  font-family:inherit;
  outline: none;
  border:1px solid transparent;
  padding:0px 20px;
}

:focus{
  outline:none;
}

::placeholder {
  color:#999999;
}

:-ms-input-placeholder{
  color:#999999;
}

::-ms-input-placeholder{
  color:#999999;
}

select {
  color:#999999;
}

@-webkit-keyframes fadein {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadein {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@media screen and (max-width:1200px) {

}
@media screen and (max-width:992px) {
  input, textarea , select{
    padding:0px 16px;
  }
}
@media screen and (max-width:768px) {
  input, textarea , select{
    padding:0px 12px;
  }
}
@media screen and (max-width:576px) {

}


/* Overflow */
.hidden {
  overflow: hidden;
}


/* Display */
.sp{display:none;}
.mo{display:none;}

@media screen and (max-width:992px){
  .sp{display:block;}
  .pc{display:none;}
}
@media screen and (max-width:768px){
  .tb{display:none;}
  .mo{display:block;}
}


/* Ellip */
.ellip {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}


/* Blind */
.blind {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  clip: rect(1px,1px,1px,1px);
}


/* Font Family */
.fm-albert {
  font-family: "Albert Sans", sans-serif;
}


/* Button */
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width:400px;
  width:100%;
  height:70px;
  border: 1px solid transparent;
  border-radius:10px;
  text-align: center;
  font-size:2rem;
  padding:0px 20px;
  transition: all ease 0.3s;
  cursor: pointer;
}

.button--point {
  color:#fff;
  background-color: #1fb8df;
}

@media (min-width:1201px) {
  .button--point:hover {
    background-color: #156377;
  }  
}
@media screen and (max-width:1200px) {
  .button {
    max-width:360px;
    font-size:1.8rem;
  }
}
@media screen and (max-width:992px) {
  .button {
    max-width:300px;
    height:63px;
  }
}
@media screen and (max-width:768px) {
  .button {
    max-width:240px;
    height:54px;
    font-size:1.7rem;
  }
}
@media screen and (max-width:576px) {
  .button {
    max-width:200px;
    height:48px;
    font-size:1.6rem;
  }
}



/* Wrap */
@media screen and (max-width:1200px) {
  .wrap {
    padding-top:60px;
  }
}


/* Main */
#main {
  overflow: hidden;
  min-height:calc(100vh - 280px);
}


/* Container */
.container {
  max-width:1310px;
  width: 100%;
  margin:0 auto;
  padding:0px 15px;
}


/* Header */
#header {
  position: absolute;
  top:20px;
  left:0;
  width:100%;
  padding:0px 30px;
  z-index:99;
  transition:all .35s ease;
}

#header .h-container {
  padding:0px 50px;
  background-color: #fff;
  border-radius:100px;
  overflow: hidden;
  transition:all .35s ease;
}

#header .h-inner {
  display: flex;
  justify-content: center;
  /* justify-content: space-between; */
  align-items: center;
  position: relative;
}

#header .h_logo {
  position: absolute;
  top:23px;
  left:0;
  width:154px;
  height:24px;
}

#header .h_logo a {
  display: block;
  width:100%;
  height:100%;
  background: url('/child/img/common/h_logo.png') no-repeat center;
}

#header .h_menu {
  display: flex;
  align-items: center;
  margin:0px -50px;
}

#header .h_menu__link {
  display: flex;
  align-items: center;
  height:70px;
  padding:0px 50px;
  font-family: "Albert Sans", sans-serif;
  font-size:1.8rem;
  line-height:1;
}

#header .h_user {
  display: flex;
  align-items: center;
}

#header .h_user li {
  position: relative;
}

#header .h_user li::after {
  content: "";
  display: block;
  position: absolute;
  top:50%;
  left:0;
  transform: translateY(-50%);
  width:1px;
  height:18px;
  background-color: #191919;
}

#header .h_user li:first-child::after {
  display: none;
}

#header .h_user__link {
  display: block;
  padding:0px 16px;
  font-size:1.8rem;
  line-height:1;
}

#header .h_overlay {
  display: none;
  position: fixed;
  top:-100%;
  left:0;
  width:100%;
  height:100%;
  background-color: #fff;
  padding:70px 20px 40px;
  transition: all ease 500ms;
}

#header .h_background {
  display: none;
  position: fixed;
  top:0;
  left:0;
  width:100%;
  height:60px;
  background-color: #fff;
}

#header .h_mobile {
  display: none;
  position: absolute;
  top:0;
  right:0;
  width: 60px;
  height: 60px;
  z-index: 100000;
}

#header .h_mobile__btn {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 100%;
}

#header .h_mobile__btn span {
  position: relative;
  margin: 0 auto;
}

#header .h_mobile__btn span::before,
#header .h_mobile__btn span::after {
  content: '';
  position: absolute;
}

#header .h_mobile__btn span,
#header .h_mobile__btn span::before,
#header .h_mobile__btn span::after {
  display: block;
  width: 25px;
  height: 3px;
  background-color: #393939;
}

#header .h_mobile__btn span::before {
  margin-top: -8px;
  -webkit-transition-property: margin, -webkit-transform;
  transition-property: margin, transform;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-delay: 0.2s, 0s;
  transition-delay: 0.2s, 0s;
}

#header .h_mobile__btn span::after {
  margin-top: 8px;
  -webkit-transition-property: margin, -webkit-transform;
  transition-property: margin, transform;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-delay: 0.2s, 0s;
  transition-delay: 0.2s, 0s;
}

#header .h_mobile__btn[aria-pressed="true"] span {
  background-color: rgba(0, 0, 0, 0) !important;
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

#header .h_mobile__btn[aria-pressed="true"] span::before {
  margin-top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition-delay: 0s, 0.2s;
  transition-delay: 0s, 0.2s;
}

#header .h_mobile__btn[aria-pressed="true"] span::after {
  margin-top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition-delay: 0s, 0.2s;
  transition-delay: 0s, 0.2s;
}

@media screen and (min-width:1201px) {
  #header.sticky {
    position: fixed;
    top:0;
    left:0;
    padding:0px;
    /* background-color: #fff; */
  }

  #header.sticky .h-container {
    border-radius:0px;
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,.15);
  }
}
@media screen and (max-width:1366px) {
  #header .h-container {
    padding:0px 38px;
  }

  #header .h_menu {
    margin:0px -38px;
  }
  
  #header .h_menu__link {
    padding:0px 38px;
  }
}
@media screen and (max-width:1200px) {
  #header {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:60px;
    padding:0px;
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,.15);
  }

  #header .h-container {
    position: relative;
    width:100%;
    height:100%;
    padding:0px;
    border-radius:0px;
    background-color: transparent;
  }

  #header .h_logo {
    position: absolute;
    top:18px;
    left:20px;
    z-index:999;
  }

  #header .h_nav {
    display: none;
  }

  #header .h_gnb {
    display: none;
  }

  #header .h_overlay {
    display: block;
  }

  #header .h_background {
    display: block;
  }

  #header .h_menu {
    display: block;
    margin:0px 0px 20px;
  }

  #header .h_menu__link {
    height:auto;
    padding:12px 0px;
    font-size:1.7rem;
  }

  #header .h_user {
    display: block;
    padding-top:20px;
    border-top: 1px solid #d7d7d7;
  }

  #header .h_user li::after {
    display: none;
  }

  #header .h_user__link {
    padding:12px 0px;
    font-size:1.7rem;
  }
  
  #header .h_mobile {
    display: block;
  }

  #header[data-header-mobile="on"] .h_overlay {
    top:0;
  }
}
@media screen and (max-width:992px) {

}
@media screen and (max-width:768px) {
  #header .h_menu {
    margin:0px 0px 18px;
  }

  #header .h_menu__link {
    font-size:1.6rem;
  }

  #header .h_user {
    padding-top:18px;
  }

  #header .h_user__link {
    font-size:1.6rem;
  }
}
@media screen and (max-width:576px) {
  #header .h_menu {
    margin:0px 0px 16px;
  }

  #header .h_menu__link {
    padding:10px 0px;
    font-size:1.5rem;
  }

  #header .h_user {
    padding-top:16px;
  }

  #header .h_user__link {
    padding:10px 0px;
    font-size:1.5rem;
  }
}



/* Footer */
#footer {
  padding:60px 0px;
  background-color: #f5f5f5;
}

#footer .f-container {
  max-width:1310px;
  width: 100%;
  margin:0 auto;
  padding:0px 15px;
}

#footer .f_logo {
  display: block;
  width:220px;
  height:34px;
  background: url('/child/img/common/f_logo.png') no-repeat center;
}

#footer .f_fnb {
  margin-top:30px;
  padding-top:30px;
  border-top:1px solid #b5b5b5;
}

#footer .f_info {
  display: flex;
  flex-wrap: wrap;
  max-width:500px;
  margin:-6px -10px;
}

#footer .f_info li {
  position: relative;
  margin:6px 0px;
  padding:0px 10px;
  font-size:1.6rem;
  line-height:.8;
  color:#595959;
}

#footer .f_info li.border {
  border-right:1px solid #595959;
}

#footer .f_copy {
  font-size:1.6rem;
  line-height:1;
  color:#595959;
  margin-top:20px;
}

@media screen and (max-width:1200px) {
  #footer .f_info li {
    font-size:1.5rem;
  }

  #footer .f_copy {
    font-size:1.5rem;
  }
}
@media screen and (max-width:992px) {
  #footer {
    padding:46px 0px;
  }

  #footer .f_logo {
    width: 160px;
    height:24px;
    background-size:160px auto;
  }

  #footer .f_fnb {
    margin-top:24px;
    padding-top:24px;
  }

  #footer .f_copy {
    margin-top:18px;
  }
}
@media screen and (max-width:768px) {
  #footer {
    padding:40px 0px;
  }

  #footer .f_logo {
    width: 120px;
    height:18px;
    background-size:120px auto;
  }

  #footer .f_fnb {
    margin-top:20px;
    padding-top:20px;
  }

  #footer .f_info {
    margin:-5px -9px;
  }

  #footer .f_info li {
    font-size:1.4rem;
    line-height:1;
    margin:5px 0px;
    padding:0px 9px;
  }
  
  #footer .f_copy {
    font-size:1.4rem;
    margin-top:16px;
  }
}
@media screen and (max-width:576px) {
  #footer .f_info {
    margin:-4px -8px;
  }

  #footer .f_info li {
    width:100%;
    font-size:1.2rem;
    margin:4px 0px;
    padding:0px 8px;
  }

  #footer .f_info li.border {
    border:0px;
  }

  #footer .f_copy {
    font-size:1.2rem;
    margin-top:14px;
  }
}
