/* Pretendard Font */
@font-face {
    font-family: 'Pretendard';
    font-weight: 100;
    font-style: normal;
    src: url('../font/Pretendard-Thin.woff2') format('woff2'),
         url('../font/Pretendard-Thin.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 200;
    font-style: normal;
    src: url('../font/Pretendard-ExtraLight.woff2') format('woff2'),
         url('../font/Pretendard-ExtraLight.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 300;
    font-style: normal;
    src: url('../font/Pretendard-Light.woff2') format('woff2'),
         url('../font/Pretendard-Light.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-style: normal;
    src: url('../font/Pretendard-Regular.woff2') format('woff2'),
         url('../font/Pretendard-Regular.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-style: normal;
    src: url('../font/Pretendard-Medium.woff2') format('woff2'),
         url('../font/Pretendard-Medium.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-style: normal;
    src: url('../font/Pretendard-SemiBold.woff2') format('woff2'),
         url('../font/Pretendard-SemiBold.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-style: normal;
    src: url('../font/Pretendard-Bold.woff2') format('woff2'),
         url('../font/Pretendard-Bold.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 800;
    font-style: normal;
    src: url('../font/Pretendard-ExtraBold.woff2') format('woff2'),
         url('../font/Pretendard-ExtraBold.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 900;
    font-style: normal;
    src: url('../font/Pretendard-Black.woff2') format('woff2'),
         url('../font/Pretendard-Black.woff') format('woff');
    font-display: swap;
}

/* Reset */
*,*:before,*:after {
  margin:0; padding:0; box-sizing:border-box;
}

html{
  overflow-x:hidden;
  font-family: Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif;
  font-size:62.5% !important;
  color:#222;
  letter-spacing:-0.02em;
  word-break:keep-all;
  word-wrap:break-word;
  box-sizing:border-box;
  animation:entry .3s ease forwards;
  opacity: 0;
}

body {
  font-size:1.6rem;
}

img{
  max-width:100%;
}

a{
  text-decoration:none;
  color:inherit;
  outline:none;
}

b,strong{
  font-weight:800 !important;
}

ul,li {
  list-style: none;
}

button{
  font-family:inherit;
  background-color:transparent;
  border:none;
  outline:none;
  cursor:pointer;
}

table{
  border-collapse:collapse;
}

input,select,textarea{
  padding-left:15px;
  padding-right:15px;
  font-family:inherit;
  background-color:#fff;
  border:1px solid #e5e5e5;
  -webkit-transition:all ease .1s;
  transition:all ease .1s;
  outline: none;
  border-radius:10px;
}

textarea{
  padding:10px;
}

select{
  padding-right:30px;
  -moz-appearance:none;
  -webkit-appearance:none;
  appearance:none;
  background-color:#fff;
  background-size:14px auto;
  background-image: url('/child/img/common/select-arrow.png');
  background-repeat:no-repeat;
  background-position:right 10px center;
}

select::-ms-expand{
  display:none;
}

input[type=number]{
  -moz-appearance:textfield;
}

input:-moz-read-only,textarea:-moz-read-only{
  background-color:#f8f8f8;
}

input:read-only,textarea:read-only{
  background-color:#f8f8f8;
}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0;
}

input:not([readonly="readonly"]):not(:disabled):hover{
  border-color:#bbbbbb !important;
}

select:not(:disabled):hover{
  border-color:#bbbbbb !important;
}

textarea:not(:read-only):not(:disabled):hover{
  border-color:#bbbbbb !important;
}

input:not([readonly="readonly"]):not(:disabled):focus{
  border-color:#555555 !important;

}
select:not(:disabled):focus{
  border-color:#555555 !important;
}

textarea:not(:read-only):not(:disabled):focus{
  border-color:#555555 !important;
}

:focus{
  outline:none;
}

::placeholder{
  color:#bbbbbb;
}

:-ms-input-placeholder{
  color:#bbbbbb;
}

::-ms-input-placeholder{
  color:#bbbbbb;
}

@keyframes entry {
    to{opacity: 1;}
}


/* Overflow */
.hidden {
  overflow: hidden;
}


/* Block */
.block {
  display: block;
}

@media(max-width:1024px){
  .pc-block {display:inline-block;}
}


/* Display */
.sp{display:none;}
.mo{display:none;}

@media(max-width:1024px){
  .sp{display:block;}
  .pc{display:none;}
}

@media(max-width:768px){
  .tb{display:none;}
  .mo{display:block;}
}


/* Ellip */
.ellip {
  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 Weight */
.font-weight-thin {
  font-weight:100;
}

.font-weight-extralight {
  font-weight:200;
}

.font-weight-light {
  font-weight:300;
}

.font-weight-medium {
  font-weight:500;
}

.font-weight-semibold {
  font-weight:600;
}

.font-weight-bold {
  font-weight:700;
}

.font-weight-extraBold {
  font-weight:800;
}

.font-weight-black {
  font-weight:900;
}

/* Button */
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  /*padding:14px 15px;*/
  text-align:center;
  border:1px solid transparent;
  -webkit-transition: all ease .3s;
  transition: all ease .3s;
  font-weight:300;
  cursor: pointer;
}



/* Main */
.main {
  overflow: hidden;
  display: block;
  min-height: calc(100vh - 240px);
}

/* Container */
.container {
  max-width:1310px;
  width:100%;
  margin:0 auto;
  padding:0px 15px;
}


/* Header */
.header {
  width:100%;
  z-index:10000;
  position:absolute;
  top:0;
  left:0;
}

.header-primary-container {
  display:block;
  width:100%;
  height:96px;
  background-color: #fff;
}

.header-primary {
  max-width: 1790px;
  width:100%;
  padding:0px 15px;
  margin:0 auto;
  position: relative;
}

.header-primary__contents {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.header-primary__logo {
  position: absolute;
  top:19px;
  left:15px;
  width:195px;
  height:56px;
}

.header-primary__logo a {
  display: block;
  width:100%;
  height:100%;
  background:url('../img/common/logo.png') no-repeat center;
}

.header-primary__menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.primary-menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  z-index:999;
}

.primary-menu__list {
  position: relative;
}

.primary-menu__link {
  display:block;
  font-size:1.8rem;
  font-weight:500;
  line-height:1;
  color:#393939;
  padding:39px 0px;
  margin:0px 26px;
  position: relative;
}

.primary-menu__link h2 {
  font-size:inherit;
  color:inherit;
  font-weight:inherit;
  line-height:inherit;
}

.primary-menu__list .sub-menu {
  z-index: 10001;
  overflow: hidden;
  width: inherit;
  position: absolute;
  top: 94px;
  left: 50%;
  -webkit-ransform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-transition: ease-out .15s;
  -ms-transition: ease-out .15s;
  transition: ease-out .15s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  opacity:0;
  visibility:visible;
  -webkit-transition: ease-out .15s;
  transition: ease-out .15s;
}
/*
.primay-menu__sub .sub-menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
} */

.primary-menu__list .sub-menu li{
  white-space:nowrap;
  text-align:center;
  /* margin:25px 20px; */
  margin:10px 10px;
}

.primary-menu__list .sub-menu a {
  display: block;
  font-size:1.8rem;
  line-height:1;
  font-weight:500;
  color:#fff;
  padding:15px 10px;
}

.primary-lang {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin:0px -10px;
  padding-left:40px;
}

.primary-lang__list {
  padding:0px 10px;
  border-right:1px solid #818181;
}

.primary-lang__list:last-child {
  border:0px;
}

.primary-lang__list a {
  display: block;
  font-size:1.6rem;
  line-height:0.8;
  color:#818181;
  font-weight:600;
}

.primary-lang__list a.on {
  color:#008e84;
}

.header-primary__background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(17,17,17,.8);
  -webkit-transition: all ease .3s;
  transition: all ease .3s;
  visibility: hidden;
  opacity: 0;
}

/* Mobile Button */
.mobile-primary__menu {
  z-index:10000;
  display:none;
  position:absolute;
  top:0;
  right:0;
  width:60px;
  height:60px;
}

.mobile-button {
  display:inline-block;
  position:relative;
  width:100%;
  height:100%;
}

.mobile-button span {
  position:relative;
  margin:0 auto;
}

.mobile-button span::before,
.mobile-button span::after {
  content:'';
  position:absolute;
}

.mobile-button span,
.mobile-button span::before,
.mobile-button span::after{
    display:block;
    width:25px;
    height:3px;
    background-color:#008e84;
}

.mobile-button span::before {
  margin-top:-10px;
  -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;
}

.mobile-button span::after {
  margin-top:10px;
  -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;
}

.mobile-button[aria-pressed = "true"] span {
    background-color: rgba(0,0,0,0);
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
}
.mobile-button[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;
}
.mobile-button[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(min-width:1200px){

  /* Header */
  .primary-menu__list .sub-menu {
    visibility:hidden;
    opacity:0;
  }

  .header-primary__background{
    position: absolute;
    top:100%;
    left:50%;
    -webkit-ransform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width:calc(100vw - 97px);
    height:0px;
    background-color: rgba(0,142,132,.9);
    -webkit-transition: all ease .15s;
    -ms-transition: all ease .15s;
    transition: all ease .15s;
  }

  .primary-menu__list.list-active .sub-menu {
    visibility: visible;
    opacity:1;
  }

  .header.menu-active .header-primary__background {
    height:68px;
    opacity:1;
    visibility: visible;
  }

  /* [data-header-menu="on"] .primay-menu__sub {
    visibility: visible;
    opacity:1;
  } */

  /* [data-header="on"] .header-primary__background {
    height:68px;
    opacity:1;
    visibility: visible;
  } */

}

/* Large devices (desktops, less than 1200px) - lg */
@media (max-width: 1199px) {

  /* Header */
  .header-primary-container {
    height: 60px;
    position: fixed;
    box-shadow: 0px 2px 4px 0px rgb(0 0 0 / 10%);
  }

  .header-primary__logo {
    top:15px;
    width:112px;
    height:32px;
  }

  .header-primary__logo a {
    background-size: auto 32px;
  }

  .header-primary__menu {
    overflow-y:auto;
    /* display: block; */
    display:flex;
    flex-direction: column;
    justify-content: space-between;
    z-index:9999;
    position: fixed;
    top:0;
    right:-100%;
    /* max-width:550px; */
    width:100%;
    height:100%;
    padding:80px 24px;
    background-color: #fff;
    -webkit-transition: all ease .3s;
    -ms-transition: all ease .3s;
    transition: all ease .3s;
  }

  .primary-menu {
    flex-direction: column;
    width:100%;
  }

  .primary-menu__list {
    width:100%;
  }

  .primary-menu__link {
    padding:12px 0px;
    margin:10px 0px;
  }

  .primary-menu__link h2:before,
  .primary-menu__link h2:after{
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 13px;
    height: 3px;
    margin-top: -1px;
    background-color: #333;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all .3s;
    transition: all .3s;
  }

  .primary-menu__link h2:before {
    z-index: 2;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    opacity: 1;
  }

  .primary-menu__link[aria-pressed="true"] h2:before {
    background: #222 !important;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  .primary-menu__link[aria-pressed="true"] h2:after {
    opacity: 0;
    background: #222 !important;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  .primary-menu__list .sub-menu {
    position:relative;
    top:0;
    left:0;
    background: #fff;
    margin: -15px 0 15px;
    padding:0;
    width:100%;
    max-height:0;
    height:auto;
    /* border:none; */
    -webkit-transform: translate(0, 0) !important;
    transform: translate(0, 0) !important;
    display:block;
  }

  .primary-menu__list .sub-menu a {
    font-size:1.6rem;
    padding:12px 0px;
    text-align: left;
    color:#999;
  }

  .primary-menu__list .sub-menu li {
    display: block;
    width:100%;
    margin:0;
  }

  .mobile-primary__menu {
    display: block;
  }

  /* .primary-lang {
    display: none;
  } */

  .primary-menu__link[aria-pressed="true"] + .sub-menu {
    max-height: 300px;
    margin-top: -5px;
    opacity: 1;
    visibility: visible
  }

  /* Event CSS */
  [data-header-mobile="on"] .header-primary__menu {
    right:0;
  }

}

/* Medium devices (tablets, less than 992px) - md */
@media (max-width: 991px) {


}

/* Small devices (landscape phones, less than 768px) - sm */
@media (max-width: 767px) {



}

/* Extra small devices (portrait phones, less than 576px) - xl */
@media (max-width: 575px) {

}


/* Footer */
.footer .footer__client {
  border-top:1px solid #d2d2d2;
  border-bottom:1px solid #d2d2d2;;
}

.footer .footer-container {
  max-width: 1310px;
  width: 100%;
  margin: 0 auto;
}

.footer .list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-lines: multiple;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding:10px 0px;
}

.footer .list li {
  flex:1 1 16.6667%;
  max-width:16.6667%;
}

.footer .list .card {
  height:100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.footer .list img {
  display:block;
  margin:0 auto;
}

.footer .footer__info {
  background-color: #404040;
}

.footer .link {
  border-bottom:1px solid #565656;
}

.footer .link ul {
  display:flex;
  align-items: center;
  border-left:1px solid #565656;
}

.footer .link li {
  border-right:1px solid #565656;
}

.footer .link a {
  display: block;
  padding:15px 10px;
  min-width:200px;
  width:100%;
  font-size:1.8rem;
  color:#e0e0e0;
  text-align: center;
}

.footer .address {
  padding:30px 0px;
  text-align: center;
}

.footer .address li {
  font-size:1.4rem;
  color:#ffffff;
  line-height:1.4;
}

/* Large devices (desktops, less than 1200px) - lg */
@media (max-width: 1199px) {

  .footer .list {
    padding:0px;
    margin:0px 0px -1px -1px;
  }

  .footer .list li {
    flex:1 1 33.33%;
    max-width:33.33%;
    padding:10px;
    border-left:1px solid #d2d2d2;
    border-bottom:1px solid #d2d2d2;
  }

  .footer .list .card {
    height:40px;
  }

  .footer .list img {
    max-height:100%;
  }

  .footer .link a {
    font-size:1.6rem;
  }

}
/* Medium devices (tablets, less than 992px) - md */
@media (max-width: 991px) {

}
/* Small devices (landscape phones, less than 768px) - sm */
@media (max-width: 767px) {

  .footer .list li {
    flex:1 1 50%;
    max-width:50%;
  }

  .footer .list .card {
    height:32px;
  }

  .footer .link ul {
    border-left:0px;
  }

  .footer .link li {
    flex:1 1 50%;
    max-width:50%;
  }

  .footer .link a {
    font-size:1.5rem;
    padding:12px 10px;
    min-width: auto;
  }

  .footer .address {
    padding:24px 15px;
  }

  .footer .address li {
    font-size:1.2rem;
  }


}
/* Extra small devices (portrait phones, less than 576px) - xl */
@media (max-width: 575px) {

}


/* Popup */
#popup {
    position: relative;
}

.popup-layer {
    z-index: 10000;
    position: absolute;
    background: #fff;
    box-shadow: 0px 0px 20px 0px rgba(0,0,0,.25);
    animation: popup-fade .65s ease-in-out .35s forwards;
    opacity: 0;
    max-width:800px;
}

@keyframes popup-fade {
    0% { opacity: 0;
        -webkit-transform: translateY(25px);
        -ms-transform: translateY(25px);
        transform: translateY(25px); }
    100% { opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0); }
}
.popup-layer__body {
    background: #fff;
}

.popup-layer__body img {
    display: block;
    margin: 0 auto;
    border: none;
    max-width: 100%;
}

.popup-layer__foot {
    background: #424242;
}

.popup-layer__foot ul {
    display:flex;
    flex-wrap: wrap;
}

.popup-layer__foot li {
    width:50%;
    padding:10px;
}

.popup-layer__foot li:first-child {
    padding-right:0;
}

.popup-layer__foot li:last-child {
    text-align: right;
}

.popup-layer__foot span {
    font-size: 1.5rem;
    color: #fff;
    cursor: pointer;
    transition:all 0.3s ease;
}

.popup-layer__foot label:hover span { opacity: .7; }

/* .popup-layer-foot { background: #424242; }
.popup-layer-foot span { font-size: 15px; color: #fff; }
.popup-layer-foot label:hover span { opacity: .7; }
.popup-layer-foot li:first-child { padding-right: 0; }
.popup-layer-foot li:last-child { text-align: right; } */


@media (max-width: 1024px){
    /* .popup-layer { z-index: 999; } */
    .popup-layer { top: 95px !important; left: 0 !important; margin: 0 5px; }
}
@media (max-width: 768px){

    .popup-layer {
        width:calc(100% - 10px);
    }

    .popup-layer img {
        max-width: none;
        width:100%;
        height: auto !important;
    }
    .popup-layer-foot span { font-size: 14px; }

}
@media (max-width: 375px){
    .popup-layer-foot li { width: 100%; }
    .popup-layer-foot li:last-child { text-align: left; }
}