/* 
/* 
/*  custom.css
/*
/*  If not using Gulp and Sass, add your custom CSS below then include it
/*  in your page by adding a reference to assets/css/custom.css in the head of each page.
/*
*/

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');

:root {
  --font-family-sans-serif: 'Pretendard','Noto Sans KR','맑은 고딕','나눔 고딕','굴림','굴림체',"Inter UI", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}

body {
  word-break: keep-all;}

.text-yuhan-green {
  color: #31B088 !important; }

a.text-yuhan-green:hover, a.text-success:focus {
  color: #19692c !important; }

.border-top {
  border-top: 1px solid #dee2e6 !important; }

.border-top-0 {
    border-top: 0 !important; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    margin-bottom: 1rem;
    font-family: inherit;
    font-weight: 600;
    line-height: 1.15;
    color: #212529; }

.img-max-h-10 {
  max-height: 10rem;
}

@media (max-width: 576px) {
img.bg-image-custom{
  object-fit: cover;
  object-position: 75% 50%;
} }

@media (max-width: 767px) {
  .img-visible-custom-mo {
    display: block;
  }
  .img-visible-custom-pc {
    display: none;
  }
}

@media (min-width: 768px) {
  .img-visible-custom-mo {
    display: none;
  }
  .img-visible-custom-pc {
    display: block;
  }
}

.border-primary-custom {
  border: 1px solid #48BF84 !important;
}

.text-primary-alt {
  color: #f4fbf8;
}

.overflow-hidden {
  overflow: hidden;
}


@media (max-width: 767px) {
  .text-block-custom {
    display: inline;
  }
}

@media (min-width: 768px) {
  .text-block-custom {
    display: block;
  }
}

@keyframes slide-in {
  
  0% {
		transform: translateY(50px) translateX(0);
    transform: scale(1.2);
	}
	
	100% {
		transform: translateY(0px) translateX(50px);
    transform: scale(1);
	}
	
}

.slide-in {
  animation: slide-in 5s ease-in-out;
  
}

.flex-custom {
  display: flex;
  flex-wrap: wrap;
}

/*  240312 모바일 상단 수정 및 X 버튼 추가 - kaimen 서주원 */
.btn-pc-goback {margin-left: 30px;}
.x-button {
    position: relative;
    width: 23px;
    height: 23px;
}

.x-button .line1, .x-button .line2 {
    position: absolute;
    width: 23px;
    height: 2px;
    background-color: #fff;
}

.x-button .line1 {
    transform: rotate(45deg);
    top: 10.5px;
}

.x-button .line2 {
    transform: rotate(-45deg);
    top: 10.5px;
}

.navbar-container > .navbar .container .btn-mo-goback {
    display: none;
}
@media all and (max-width: 991px) {
    .btn-pc-goback {
        display: none;
    }
    .navbar-container > .navbar .container {
        justify-content: space-between;
    }
    .navbar-container > .navbar .container .navbar-brand {
        order: 2;
        margin-right: 0 !important;
    }
    .navbar-container > .navbar .container .navbar-toggler {
        order: 1;
    }
    .navbar-container > .navbar .container .btn-mo-goback {
        order: 3;
        display: block;
    }
    .navbar-container > .navbar .container .btn-mo-goback .navbar-toggler-close {
        position: relative;
    }
    .navbar-container > .navbar .container .btn-mo-goback .navbar-toggler-close * {
        fill: #fff !important;
    }
    .navbar-container > .navbar .container .navbar-collapse {
        order: 4;
    }

}