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

html {
	overflow-x: hidden;
	color: #191919;
  font-family: 'NanumSquareRound', sans-serif;
	font-size: 62.5% !important;
	letter-spacing: -0.01em;
	word-break: keep-all;
	word-wrap: break-word;
	box-sizing: border-box;
	-webkit-overflow-scrolling: touch;
	-webkit-tap-highlight-color : transparent !important;
	animation:entry .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;
	border: none;
	outline: none;
	cursor: pointer;
	color: inherit;
	-webkit-appearance: none;
	background: none;
}

select {
	outline: none;
	border: 1px solid transparent;
	font-family: inherit;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
}

input, textarea {
	font-family: inherit;
	outline: none;
	border: 1px solid transparent;
}

:focus {
	outline: none;
}

::placeholder {
	color:#888888;
}

em, i {
	font-style: normal;
}

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

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

@media screen and (max-width:1200px) {

}
@media screen and (max-width:1024px) {

}
@media screen and (max-width:768px) {

}
@media screen and (max-width:576px) {

}


/* 블라인드 */
.blind {
	overflow: hidden;
	position: absolute;
	width: 1px;
	height: 1px;
	clip: rect(1px, 1px, 1px, 1px);
}


/* 디스플레이 */
.d-block {
  display: block;
}


/* 포지션 */
.position-relative {
  position: relative;
}


/* 줄바꿈 */
.lg {
  display: block;
}

.md {
  display: block;
}

.sm {
  display: block;
}

@media screen and (max-width:1200px) {
  .lg {
    display: none;
  }
}
@media screen and (max-width:1024px) {
  .md {
    display: none;
  }
}
@media screen and (max-width:768px) {
  .sm {
    display: none;
  }
}
@media screen and (max-width:576px) {

}

/* 플렉스 */
.d-flex {
  display: flex;
}


/* 플렉스 줄바꿈 */
@media screen and (max-width:768px) {
  .flex-sm-wrap {
    flex-wrap: wrap;
  }
}


/* 플렉스 정렬 */
.align-center {
  align-items: center;
}


/* 플렉스 순서 */


/* 버튼 */
.btn {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 0px 30px;
  border-radius:10px;
  -webkit-transition: all .4s ease;
  transition: all .4s ease;
  font-family: 'Spoqa Han Sans Neo', 'sans-serif';
  font-size: 2rem;
}

.btn i {
  display: inline-block;
  width:26px;
  height:16px;
  background: url('../img/icon/ico_arr01.png') no-repeat center;
  -webkit-transition: all .4s ease;
  transition: all .4s ease;
}

.btn--white {
  color:#f58466;
  background-color: #fff;
}

.btn--white i {
  background-image: url('../img/icon/ico_arr02.png');
}

.btn--red01 {
  color:#fff;
  background-color: #f58466;
}

.btn--orange01 {
  color:#fff;
  background-color: #fbb040;
}

@media screen and (min-width:1201px) {
  .btn:hover i {
    transform: translateX(15px);
  }

  .btn--red01:hover {
    background-color:#f55a2f;
  }

  .btn--orange01:hover {
    background-color: #e69823;
  }
}

@media screen and (max-width:1200px) {
  .btn {
    font-size:1.8rem;
  }
}
@media screen and (max-width:1024px) {
  .btn {
    padding:0px 20px;
  }

  .btn i {
    width: 22px;
    background-size: 22px auto;
  }
}
@media screen and (max-width:768px) {
  .btn {
    font-size:1.6rem;
  }
}
@media screen and (max-width:576px) {
  .btn {
    padding:0px 16px;
    font-size:1.2rem;
  }

  .btn i {
    width: 17px;
    background-size: 17px auto;
  }
}


/* 랩 */
.wrap--sub {
  padding-top: 80px;
}

.wrap--policy {
  padding-top: 80px;
}

@media screen and (max-width:1200px) {
  .wrap--sub {
    padding-top: 70px;
  }

  .wrap--policy {
    padding-top: 70px;
  }
}


/* 컨테이너 */
.container {
  max-width: 1400px;
  width: 95%;
  margin:0 auto;
}


/* 메인 */
#main {
  min-height: calc(100vh - 280px);
  overflow: hidden;
}


/* 상단 */
#header[data-header-theme = "white"] {
  background-color: #fff;
}

#header[data-header-theme = "white"] .h_logo a {
    background-image: url('../img/common/h_logo_b.svg');
}

#header[data-header-theme = "white"] .h_menu__link {
    color:#191919;
}

#header {
  position: fixed;
  top:0;
  left:0;
  width: 100%;
  z-index:100;
  -webkit-transition:all .3s ease;
  transition:all .3s ease;
}

#header::after {
  content: "";
  display: block;
  position: absolute;
  top:80px;
  left:0px;
  width: 100%;
  height: 1px;
  background-color: rgba(255,255,255,.5);
  z-index:6;
}

#header .h-inner {
  position: relative;
  display: flex;
  justify-content: center;
  z-index: 10;
}

#header .h-background {
	overflow:hidden; 
	position:absolute; 
	top:0px;
	left:50%;
	transform:translateX(-50%);
	width:200vw; 
	height: 250px;
	background:#fff; 
	opacity:0;
	visibility: hidden;
	z-index:5;
	transition:all .3s ease;
}

#header .h_logo {
  position: absolute;
  top:19px;
  left:31px;
  width: 210px;
  height: 43px;
  z-index:90;
}

#header .h_logo a {
  display: block;
  width: 100%;
  height:100%;
  background: url('../img/common/h_logo_w.svg') no-repeat center;
}

#header .h_menu {
  display: flex;
  font-family: 'Spoqa Han Sans Neo', 'sans-serif';
}

#header .h_menu__li {
  position: relative;
}

#header .h_menu__link {
  display: block;
  position: relative;
  padding:31px 0px;
  margin: 0px 50px;
  font-size:1.8rem;
  font-weight:500;
  line-height: 1;
  color:#fff;
  -webkit-transition:all .4s ease;
  transition:all .4s ease;
}

#header .h_menu__link::after {
  content: "";
  display: block;
  position: absolute;
  left:50%;
  bottom:-1px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 0px;
  height: 3px;
  background-color: #fbb040;
  -webkit-transition:all .3s ease;
  transition:all .3s ease;
}

#header .h_submenu {
  position: absolute;
  top:100%;
  left:50%;
  transform: translateX(-50%);
  width: 100%;
  height:170px;
  padding:30px 10px 0px;
  text-align: center;
  white-space: nowrap;
  opacity:0;
  visibility: hidden;
  -webkit-transition:all .1s ease;
  transition:all .1s ease;
}

#header .h_submenu li:not(:last-child) {
  margin-bottom:20px;
}

#header .h_submenu a {
  font-size:1.6rem;
}

#header .h_mobile {
  display: none;
  position: absolute;
  top:0;
  right:0;
  width: 70px;
  height: 70px;
  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: #141414;
}

#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;
	background-color: #191919;
  -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;
	background-color: #191919;
  -webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
  -webkit-transition-delay: 0s, 0.2s;
	transition-delay: 0s, 0.2s;
}

#header .h_nav {
  position: fixed;
  top:0;
  left:0;
  width: 100%;
  height:100%;
  padding:90px 15px 0px;
  background-color: #fff;
  opacity:0;
  visibility: hidden;
  z-index:49;
  -webkit-transition: all .4s ease;
  transition: all .4s ease;
}

#header .nav_menu__li {
  position: relative;
  font-family: 'Spoqa Han Sans Neo', 'sans-serif';
}

#header .nav_menu__link {
  display: block;
  position: relative;
  padding:15px 0px;
  font-size:1.6rem;
  line-height: 1;
  border-bottom: 1px solid #e3e3e3;
}

#header .nav_menu__link::before,
#header .nav_menu__link::after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  right:0px;
  width: 10px;
  margin-top: -1px;
  background-color: #191919;
  height: 2px;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transition:all .4s ease;
  transition:all .4s ease;
}

#header .nav_menu__link::before {
  z-index: 2;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  opacity: 1;
}

#header .nav_submenu {
  height:auto;
  max-height: 0px;
  opacity: 1;
  overflow: hidden;
  visibility: visible;
  -webkit-transition: all .4s ease;
  transition: all .4s ease;
}

#header .nav_submenu li {
  margin-top:15px;
}

#header .nav_submenu a {
  font-size:1.4rem;
}

#header .nav_menu__link.on + .nav_submenu {
  max-height:260px;
  margin:0px 0px 24px;
}

#header .nav_menu__link.on::before {
	transform: rotate(0deg);
}

#header .nav_menu__link.on::after {
	opacity: 0;
	transform: rotate(180deg);
}

@media screen and (min-width:1201px){
  /* 호버 */
  #header .h_menu__li:hover .h_menu__link::after {
    width: 100%;
  }


  /* 이벤트 */
  #header.active {
    background-color: #fff;
  }

  #header.active .h_logo a {
    background-image: url('../img/common/h_logo_b.svg');
  }

  #header.active .h_menu__link {
    color:#191919;
  }

  #header[header-hover = "on"]::after {
    background-color: rgba(210,210,210,.5);
  }

  #header[header-hover = "on"] .h-background {
    opacity: 1;
    visibility: visible;
  }

  #header[header-hover = "on"] .h_logo a {
    background-image: url('../img/common/h_logo_b.svg');
  }

  #header[header-hover = "on"] .h_menu__link {
    color:#191919;
    margin:0px 70px;
  }

  #header[header-hover = "on"] .h_submenu {
    opacity: 1;
    visibility: visible;
  }
}
@media screen and (max-width:1200px) {
  #header {
    height:70px;
    background-color: #fff;
    box-shadow: 0px 0px 8px 0px rgba(0,0,0,.15);
  }

  #header::after {
    display: none;
  }

  #header .h_logo {
    top:17px;
    left:15px;
    width:180px;
    height:36px;
  }

  #header .h_logo a {
    background-image: url('../img/common/h_logo_b.svg');
    background-size: auto 36px;
  }

  #header .h_menu {
    display: none;
  }

  #header .h_mobile {
    display: block;
  }

  /* 이벤트 */
  #header[data-header-mobile = "on"] .h_nav {
    opacity: 1;
    visibility: visible;
  }
}
@media screen and (max-width:1024px) {

}
@media screen and (max-width:768px) {

}
@media screen and (max-width:576px) {

}


/* 하단 */
#footer {
  font-family: 'Spoqa Han Sans Neo', 'sans-serif';
  padding:60px 0px;
  background-color: #fff9f0;
}

#footer .f-container {
  max-width:1400px;
  width:95%;
  margin:0 auto;
}

#footer .f-inner {
  position: relative;
  padding-left: 23.5714%;
}

#footer .line::after {
  content: "";
  display: block;
  position: absolute;
  top:50%;
  right:0;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 1px;
  height:16px;
  background-color: #191919;
}

#footer .f_logo {
  width: 210px;
  height:130px;
  background: url('../img/common/f_logo.svg') no-repeat center  / cover;
}

#footer .f_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 14px;
  margin-bottom: 30px;
  border-bottom: 1px solid #c9c9c9;
}

#footer .f_mem {
  display: flex;
  margin:0px -12px;
  font-size:0px;
}

#footer .f_mem li {
  position: relative;
  padding: 0px 12px;
}

#footer .f_mem a {
  font-size:1.8rem;
  line-height:1;
}

#footer .f_sns {
  display: block;
  width:30px;
  height:30px;
  background: url('../img/common/f_sns01.svg') no-repeat center / cover;
}

#footer .f_info {
  display: flex;
  flex-wrap: wrap;
  margin:-8px -12px;
  font-size: 0px;
}

#footer .f_info li {
  position: relative;
  margin: 8px 0px;
  padding:0px 12px;
  font-size:1.8rem;
  line-height:1;
}

#footer .f_info li:last-child {
  width: 100%;
}

#footer .f_copy {
  font-size:1.8rem;
  margin-top:20px;
}

@media screen and (min-width:769px){
  #footer .f_logo {
    position: absolute;
    top:50%;
    left:0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
}
@media screen and (max-width:1200px) {
  #footer .line::after {
    height:14px;
  }

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

  #footer .f_info li {
    font-size:1.6rem;
  }

  #footer .f_copy {
    font-size:1.6rem;
  }
}
@media screen and (max-width:1024px) {
  #footer .f_logo {
    width: 170px;
    height:90px;
    background-size:auto 90px;
  }

  #footer .f_top {
    padding-bottom:10px;
    margin-bottom:20px;
  }

  #footer .f_mem {
    margin:0px -8px;
  }

  #footer .f_mem li {
    padding: 0px 8px;
  }

  #footer .f_sns {
    width:24px;
    height:24px;
  }

  #footer .f_info {
    margin: -6px -8px;
  }

  #footer .f_info li {
    padding:0px 8px;
  }

  #footer .f_copy {
    margin-top: 14px;
  }
}
@media screen and (max-width:768px) {
  #footer {
    padding:40px 0px;
  }

  #footer .f-inner {
    padding:0px;
  }

  #footer .line::after {
    height:12px;
  }

  #footer .f_logo {
    margin:0 auto 30px;
  }

  #footer .f_mem a {
    font-size:1.4rem;
  }

  #footer .f_info li {
    font-size: 1.4rem;
  }

  #footer .f_copy {
    font-size:1.4rem;
  }
}
@media screen and (max-width:576px) {
  #footer {
    padding:30px 0px;
  }

  #footer .line--mo::after {
    display: none;
  }

  #footer .f_logo {
    width: 150px;
    height:70px;
    background-size: auto 70px;
  }

  #footer .f_top {
    padding-bottom: 6px;
    margin-bottom: 16px;
  }

  #footer .f_mem a {
    font-size:1.2rem;
  }

  #footer .f_sns {
    width:20px;
    height:20px;
  }

  #footer .f_info {
    text-align: center;
    margin:-4px;
  }
  
  #footer .f_info li {
    width: 100%;
    margin:4px 0px;
    padding:0px 4px;
    font-size:1.2rem;
  }

  #footer .f_copy {
    text-align: center;
    font-size:1.2rem;
    margin-top:10px;
  }
}