@charset "utf-8";

/* @import url('global.css'); */
@font-face {
  font-family: 'nstp';
  src:
	url('../webfonts/nstp.ttf?pnx8n56') format('truetype'),
	url('../webfonts/nstp.woff?pnx8n56') format('woff'),
	url('../webfonts/nstp.svg?pnx8n56#lyn') format('svg');
  font-weight: normal;
  font-style: normal;
}

.nstp { 
  font-family: 'nstp' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1; 
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.nstp.h:before {
  content: "\e900";
}
.nstp.g:before {
  content: "\e901";
}
.nstp.e:before {
  content: "\e902";
}
.nstp.j:before {
  content: "\e903";
}
.nstp.i:before {
  content: "\e907";
}
.nstp.l:before {
  content: "\e908";
}
.nstp.f:before {
  content: "\e909";
}
.nstp.k:before {
  content: "\e90a";
}
.nstp.m:before {
  content: "\e904";
}
.nstp.n:before {
  content: "\e905";
}
.nstp.o:before {
  content: "\e906";
}
.nstp.a:before {
  content: "\e91f";
}
.nstp.b:before {
  content: "\e920";
}
.nstp.c:before {
  content: "\e921";
}
.nstp.d:before {
  content: "\e922";
}

*:focus {
	outline: 0!important;
}
*,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
a {
	margin: 0;
	padding: 0;
}
body.dark {
	font-size: 16px;
	line-height: 130%;
	font-family: 'Noto Sans KR',sans-serif;
	color: #fff;
	background-color: #171717;
	font-weight: 400;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
	font-family: 'Noto Sans KR',sans-serif;
	color: #fff;
	font-weight: 400;
	font-variant-ligatures: common-ligatures;
	margin-top: 0;
	margin-bottom: 0;
}
a {
	text-decoration: none;
	color: inherit;
}
a:hover {
	color: inherit;
}
ul,
ol {
  list-style: none;
  line-height: 1.85714286em;
}
button,
.btn {
	line-height: 124%;
}
button:focus,
.btn:focus {
	outline: 0!important;
	box-shadow: none!important;
}
.nav-menu {
	display: flex;
	padding: 15px;
}
.height-30 {
	height: 30vh;
}
.height-50 {
    height: 50vh;
}
.img-holder {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
}
.img-holder img:first-child {
	width: 300px;
	position: absolute;
	top: 5rem;
	left: 5rem;
}
.img-holder img:last-child {
	width: 680px;
	position: absolute;
	bottom: 3.5rem;
	left: 5rem;
}
.search-container {
	padding: 16px 0;
	border-top: 2px solid #a6a6a6;
	border-bottom: 2px solid #a6a6a6;
}
.search-input {
	background-color: transparent;
	border: none;
	line-height: 110%;
	color: #fff;
	width: 100%;
}
.search-btn {
	background-color: transparent;
	border: 0;
	color: #777;
}
input:focus::-webkit-input-placeholder,
textarea:focus::-webkit-input-placeholder { 
	color:transparent; 
}
.best-keyword {
	color: #aeaeae;
}
.best-keyword p {
	font-size: 14px;
}
.best-keyword .btn {
	font-size: 14px;
	padding: 8px 20px;
	margin: 5px 5px 5px 0;
}
.best-keyword .btn:hover {
	background-color: #FF733C;
	color: #fff;
}
.search-result-container {
	cursor: pointer;
}
.search-result-btn .btn,
.btn.basic-black-btn  {
	padding: 12px 35px;
	margin: 20px 0;
	background-color: #343434;
	color: #626262;
}
.btn.basic-grey-btn {
	padding: 12px 35px;
	background-color: #aaaaaa;
	color: #4e4e4e;
	border-radius: 10px;
}
.search-result-btn .btn:hover {
	color: #FF733C;
}
.slider.responsive .slide-item {
	height: auto;
	padding: 0 5px;
}
.slider.responsive .slide-item img,
.search-result-container img {
	width: 100%;
}
.image {
	position: relative;
	margin-bottom: 10px;
}
.image .overlay-black {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: .5;
}
.image .overlay-orange {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #FF733C;
	opacity: 0;
}
.image .overlay-orange:hover {
	opacity: .5;
}
.slide-title-container .slide-title,
.search-result-title-container .search-result-title {
	margin-bottom: 10px;
	min-height: 42px;
}
.tag-group {
	flex-wrap: wrap;
	justify-content: space-between;
	
}
.slide-tag {
	padding-right: 10px;
	font-size: 12px;
	color: #6e6e6e;
}
.limit-2 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	line-height: 21px;
	max-height: 48px;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.search-result {
	padding: 0 5px;
	margin-bottom: 50px;
}
.container-xl hr {
	opacity: 1;
	color: #282828;
}
.modal-dialog {
	max-width: 700px;
}
body.dark .modal-content {
	background-color: #dcdcdc;
	color: #000;
	border: 0;
	border-radius: .7rem;
}
body.dark .modal-header {
	border: 0;
}
body.dark .btn-close {
	background: transparent;
	opacity: 1;
	padding: 1rem;
	margin-left: auto;
}
.modal-footer input,
.modal-footer textarea {
	border: 1px solid #a8a8a8;
	background-color: transparent;
	border-radius: 10px;
	padding: 11px;
	font-size: 14px;
}
.modal-footer textarea {
	min-height: 100px;
}

.slick-prev, .slick-next {
	position: absolute;
	top: -43px;
	width: 32px;
	height: 28px;
	text-align: center;
	border: 0;
	background-color: #343434;
	color: #626262;
	border-radius: 5px;
}
.slick-prev {
	right: 35px;
}
.slick-next {
	right: 0;
}

@media (max-width: 992px) {
	.img-holder img:first-child {
		width: 35%;
	}
	.img-holder img:last-child {
		width: 70%;
	}
}
@media (max-width: 992px) {
	.img-holder img:first-child {
		width: 35%;
	}
	.img-holder img:last-child {
		width: 70%;
	}
}

/* footer */
footer.bg-dark {
	background-color: #262626!important;
}
footer.space-sm {
	padding: 50px 0;
}
footer {
	font-size: 12px;
	color: #fff;
	opacity: .4;
}
.social-icons a {
	padding-right: 20px;
}
.pointer {
	cursor: pointer;
}


/*! -- Stack Utilties -- */
.hidden {
  display: none !important;
  visibility: hidden !important;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}