@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
@import url("https://hangeul.pstatic.net/hangeul_static/css/nanum-square.css");



* {
margin:0;
padding:0;
border:0;
font-family: 'Noto Sans Kr', 'Malgun Gothic', 'Exo 2', Roboto, 'NanumS', Dotum, Arial, sans-serif;
font-weight: normal; font-size: 12px;
}
html,body{width:100%;height:100%; }
body, p, ul, ol, li, dl, dt, dd, form, table, th, td, fieldset, input, textarea, select, button, h1, h2, h3, h4, h5, h6, pre, form { margin: 0; padding: 0; box-sizing: border-box;word-break: keep-all;}
ul, ol { list-style: none outside none;}
li { list-style: none;}
legend { *width:0}
table { border-collapse: collapse; border-spacing:0;}
textarea {font-family:'Noto Sans Kr', Roboto, 'Malgun Gothic', 'NanumS', Dotum, Arial, sans-serif;vertical-align: middle;}
label { display: inline-block; cursor:pointer;}
/*select { border: 1px solid #e1e1e1; height: 30px; line-height: 30px; width: 140px; font-size: 12px; color: #333; text-indent: 5px;}*/
input, select, button, label { vertical-align: middle; outline-width: 0;}
	
u { text-decoration: none;}
i { font-style: normal;}	
button { border:none 0; background:none; cursor:pointer;}
a { text-decoration: none; display: inline-block;}
a img { border: none;}
img {vertical-align:top; font-size: 1px;vertical-align: middle; border: 0; }
caption { overflow: hidden; visibility: hidden; height: 0; font-size: 0;}
legend { position: absolute; width: 0; height: 0; font-size: 0; line-height: 0; overflow: hidden; visibility: hidden;}

.clear { clear: both;}
.hide { display: none !important; /*visibility: hidden; height: 0; line-height: 0; font-size: 1px; */}
.png24 {tmp:expression(setPng24(this));}
.radio {width: 15px !important; height: 15px !important;}
.ir  { display: block; text-indent: -99999px; overflow: hidden; z-index: -1; font-size: 1px; height:1; width: 1; line-height: 0;}
.ellipsis {overflow:hidden;word-break:break-all; text-overflow:ellipsis;-o-text-overflow:ellipsis;}
*, *::before, *::after { box-sizing: border-box;}




/* main */
.event_area { height: 100vh; /*calc(100vh - 135px);*/}
.carousel.slide, .carousel-inner { height: 100%; background: #000;}
.carousel-item, .carousel-item.active { position: absolute; left:0; top:0;}
.carousel-item .link_area {opacity: 0; width: 100%; position: absolute; left: 0; top: 0;
	-webkit-transition-duration: 1s; transition-duration: 1s;
	-webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;
}
.carousel-item.active .link_area {opacity: 1; width: 100%; position: absolute; left: 0; top: 0;
	-webkit-transition-duration: 1s; transition-duration: 1s;
	-webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;
}
.carousel-item { height: 100%;}
.image-container { background-position: center;}
/*
.event_area .link_area img {-webkit-animation: bgScale 8000ms 1 ease-out; -o-animation: bgScale 8000ms 1 ease-out; animation: bgScale 8000ms 1 ease-out;
-webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); overflow: hidden; width: 100%; object-fit:cover; }
.carousel-item img {transform:scale(1); }
.carousel-item.active img {-webkit-transition-duration:7s;transition-duration:7s;-webkit-transform:scale(1.07);-ms-transform:scale(1.09);transform:scale(1.09); object-fit: cover;}
*/

.link_area {-webkit-animation: bgScale 7000ms 1 ease-out; -o-animation: bgScale 7000ms 1 ease-out; animation: bgScale 7000ms 1 ease-out;
-webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); overflow: hidden; width: 100%; object-fit:cover; height: 100%;}
.link_area.img1 {background: url(../img/01.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center;}
.link_area.img2 {background: url(../img/02.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center;}
.link_area.img3 {background: url(../img/03.jpg); background-size: cover; background-repeat: no-repeat; background-position: center center;}

	
@-webkit-keyframes bgScale {
	0% { -webkit-transform: scale(1.2); }
	100% { -webkit-transform: scale(1); }
}
@keyframes bgScale {
	0% { transform: scale(1.2); }
	100% { transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale {
	0% { -o-transform: scale(1.2); }
	100% { -o-transform: scale(1); }
}
@-webkit-keyframes bgScale {
	0% { -webkit-transform: scale(1.2); }
	100% { -webkit-transform: scale(1); }
}
@keyframes bgScale {
	0% { transform: scale(1.2); }
	100% { transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale {
	0% { -o-transform: scale(1.2); }
	100% { -o-transform: scale(1); }
}




.link_area2 {-webkit-animation: bgScale2 8000ms 1 ease-out; -o-animation: bgScale2 8000ms 1 ease-out; animation: bgScale2 8000ms 1 ease-out; -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); overflow: hidden; width: 100%; object-fit:cover; height: 100%;}


@-webkit-keyframes bgScale2 {
	0% { -webkit-transform: scale(1.05); }
	100% { -webkit-transform: scale(1); }
}
@keyframes bgScale2 {
	0% { transform: scale(1.05); }
	100% { transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale2 {
	0% { -o-transform: scale(1.05); }
	100% { -o-transform: scale(1); }
}
@-webkit-keyframes bgScale2 {
	0% { -webkit-transform: scale(1.05); }
	100% { -webkit-transform: scale(1); }
}
@keyframes bgScale2 {
	0% { transform: scale(1.05); }
	100% { transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale2 {
	0% { -o-transform: scale(1.05); }
	100% { -o-transform: scale(1); }
}



.link_area3 {-webkit-animation: bgScale3 2000ms 1 ease-out; -o-animation: bgScale3 2000ms 1 ease-out; animation: bgScale3 2000ms 1 ease-out; -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); overflow: hidden; width: 100%; object-fit:cover; height: 100%;}


@-webkit-keyframes bgScale3 {
	0% { -webkit-transform: scale(1.05); }
	100% { -webkit-transform: scale(1); }
}
@keyframes bgScale3 {
	0% { transform: scale(1.05); }
	100% { transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale3 {
	0% { -o-transform: scale(1.05); }
	100% { -o-transform: scale(1); }
}
@-webkit-keyframes bgScale3 {
	0% { -webkit-transform: scale(1.05); }
	100% { -webkit-transform: scale(1); }
}
@keyframes bgScale3 {
	0% { transform: scale(1.05); }
	100% { transform: scale(1) rotate(0.02deg); }
}
@-o-keyframes bgScale3 {
	0% { -o-transform: scale(1.05); }
	100% { -o-transform: scale(1); }
}



.fadeOut {animation: fadeOut 0.4s 0s linear alternate; animation-fill-mode: both; width: 100%; height: 685px; background:#000; position: absolute; left:0; top:0; transition: 0.2s; transition-delay: 0.2s; display: inline-block; z-index: 35;}

@-webkit-keyframes fadeOut {
	0% { opacity:1}
	100% { opacity:0;}
}

/*
.fadeOut_bg {animation: fadeOut_bg 5s 0.5s linear alternate; animation-fill-mode: both; width: 100%; height: 685px; background:#000; position: absolute; left:0; top:0; transition: 0.2s; transition-delay: 0.2s; display: inline-block; z-index: 35; background: url(../img/top_history.jpg) no-repeat left top;}

@-webkit-keyframes fadeOut_bg {
	0% { position: absolute; top:0; left:0; transform: scale(1.05); }
	100% { position: absolute; top: -30px; left:0; transform: scale(1); }
}
*/

/* À̹ÌÁö ij·¯¼¿ */
.carousel {
  position: relative;
}

.carousel.pointer-event {
  touch-action: pan-y;
}

.carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.carousel-inner::after {
  display: block;
  clear: both;
  content: "";
}

.carousel-item {
  position: relative;
  display: none;
  float: left;
  width: 100%;

  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transition: transform 0.6s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  .carousel-item {
    transition: none;
  }
}

.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
  display: block;
}

/* rtl:begin:ignore */
.carousel-item-next:not(.carousel-item-start),
.active.carousel-item-end {
  opacity: 1; width: 100%; 
	-webkit-transition-duration: 0.5s; transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;
}


.carousel-item-prev:not(.carousel-item-end),
.active.carousel-item-start {
  opacity: 1; width: 100%; 
	-webkit-transition-duration: 0.5s; transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;
}


/* rtl:end:ignore */
.carousel-fade .carousel-item {
  opacity: 1; width: 100%;
	-webkit-transition-duration: 0.5s; transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;
}
.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-start,
.carousel-fade .carousel-item-prev.carousel-item-end {
  z-index: 1;
  opacity: 1;
}
.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
  z-index: 1;
  opacity: 1;
  transition: opacity 0s 1s;
}
@media (prefers-reduced-motion: reduce) {
  .carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
    transition: opacity 1s;
  }
}
/* À̹ÌÁöÄÉ·¯¼¿ */
.carousel-caption {
  position: absolute;
  right: 15%;
  top: 40%;
  left: 15%;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  color: #fff;
  text-align: center;
}
.carousel-caption h5 { font-size: 65px; font-family:'Noto Sans Kr'; line-height: 40px; margin-bottom: 60px; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05); font-weight: 600; letter-spacing: 50px; text-indent:50px;}
.carousel-caption p { font-size: 17.5px; line-height: 32px; font-family:'Noto Sans Kr'; font-weight: 400; opacity: 0.9;}
.carousel-caption h5 b { font-size: inherit; font-weight: bold;}

.carousel-item .carousel-caption { opacity:0; transition: 0.5s; transition-delay: 0.5s;}
.carousel-item.active .carousel-caption { opacity: 1; transition: 0.5s; transition-delay: 0.5s;}

/* À̹ÌÁöÄÉ·¯¼¿ ¹öÆ° */
.carousel-control-prev,
.carousel-control-next {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15%;
  padding: 0;
  color: #fff;
  text-align: center;
  background: none;
  border: 0;
  opacity: 0.5;
  transition: opacity 0.15s ease;
}
@media (prefers-reduced-motion: reduce) {
 .carousel-control-prev,
.carousel-control-next {
    transition: none;
  }
}
.carousel-control-prev:hover, .carousel-control-prev:focus,
.carousel-control-next:hover,
.carousel-control-next:focus {
  color: #fff;
  text-decoration: none;
  outline: 0;
  opacity: 0.9;
}

.carousel-control-prev {
  left: 0;
}

.carousel-control-next {
  right: 0;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 100% 100%;
}

/* rtl:options: {
  "autoRename": true,
  "stringMap":[ {
    "name"    : "prev-next",
    "search"  : "prev",
    "replace" : "next"
  } ]
} */
.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

.carousel-indicators {
  position: absolute;
  right: 0;
  top: 60%;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  padding: 0;
  margin-right: 15%;
  margin-bottom: 1rem;
  margin-left: 15%;
  list-style: none;
}
.carousel-indicators [data-bs-target] {
  box-sizing: content-box;
  flex: 0 1 auto;
  width: 12px;
  height: 12px;
  border-radius:12px;
  padding: 0;
  margin-right: 3px;
  margin-left: 4px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  border: 0;
  opacity: 0.5;
  transition: opacity 0.6s ease;
}
@media (prefers-reduced-motion: reduce) {
  .carousel-indicators [data-bs-target] {
    transition: none;
  }
}
.carousel-indicators .active {
  opacity: 1;
  background-color: #ffffff;
}


.carousel-dark .carousel-control-prev-icon,
.carousel-dark .carousel-control-next-icon {
  filter: invert(1) grayscale(100);
}
.carousel-dark .carousel-indicators [data-bs-target] {
  background-color: #000;
}
.carousel-dark .carousel-caption {
  color: #000;
}

.bs-popover-start > .popover-arrow, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow {
  right: calc(-0.5rem - 1px);
  width: 0.5rem;
  height: 1rem;
}
.bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::before {
  right: 0;
  border-width: 0.5rem 0 0.5rem 0.5rem;
  border-left-color: rgba(0, 0, 0, 0.25);
}
.bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::after {
  right: 1px;
  border-width: 0.5rem 0 0.5rem 0.5rem;
  border-left-color: #fff;
}

.popover-header {
  padding: 0.5rem 1rem;
  margin-bottom: 0;
  font-size: 1rem;
  background-color: #f0f0f0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  border-top-left-radius: calc(0.3rem - 1px);
  border-top-right-radius: calc(0.3rem - 1px);
}
.popover-header:empty {
  display: none;
}

.popover-body {
  padding: 1rem 1rem;
  color: #212529;
}


.gnb_menu { z-index: 50;}
.depth01 > li {}


ul { list-style: none outside none; margin: 0; padding: 0;}
li { ist-style: none; margin: 0; padding: 0;}
.hide { display: none !important;}
.f_r { float: right;}


/* °øÅë */

.logo { position: absolute; left: 30px; top: 33px;width: 283px; height: 53px; background: url(../img/logo.png) no-repeat left top; text-indent: -9999px; overflow: hidden; display: inline-block;transition: 0.2s; transition-delay: 0.2s; float: left;}
.logo_m {width: 164px; height: 35px; background: url(../img/logo_m.png) no-repeat right top; text-indent: -9999px; position: absolute; left: 310px; top: 34px; overflow: hidden; display: inline-block;transition: 0.2s; transition-delay: 0.2s; float: left; margin-top: 7px; margin-left:20px; padding-left: 20px; float: left;}
.logo_m::before { content:""; display:inline-block; width: 1px; height:35px; background-color:#fff; position:absolute; left:0; top: 0px; margin-right: 20px; opacity: 0.5;transition: 0.2s; transition-delay: 0.2s;}
.main_gnb .logo {background: url(../img/logo.png) no-repeat left top; width: 283px;height: 53px; }
.main_gnb.gnb_menu  {background: transparent; border-bottom: 0;}
.gnb_menu.on .logo {background: url(../img/logo_b.png) no-repeat left top; width: 283px;height: 53px;}
.gnb_menu.on .logo_m { background: url(../img/logo_m_b.png) no-repeat right top; }
.gnb_menu.on .logo_m::before { background-color:#000; opacity: 0.2;}


.gnb_menu { position: absolute; left:0; top:0; width: 100%; height: 115px;transition: 0.2s; transition-delay: 0.2s; border-bottom: 1px solid rgba(225, 225, 225, 0.3); background: transparent; z-index:50;}
.gnb_menu .header_right { position: absolute; right:31px; top: 34px; }
.gnb_menu .header_right li a {font-family: 'Noto Sans KR'; font-weight: 400; color: #fff; font-size: 12px; margin-left: 12px;}
.gnb_menu li { display: inline-block; float: left;}

.main_gnb.gnb_menu .depth01 a { color: #fff;}
.main .gnb_menu .depth01 a {text-shadow:0px 0px 5px rgba(0, 0, 0, 0.05);}
.gnb_menu .depth01 { padding-right:70px;}
.gnb_menu .depth01 a {font-family: 'Noto Sans KR';font-weight: 600;color: #000;letter-spacing: -0.035em;text-align: center;width: 100%;font-size: 22px;line-height: 115px;height: 115px;display: inline-block;font-weight: 700;transition: 0.2s;transition-delay: 0.2s; color: #fff;}
.gnb_menu .depth02 a {font-family: 'Noto Sans KR'; font-weight: 400; color: #666 !important; text-align: left; width: 100%; font-size: 16px; line-height: 38px; height: 38px; display: inline-block;transition: 0s; transition-delay: 0s; margin-left: 35px;}
.gnb_menu .depth02 a:hover { color: #000 !important;}

.gnb_menu .depth01 { width:100%; display: flex; flex-wrap: nowrap; justify-content: right; align-items: center;}
.gnb_menu .depth01 > li {position: relative; padding: 0 35px;}
.gnb_menu .depth02 {  position: absolute; left:0px; top: 132px; width: 150px; transition: 0.2s; transition-delay: 0.2s; opacity:0; height:0; overflow: hidden;}
.gnb_menu .depth02 li { display: inline-block; float: left; width:100%;}

.gnb_menu .depth01 > li.mo_failysite { display: none;}


.gnb_menu.on { background-color: #fff; height: 226px;}
.gnb_menu.on .depth02 { display: inline-block; opacity:1; height: 100px;overflow: visible;transition: 0.2s; transition-delay: 0.2s;}
.gnb_menu.on .depth01 a { color: #000;}
.gnb_menu::after { content:""; display: inline-block; height:1px; background:#fff; width: 100%; opacity: 0; float: left; transition: 0.2s; transition-delay: 0.2s;}
.gnb_menu.on::after { content:""; display: inline-block; height: 1px; width: 100%; background:#e1e1e1; position: absolute; top: 115px; left:0; right:0; opacity: 1;}

.bgbg {max-width: 630px; width:calc(50% - 50px); height: 330px; position: absolute; z-index: 1; left: 50%; top: 32%;}
.carousel-caption { z-index: 10;}
/*
.sub.onon .gnb_menu { background: #fff; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.05);}
.sub.onon .gnb_menu a { color: #000;}
*/
/* ¼­ºê ·¹À̾ƿô */
.wrap_sub_top { width: 100%; height: 775px; overflow: hidden;z-index: 20; position: relative;}
.sub_top_img { width: 100%; background-size: cover !important; height: 775px;}

.top_assemble { background: url(../img/top_assemble.jpg) no-repeat center center;}
.top_greet { background: url(../img/top_greet.jpg) no-repeat center center;}
.top_contact { background: url(../img/top_contact.jpg) no-repeat center center;}
.top_parts { background: url(../img/top_parts.jpg) no-repeat center center;}


.container { text-align: center; background-color: #f5f9fd; position: relative; z-index: 30; padding-bottom: 100px;}
.contents { width: 100%; display: inline-block; margin: 0 auto; text-align: left; margin-top: -104px; z-index: 30; background: #fff; padding: 100px; padding-bottom: 150px; padding-top: 120px; box-sizing: border-box; position: relative;}
.title { background: url(../img/bg_title.png) no-repeat right top; width: 397px; height: 266px; display: inline-block; text-align: left; padding-left: 40px; padding-top:66px; margin-top: -316px; margin-bottom: 50px;}
.title h1 { color: #fff; font-size: 30px; letter-spacing: -0.045em; font-weight: 400; }
.title h2 { color: #fff; font-size: 60px; letter-spacing: -0.025em; font-weight: 700; }

.con_left  { float: left; margin-right: 100px; width: 500px;}
.con_right { float: right; max-width: 600px;}
.con_left_left { float: left; width: 45%;}
.con_left_right { float: right; width: calc(55% - 30px);}

.con_nomal, .con_history { margin-top: 50px; position: relative;}
.con_nomal article { margin-bottom:110px; display: inline-block;}
.con_nomal article:last-child { margin-bottom: 0;}
.con_nomal article h3 {font-size: 24px;color: #a6b0ba;font-family:'Exo 2' !important;font-weight:500;height: 100px;position: relative;display: inline-block;width:100%;padding-left: 25px;margin-top: 31px;}
.con_nomal article h3::before {content:"";display: inline-block;width: 15px;height: 15px;border-radius: 25px;border: 3px solid #009bd9;margin-right: 10px;margin-left: -25px;}
.con_nomal article h3::after { content:""; display: inline-block;  background-color: #dee3e8; width: 1px; height: 70px; position: absolute; left: 7px; top: 26px;}
.con_nomal article strong { font-size: 34px; display: inline-block; width: 100%; font-weight: 800; color: #000; margin-bottom: 16px; position:relative; top: -5px; line-height: 46px; letter-spacing:-1px; }
.con_nomal article strong span {font-size: 34px; font-weight: 800;color: #009bd9;}
.con_nomal article strong i {font-size: 34px; display: inline-block; font-weight: 800;color: #999;}

.con_nomal article h3.noto { font-family:'Noto Sans Kr' !important; }

.con_nomal article p { color: #555; font-size: 17px; line-height: 33px; letter-spacing: -0.4px; word-break: keep-all;}
.con_nomal article p b { color: #000; background: url(../img/bg_underline.gif) repeat-x left top; font-size: 17px; font-weight: 500;}
.con_nomal article p.summary { font-size: 23px; color: #000; line-height: 35px; font-weight: 600; letter-spacing: -1.1px; margin-bottom: 45px; }
.con_nomal article p.con_tt { color: #000; margin-bottom: 14px; font-size: 18px; font-weight: 500;}
.con_nomal article p b i { color: #009bd9;font-size: 18px; font-weight: 500;}
.con_nomal article p span { color: #009bd9; font-size: 17px; line-height: 33px; letter-spacing: -0.4px; word-break: keep-all;}

.wrap_sub_top p { width: 100%;letter-spacing: -1px; position: absolute; left:0; top: 300px; z-index: 30; text-align: center; z-index:30;}
.wrap_sub_top p b {text-align: center; font-weight:bold; font-family:'Exo 2'; font-size:46px; display: inline-block; width: 100%; letter-spacing: 7px; color: #fff; margin: 0 auto; border-left:0; border-right: 0; text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.05); margin-bottom: 24px; text-indent: 6px;}
.wrap_sub_top p span {text-align: center; font-weight: 600;font-family:'Noto Sans Kr'; font-size: 74px; display: inline-block; width: 100%; letter-spacing:0px; color: #fff; margin: 0 auto; text-shadow:0px 0px 5px rgba(0, 0, 0, 0.05); }
.wrap_sub_top::after {content: ""; height: 363px; width: 321px; background:#0057a0; display: inline-block; z-index:10; opacity:0.9; position: absolute; top: calc(50% - 180px); left: calc(50% - 161px);}
.wrap_sub_top p u { color: #4198e1; font-family:'Exo 2'; font-size:46px; font-weight:bold;}
.wrap_sub_top p i { color: #9b9ca1; font-family:'Exo 2'; font-size:46px; font-weight: bold;}
.wrap_sub_top h2 { position:absolute; top: calc(50% - 133px); font-weight: 500; z-index:30; text-align: center; display: inline-block; width: 100%; color: #fff; font-size:22px; opacity: 0.8;}

.con_nomal article.mb_80 { margin-bottom: 80px;}

.mb_80 { margin-bottom: 80px !important;}
.mb_40 { margin-bottom: 40px !important;}
.mb_30 { margin-bottom: 30px !important;}
.mb_20 { margin-bottom: 20px !important;}
.mb_10 { margin-bottom: 10px !important;}


.mt0 { margin-top: 0 !important;}
.mt_80 { margin-top: 80px !important;}
.mt_40 { margin-top: 40px !important;}
.mt_30 { margin-top: 30px !important;}
.mt_20 { margin-top: 20px !important;}
.ml_30 { margin-left: 30px !important;}
.con_right_tt { width: 100%;}
.con_line { margin-top: 40px;}

.con_100 { width: 100%;}
article h4 { font-size:27px; font-weight: 800; margin-bottom: 40px;}
article h5 { font-size:20px; font-weight: 700; margin-bottom: 30px; letter-spacing: -0.025em;}
.summary2 { display: inline-block; font-weight: 500; margin-bottom: 30px; letter-spacing: -0.025em !important; color:#000 !important; font-size: 19px !important; letter-spacing:-0.025em; white-space: normal; word-break: break-all; word-wrap: break-word !important;}

.con_history h3 { margin-bottom: 26px;font-size: 46px; color: #009bd9;font-family:'Exo 2', Roboto; font-weight:700; letter-spacing: -2px; }
.con_history h3 b { font-size: 46px; font-weight: 600; color: #000;font-family:'Exo 2', Roboto; font-weight:700; letter-spacing: -2px;}
.con_history h3 span { font-size: 43px; color: #000;font-family:'Exo 2', Roboto; font-weight:800; letter-spacing: -3px;}

.con_history article { display: inline-block; margin-bottom: 120px;}
.con_history article p.summary { font-size: 23px; color: #000; line-height: 35px; font-weight: 600; letter-spacing: -1.1px; margin-bottom: 45px; }
.con_history article p { color: #555; font-size: 17px; line-height: 33px; letter-spacing: -0.4px; word-break: keep-all;}

.history_list { padding-left: 10px; padding-top: 30px;}
.history_list li { border-left:1px solid #dee3e8; font-size: 20px; font-weight:500; color: #666; padding-bottom: 50px; padding-left: 32px;}
.history_list li:last-child { border-left: 0; }
.history_list li b { font-size: 20px; color: #000; display: inline-block; width: 100%; font-family:'Exo 2' !important; font-weight:700; letter-spacing:-0.7px; position: relative; left: -40px; top: -10px;}
.history_list li b::before { content:""; display: inline-block; width: 15px; height: 15px; border-radius: 25px; border: 3px solid #009bd9; position: relative;background:#fff; margin-right: 25px;}

.btn_grai {background: linear-gradient(to right, #00a5dc, #f0ee1d); color: #fff; width: 311px; height: 100px; line-height: 100px; position: absolute; right:0; top:-230px; transition: 1; transition-delay: 1s;}
.btn_grai:hover {background: linear-gradient(to right, #00a5dc, 80%, #f0ee1d);}
.btn_grai b { background: url(../img/btn_right.png) no-repeat right 40px center; display: inline-block; width: 100%; height:100%; font-weight:500; line-height: 100px; color: #fff; font-size: 23px; text-indent: 40px; letter-spacing: -0.5px;}

.etc_info { background: #f5f9fd; padding: 80px 100px; width:calc(100% + 100px);}
.etc_info strong { font-size: 20px !important; font-weight: 600 !important; margin-bottom:0 !important;}
.cut_con {width: 100%; clear:both; margin-bottom: 120px;}
.btn_line { border: 1px solid #000; font-size: 17px; display: inline-block; height: 44px; line-height: 42px; width: 228px; color: #000; text-align: center; letter-spacing: -0.2px; margin-top: 40px;}
.btn_line:hover { background:#000; color: #fff;}

.img_twin { display: inline-block; position: relative; left: -70px; width: calc(100% + 50px); left: -60px; margin-top: 80px;}
.img_twin ul { width: 100%;}
.img_twin ul li {width: calc(50% - 20px) !important; margin-left: 20px; float: left;}
.img_twin img {  width: 100%;}

.box_2 { display: flex; width: 100%; flex-direction: row; flex-wrap: nowrap; justify-content: space-around; align-items: flex-start; margin-top: 40px;}
.box_2 li { margin-right:20px;}
.box_2 li:last-child { margin-right: 0;}
.box_2 ul { display: inline-block;}
.box_2 ul li { margin-right:10px; width: 48%;}
.box_2 ul li img { width: 100%;}
.box_2 ul li:last-child { margin-right:0 !important;}

.img_box { background-color:#f0f0f0; text-align: center; display: inline-block; margin-right: 10px; float: left;}
.img_box img { float: none;}
.img_box p { padding-bottom: 16px;}
.img_box::last-child { margin-right: 0;}

.contact_add { width: 100%;}
.contact_add .box_2 { justify-content: flex-start; margin-top:0px; border-bottom: 1px solid #e1e1e1; padding-bottom: 35px; margin-bottom: 40px;}
.contact_add .box_2:last-child { border-bottom: 0;}
.con_nomal article.contact_add strong { margin-bottom: 0;}
.contact_add .box_2 p { margin-right: 30px;}
.contact_add .box_2 p:last-child { margin-right: 0;}
.contact_add .box_2 p b { line-height: 58px;}
.contact_add .con_right {  width: calc(55% - 40px) !important; }

.con_right, .con_left, .con_line { position: relative;}
.txt_img { position: absolute; bottom: 0; left: 0; width: 100%; height: 50px; line-height: 50px; background-color: rgba(0, 0, 0, 0.6); color: #fff; font-size: 18px; text-align: center;}
.txt_img_opa { position: absolute; bottom: 0; left: 0; width: 100%; height: 14%; line-height: 14%; background-color: rgba(0, 0, 0, 0); color: #fff; font-size: 15px; text-align: center;}
.ul_img h4 { margin-bottom:26px !important;}
.ul_img li { position: relative;}

.dl_img { display: inline-block; width: 100%;}
.dl_img li { width: 100%; display: inline-block; float: left; margin-bottom:60px;}
.dl_img .dt { float: left; position: relative; width:42%;}
.dl_img .dt img { width: 100%;}
.dl_img .dd { float: left; margin-left: 100px; max-width: 600px; width:calc(58% - 100px);}

.bg_box { background: #f5f9fd; padding: 40px; text-align: center;}

.con_nomal article .tts p { padding-right: 0 !important;}
.tts li { background: #f5f9fd;}
.tts li h5 { color: #fff; display: inline-block; width: 100%; height: 50px; line-height: 50px; font-size: 19px; font-weight: 500; text-indent: 30px; margin-bottom:0;}
.tts li p { font-size: 17px; color: #666666; line-height: 33px; font-weight:500; margin: 30px;}
.tt_01 { border: 1px solid #009bd9;}
.tt_02 { border: 1px solid #2ab2bb;}
.tt_03 { border: 1px solid #05ac95;}
.tt_04 { border: 1px solid #9ecc44;}
.tt_01 h5 { background: #009bd9; }
.tt_02 h5 { background: #2ab2bb; }
.tt_03 h5 { background: #05ac95; }
.tt_04 h5 { background: #9ecc44; }

.col_3 { display: flex; gap: 0 30px; width: 100%;}
.col_3 li { width: calc(33% - 20px);}
.col_3 li img { width: 100%;}

.col_5 { display: flex; gap: 0 47px;}
.col_5 li { float: left; position: relative;}
.col_5 li img { width: 100%;}

.col_2 { display: flex; gap: 0 30px; flex-wrap: wrap;}
.col_2 li { float: left; position: relative; width:calc(50% - 15px); margin-bottom:30px}
.col_2 li img { width: 100%;}

.col_2_2 { display: flex; gap: 0 50px; flex-wrap: wrap;}
.col_2_2 li { float: left; position: relative; width:calc(50% - 25px); margin-bottom:30px}
.col_2_2 li img { width: 100%;}

.con_table { border-top: 2px solid #000; width: 100%;}
.con_table th, .con_table td { min-height: 50px; line-height: 28px; font-size: 17px; color: #666; border-bottom: 1px solid #e1e1e1; padding: 10px 20px;}
.con_table th { color: #000; background-color: #f5f9fd;}

.con_left_img2 { display: inline-block; width: 100%;}
.con_left_img2 li { float: left; width: calc(50% - 10px); margin-left:20px;}
.con_left_img2 li:first-child { margin-left:0;}


/* ȯ°æÀÚ¿ø */
.slag_pyo01 { background:url(../img/slag03.jpg) no-repeat center top; display: inline-block;}
.slag_pyo01 li { width: 33.3%;margin-bottom: 80px;}
.slag_pyo01 li:nth-child(odd) { float: left; margin-right: 100px;}
.slag_pyo01 li:nth-child(even) { float: right; }



.tab_list { margin:0 100px;width: calc(100% - 200px);}
.contact_list { width: 100%;justify-content:flex-start;}










/* Æä¹Ð¸®»çÀÌÆ® */
.familysite button { }
.header_right > ul > li.family {
    position: relative;
}

.header_right > ul > li.family .f-btn {
    font-size: 14.5px;
    color: #000;
    font-weight: 600;
    border-bottom: 2px solid #000;
    background: transparent;
    cursor: pointer;
}
.main_gnb .header_right > ul > li.family .f-btn { color: #fff; border-bottom: 2px solid #fff;}
.header_right > ul > li.family .f-btn:after {
    content: "\e941";
    font-family: 'xeicon';
    margin-left: 10px;
}

.header_right > ul > li.family .f-btn.on:after {
    content: "\e944";
}

.header_right > ul > li.family .f-list {
    width: 100%;
    position: fixed;
    right: 30px;
    top: 58px;
    visibility: hidden;
    opacity: 0;
    background: #fff;
    transition: .3s ease;
    box-sizing: border-box;
    border: 1px solid #e1e1e1;
    z-index: 9999;
    max-width: 150px;
}

.header_right > ul > li.family .f-list.on {
    visibility: visible;
    opacity: 1;
}
.header_right > ul > li.family .f-list.on li a {
    color: #000; font-size: 15px; margin-left: 5px;
}
.header_right > ul > li.family .f-list.on li { border-bottom: 1px solid #e1e1e1; padding: 9px 7px; width:calc(100% - 14px);}
.header_right > ul > li.family .f-list.on li:last-child { border-bottom: 0;}

/* footer */
.footer .logo { position: absolute; left: 0; top: 0; background: url(../img/logo_f.png) no-repeat left top; background-size: 160px; width: 160px;}
.sub .footer .logo { background: url(../img/logo_f.png) no-repeat left top; background-size: 160px; top:0;}
.footer {
    background: #222;
    position: relative;
    padding: 60px 50px;
    display: flex;
	line-height: 22px;
}

.footer .grid {
    display: grid;
    width: 100%;
}

.footer .grid ul li a {
    color: #fff; font-size: 17px;
}

.footer li.no_link a {
    pointer-events: none
}

.footer li.privacy-policy a {
    font-weight: 600;
}

.footer .grid .one {
    grid-row: span 2/span 2;
    position: relative;
}

.footer .grid .one .bg-dugong {
    display: block;
    background: #fff;
    height: 100%;
    width: 1px;
    position: absolute;
    right: -40px;
    top: 0;
    opacity: 0.2;
}

.footer .grid .two ul {
    display: flex;
    flex-wrap: wrap;
    row-gap: 1rem;
    column-gap: 3rem;
}

.footer .grid .four ul {
    display: flex;
    flex-wrap: wrap;
    row-gap: .25rem;
}

.footer .grid .four ul li {
    padding-right: 1em;
    margin-right: 1em;
    position: relative;
}

.footer .grid .four ul > li:not(:last-child):after {
    content: "";
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 999px;
    background-color: #fff;
    right: 0;
    top: 50%;
    transform: translate(50%, -50%);
}

.footer .grid .three {
    align-self: center;
    display: flex;
    justify-content: end;
    position: relative;
}

.footer .grid .three .family_btn button {
    font-size: 0.9rem;
    font-weight: 900;
    color: #fff;
    background: transparent;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.5);
    padding: 8px 0;
    background: rgba(255, 255, 255, 0.1);
    width: 160px;
    height: 40px;
}

.footer .grid .three .family_btn button:after {
    content: "\e941";
    font-family: 'xeicon';
    margin-left: 10px;
}

.footer .grid .three .family_btn.on button:after {
    content: "\e944";
}

.footer .grid .three .family_list {
    background: #fff;
    width: 160px;
    position: absolute;
    z-index: 999;
    bottom: 100%;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    margin: 0;
    transition: all 0.4s;
    visibility: hidden;
    opacity: 0;
}

.footer .grid .three .family_list ul li {
    padding: 10px 20px;
}

.footer .grid .three .family_list ul li a {
    font-size: 0.9rem;
    color: #333
}

.footer .grid .three .family_list.on {
    visibility: visible;
    opacity: 1;
}

.footer .grid .five ul {
    display: flex;
    justify-content: end;
}

.footer .grid .five ul li + li {
    margin-left: 1.5rem;
}

.footer .footer-global-copylight {
    color: #fff; font-size: 17px;
}

.footer .icon-wrap div {
    font-size: 25px;
}

.footer .icon-wrap .icon-facebook:after {
    content: "\ebd5";
    font-family: 'xeicon';
}

.footer .icon-wrap .icon-insta:after {
    content: "\ebe9";
    font-family: 'xeicon';
}

.footer .icon-wrap .icon-youtube:after {
    content: "\ec32";
    font-family: 'xeicon';
}

.footer .icon-wrap .icon-naverBlog:after {
    content: "\ebfa";
    font-family: 'xeicon';
}


@media (min-width: 1200px) {
    .footer .grid {
        grid-template-columns: 150px auto auto;
        column-gap: 88px;

    }
}


@media screen and (max-width:1199px) {
.footer .logo { left: 2rem; background-size: 160px; margin-top:20px; width: 160px;}
.bg-dugong { display: none !important;}
.footer .grid .one { width: 100%;}
    .footer {
        padding: 0;
    }

    .footer .grid {
        display: flex;
        flex-flow: row wrap;
    }

    /*
    .footer .grid .five {
        order: 1;
        padding-top: 13px;
        padding-bottom: 13px;
        padding-left: 0;
        padding-right: 0;
        display: flex;
        justify-content: center;
        box-sizing: border-box;
        width: 50%;
        border-right: 1px solid rgba(255, 255, 255, 0.1);
    }
    
*/
    .footer .grid .five {
        order: 1;
        padding-top: 13px;
        padding-bottom: 13px;
        padding-left: 0;
        padding-right: 0;
        display: flex;
        justify-content: center;
        box-sizing: border-box;
        width: 100%;
        border-right: 0;
    }

    .footer .grid .five ul li + li {
        margin-left: 0.5rem;
    }

    .footer .grid .three {
        order: 3;
        width: 50%;
        padding-top: 13px;
        padding-bottom: 13px;
        padding-left: 0;
        padding-right: 0;
        box-sizing: border-box;
        justify-content: center;
        display: none;
    }

    .footer .grid .one {
        order: 5;
        /* width: 100%; */
        padding-left: 2rem;
        padding-right: 2rem;
        margin-bottom: 35px;
        padding-top: 35px;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .footer .grid .two {
        order: 6;
        width: 100%;
        padding-left: 2rem;
        padding-right: 2rem;
        margin-bottom: 0;
    }

    .footer .grid .four {
        order: 999;
        width: 100%;
        padding-left: 2rem;
        padding-right: 2rem;
        margin-bottom: 25px;
    }

    .footer .grid .two ul {
        column-gap: 1rem;
    }

    .footer .footer-global-copylight {
        margin-top: 0;
        font-size: 1rem;
    }

    .footer .grid .four ul {
        row-gap: 0;
    }

    .footer .grid ul li a {
        font-size: 1rem;
    }

    .footer .grid .two ul li a {
        font-size:1rem;
    }

    .footer .grid .three .family_btn button {
        border: 0;
        padding: 0;
        background: transparent;
        width: auto;
        height: auto;
    }
}
#back_to_top {
    position: fixed;
    bottom: 65px;
    margin: 0;
    z-index: 101;
    transition: all .3s ease 0s;
    right: 60px;
    opacity: 0;
    filter: alpha(opacity=0);
    visibility: hidden;
    width: 90px;
    height: 90px;
    background-color: #222222;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: 800;
}

#back_to_top.on {
    opacity: 1;
    filter: alpha(opacity=100);
    visibility: visible;
    right: 60px;
}

#back_to_top.fixed {
    bottom: 300px;
}

#back_to_top:hover {
    background-color: #0086ce;
}
.main #back_to_top { display: none !important;}


/* ±Û¾²±â */
.table_th { border-top: 1px solid #9b9b9b;}
.table_th th { font-size: 17px; color: #333; height: 28px; line-height: 28px; padding: 16px 0; border-bottom: 1px solid #ebebeb; background: #f6f6f6; font-weight:500; text-align:center;}
.table_td td, .table_td td a, .table_td td div { font-size: 17px; color: #333; min-height: 28px; line-height: 28px; font-weight: 300;}
.table_td td { padding: 16px 0; border-bottom: 1px solid #ebebeb;}
.table_td td a { color: #000; font-weight: 500;padding-left: 10px}

.write_table { border-top: 2px solid #333;border-bottom: 1px solid #e1e1e1;}
.write_table th { font-size: 17px; color: #333; min-height: 28px; line-height: 28px; font-weight: 300;}
.write_table th::after { content: ""; width: 1px; height: 17px; background:#e1e1e1; display: inline-block; position: relative; top: 7px; right: 0; float: right;}
.write_table th, .write_table td { border-top: 1px solid #e1e1e1;}
.write_table select { font-size: 17px;}

/* ÆäÀÌ¡ */
.page { text-align: center; height: 34px; margin: 20px auto 120px auto; line-height: 34px; width: 100%; display: inline-block;}

.page a { color: #888; margin: 0 auto;padding: 0 13px;border: 1px solid #ccc; text-align: center; vertical-align: middle; display: inline-block; font-family: 'NanumS'; line-height: 38px;display: inline-block;}
.page a:hover, .page a.on { background-color: #182f5c; color: #fff; border: 1px solid #182f5c;}
.page a#on_page { background-color: #182f5c; color: #fff; border: 1px solid #182f5c;}
.page a:hover.prev, .page a:hover.next  { background-color: #fff;}

.page li { display: inline-block;}

.no_board td {font-size: 17px; color: #333; font-weight:400; font-family:Roboto; height: 60px; line-height: 60px; letter-spacing: -1px;}

.search_board { margin-bottom: 20px; display: inline-block; width: 100%; text-align: center; padding: 20px 0; background:#fbfbfb;}
.search_board select { height: 35px; line-height: 35px; border: 1px solid #e1e1e1; width: 80px; font-size: 15px; color: #333; font-family:"Noto Sans Kr"; padding: 0 5px;}
.search_board .b_search_txt { height: 35px; line-height: 35px; border: 1px solid #e1e1e1; font-size: 15px; caption-side: #333;font-family:"Noto Sans Kr"; padding: 0 5px;}
.search_board .b_search_btn { background-color: #009bd9;}
.search_board .b_search_btn2 { background-color: #9097a5; color: #fff; width: 63px; height: 37px; position: absolute; right: 20px; top: 20px;line-height: 37px;}

.table_td .board_con td { padding: 50px !important; color: #000;}
.board_etc a { margin-left: 20px;}
.board_etc a::before { content:""; width:1px; height: 17px; background:#e1e1e1; display: inline-block; position: relative; top:2px; left: -10px;}
.file_down a { color: #009bd9 !important;}
.board_tt { font-size: 17px; font-weight: 500; color: #000;}




/* ÅÇ */
.tab { display: flex;align-items: center; justify-content:space-around; flex-wrap:nowrap; border-bottom: 3px solid #0057a0; margin-bottom:40px; margin-top: 0;}
.tab li { background: #f7f7f7; border:1px solid #ccc; height: 80px; display: inline-block; width: 100%; border-bottom:0; border-right:0; cursor:pointer;}
.tab li:last-child { border-right:1px solid #ccc;}
.tab li a {font-size: 18px; color: #000; text-align: center; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; line-height: 25px; font-weight:600;}
.tab li.on a { background: #0057a0; color: #fff; }
.tab li.on { border: 1px solid #0057a0;}

.tab_in { display: flex; flex-wrap:wrap; align-items: center; justify-content:space-around; margin-bottom:160px; border-right: 1px solid #ccc; border-top: 1px solid #ccc; }
.tab_in::after { border-bottom: 1px dashed #515151; content:""; display: inline-block; width:calc(100% - 0px); border-left:100px; height: 0; position:relative; top: 80px;}
.tab_in li { width: 25%; float:left; height: 50px;}
.tab_in li a {border: 1px solid #ccc;border-top:0;border-right: 0;display: flex;width: 100%;text-align:center;height: 52px;/* padding-top: 14px; */line-height: 20px;vertical-align: middle;color: #777;font-weight:500;font-size:19px;letter-spacing: -0.025em;float: left;align-items: center;justify-content: center;}
.tab_in li.on a { color: #0057a0; border: 2px solid #0057a0;}

.tab_in2 { margin-bottom: 80px;}
.tab_in.tab_in2::after { display: none;}
.tab_in li b { border: 1px solid #ccc; border-top:0; border-right: 0; display: inline-block; width: 100%; text-align:center; height: 52px; line-height: 50px; color: #777; font-weight:500; font-size:19px; letter-spacing: -0.025em; float: left;}

/* ÅÇ »ó´Ü°íÁ¤ */
.tab_in.fixed { position: fixed; top:0; margin-left: -100px; background:#fff; z-index: 30; box-shadow:1px 5px 10px rgba(0, 0, 0, 0.08);width: inherit;}
.tab_in.fixed::after { border-bottom:2px solid #0057a0; top: 0;}
.tab_in_con.fixed { padding-top: 180px;}
.tab_in_con h5 { font-size: 34px; color: #00; letter-spacing: -0.035em; font-weight: 900;}
.tab_in_con h5::before { content:""; display: inline-block; width: 7px; height: 29px; background:#0057a0; margin-right: 13px;}
.h5_comment { font-size: 16px; color: #777; margin-top: 15px; font-weight: 500; letter-spacing: -0.035em; margin-bottom: 56px;}
.tt_comment { font-size: 16px; color: #777; margin-top: -10px; font-weight: 500; letter-spacing: -0.035em; margin-bottom: 30px;}

.tab_big.fixed {position: fixed; top:0; margin-left: -100px; z-index: 30; box-shadow:1px 5px 10px rgba(0, 0, 0, 0.08);width: inherit;}
 
.prd_con { display: inline-block; background: #f5f9fd; border: 1px solid #e9e9e9; padding: 90px 90px 60px 90px; width: 100%;}
.prd_con ul { display: flex;flex-wrap: wrap; flex-direction: row; justify-content: space-between}
.prd_con ul li { display: flex; flex-direction: column; background: #fff; border: 1px solid #d5d5d5; cursor: pointer; width: 47%; margin-bottom:30px;}
.themb_con h6 { color: #000; font-size:24px; text-align: center; width: 100%;font-weight: bold; margin-bottom:20px; line-height: 30px;}
.themb_con table { border-top: 1px solid #000; width: 100%;}
.themb_con table tr th { background: #f5f9fd; color: #888; font-size: 14px; border-bottom: 1px solid #e1e1e1; min-height: 40px; padding-left: 15px; width: 105px;} 
.themb_con table tr td { color: #555; font-size: 14px; border-bottom: 1px solid #e1e1e1; min-height: 40px; padding-top:6px; padding-bottom:6px; background: #fff; padding-left: 20px;} 

.themb_img { width: 100%; position: relative; }
.prd_con ul li:hover { border: 1px solid #4198e1; box-shadow: 15px 15px 15px rgba(0, 0, 0, 0.04); position: relative;  transition: 0.1s; transition-delay: 0.1s;}
.prd_con ul li:hover u { transition: 0.1s; transition-delay: 0.1s;width: 100%; height: 100%; background: #000; opacity:0.5; display: inline-block; position: absolute; left:0; top: 0; z-index: 10;}
.prd_con ul li:hover i { transition: 0.1s; transition-delay: 0.1s;background: url(../img/view.png) no-repeat left top; width: 89px; height: 89px; display: inline-block; position: absolute; top:calc(50% - 44px); left:calc(50% - 44px); z-index: 20; text-indent: -9999px; overflow: hidden; opacity:1;}
.themb_img i { display: inline-block; opacity:0;transition: 0.1s; transition-delay: 0.1s; text-indent: -9999px; overflow: hidden; position: absolute;}
.themb_img img { width: 100%;transition: 0.1s; transition-delay: 0.1s;}
.themb_con { padding: 20px 40px 40px 40px; font-size: 14px; color: #555; line-height:23px;}

.non_cursor { cursor: default !important;}
.prd_con ul li:hover.non_cursor { border: 1px solid #ccc;; box-shadow: none;}

.prd_con.prd_mini { padding: 50px 50px 0 50px;}
.prd_mini ul li { flex-direction: row; width: 48%; border:none; background: none; margin-bottom: 50px; }
.prd_mini .themb_img { overflow: hidden; width: 40%;}
.prd_mini .themb_con { width: 60%; padding: 0 20px 20px 30px; } 
.prd_mini .themb_con h6 { text-align: left; font-size: 20px; margin-bottom: 10px;}
.prd_mini.prd_con ul li:hover { border: none; box-shadow: none;}
.tab_in_con .tt { font-size: 26px; font-weight:bold; padding-bottom: 20px; width: 100%; display: inline-block;}

.prd_mini2 {  padding:40px 40px 40px 40px; margin-bottom:60px;}
.prd_mini2 ul {justify-content: flex-start;}
.prd_mini2 ul li { width: calc(31% - 1%); margin:1.6%;}
.prd_mini2 .themb_img { overflow: hidden; max-height: 200px;}
.prd_mini2 .themb_img img {}
.prd_mini2 .themb_con {padding: 20px 30px;}
.prd_mini2 .themb_con h7 { color: #000;text-align: center; width: 100%; display: block; font-size: 19px; line-height: 24px; padding: 10px 0; margin-bottom:5px; font-weight:600; letter-spacing: -0.025em;}
.prd_mini2.prd_con ul li:hover { border: 1px solid #ccc; box-shadow: none; cursor: default;}

.contact_list { display: flex; flex-wrap:wrap;column-gap:38px; flex-direction:row;}
.contact_list li { margin-bottom:30px; height: 400px; width: 270px;}
.contact_list li h5 { font-size: 20px; color: #000; margin-bottom: 5px; font-weight:500; margin-top: 13px;}
.contact_list li p { font-size: 16px; color: #666; line-height: 24px; margin-top: 10px; padding-left: 50px; position: relative;}
.contact_list li p span { position: absolute; left:0; top:0;font-size: 16px; color: #999; }
.contact_list li p span::after { display: inline-block; content:""; background:#ddd; width: 1px; height: 14px; float:right; margin-left: 10px; margin-top:6px;}

.flx_2 { display: flex; justify-content: space-around;}
.txt_list { display: inline-block; width: 100%; margin-top: 80px;}
.txt_list li {font-size: 17px;color: #777;line-height: 20px;margin-bottom: 18px;letter-spacing: -0.045em;}
.txt_list li b {font-size: 17px;color: #000;padding-right: 15px;font-weight: 600;display: inline-block;width: 170px;}
.txt_list li b::before { display: inline-block; content:""; width: 4px; height: 4px; background:#ccc; margin-right:10px; position: relative; top: -3px;}
.txt_list li b::after {display: inline-block;content:"";width: 1px;height: 16px;background:#ccc;margin-left: 10px;float: right;margin-top: 2px;margin-right: 5px;}


/* Á¦Ç° »ó¼¼º¸±â Æ˾÷ */
.pop_detail { position: fixed; left:0; top:0; width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.7); z-index:60}
.pop_header { background:#fff; height: 60px; line-height:60px; width: 100%; position: relative;}
.btn_close { background: #000 url(../img/btn_close.png) no-repeat center center; width: 60px; height: 59px; text-indent: -9999px; display: inline-block; position: absolute; right: 0px; top: 0; z-index:50;}

.pop_inner {background: #fff; position: relative; max-width: 1400px; width: 90%; height: calc(100% - 165px); margin: 0 auto; margin-top:125px;}

.pop_con { background: #fff; padding: 6%; font-size: 15px; color: #555; line-height: 26px; width: 100%; height:calc(90% - 0px); overflow-y: scroll; overflow-x: hidden;}
.pop_con p { font-size: 22px; width:100%; text-align: center; line-height: 46px; margin-bottom: 18px; font-weight:500; letter-spacing: -1px; color: 000;}

.pop_con strong { font-size: 16px; color: #000; text-align: center; width: 100%; display: inline-block; line-height: 26px; font-weight: 500; letter-spacing: -0.025em;}
.pop_con i { display: inline-block; width: 100%; text-align: center; font-size: 14px; color: #777; line-height: 22px;}
.pop_footer { padding: 0 30px; position: absolute; bottom: 15px; left: 0; border-top: 1px solid #e1e1e1; width: 100%; padding-top: 10px;}
.pop_footer input { margin-right: 5px;}
.pop_footer label { font-size: 14px; color: #555; position: relative; top: -1px;}
.pop_footer a { font-size: 12px; color: #555; border: 1px solid #ccc; border-bottom: 1px solid #aaa; border-radius: 3px; display: inline-block; height: 24px; line-height: 22px; width: 45px; position: absolute; margin-left: 10px; text-align: center; background:#f5f5f5; position: relative; top:2px}
.menu_toggle { display: none;}

.pop_con .themb_img { width: 45%; float: left;}
.pop_con .themb_con { width: 55%; float: left; text-align: left; padding:0; padding-left: 7%;}
.pop_con .themb_con h6 { text-align: left; font-size: 30px; font-weight: 800; letter-spacing: -1px;}
.pop_con .themb_con p { text-align: left; font-size: 17px; line-height: 33px;}

.vh_table { border-top: 2px solid #000; width: 100%;border-left: 1px solid #c1c1c1; float: left;}
.vh_table th { background-color: #f5f9fd; border-bottom: 1px solid #c1c1c1; border-right: 1px solid #c1c1c1; text-align: center;padding: 10px 0; line-height: 22px; font-size: 15px; color: #000; font-weight: 500;}
.vh_table td { border-bottom: 1px solid #e1e1e1; border-right: 1px solid #e1e1e1; padding: 7px 0; line-height: 22px; font-size: 15px; color: #555; text-align: center;}


/*   ---------- °øÁö»çÇ× ±Û¾²±â --------   */
.write h4 { font-size: 27px; color: #333; font-weight: normal; text-align: left; line-height: 21px; padding-bottom: 40px; padding-top: 10px; font-family:'Noto Sans KR';font-weight:800;}
.write h4 span { font-size: 14px; color: #888; font-weight: 300; margin-left: 10px;}
.editor { width: 100%; margin-bottom: 30px; background: #fff;}
.editor th { width:17%; text-align: left; background: #f2f4f7; font-weight: normal; padding-left: 15px; padding-right: 15px; line-height: 18px; color: #666; border: 1px solid #e1e1e1; font-size: 14px;font-family: "Noto Sans KR"; font-weight: 300; }
.editor th i {color: #f00;font-size: 18px;font-style: normal;position: relative;top: 6px;margin-left: 3px;}
.editor td { text-align: left; border: 1px solid #e1e1e1;font-size: 14px; position: relative; padding: 6px 0;font-family: "Noto Sans KR"; font-weight: 300;}
.editor td input { float: left; font-size: 14px; font-family:'Noto Sans KR'; font-weight: 300; color: #000;}
.ma_100 { margin: 0 10px;}

.editor td .input_txt { height: 30px; line-height: 30px; border: 1px solid #e1e1e1; text-indent: 5px; font-size: 14px; width: 100%; padding-right: 0;font-family: "Noto Sans KR"; font-weight: 300;}
.editor td .input_sel { font-size: 14px; height: 30px; width: 100%; padding-right: 0;font-family: "Noto Sans KR"; font-weight: 300;}
.input_file_list { height: 80px; line-height: 28px; border: 1px solid #e1e1e1; text-indent: 10px; font-size: 14px; width: 100%; padding-right: 0; background: #f5f5f5; overflow-y:scroll;}
.input_file_list li { border-bottom: 1px solid #e1e1e1; font-size: 13px; color: #333; font-family: "Noto Sans KR"; font-weight: 500; position: relative; text-align: left;}
.input_file_list li a {background:url(../img/btn_cancle_on.gif) no-repeat left top; width: 16px; height: 16px; position: absolute; right: 5px; top: 4px; text-indent: -9999px; overflow: hidden; }

.editor td input.ck_box { float: none; margin-right: 3px; height: 13px; width: 13px; }
.editor td label { margin-right: 10px; font-size: 14px; color: #555; position: relative; top: -1px; font-weight: 400;}

.close_pop { background:url(images/btn_close.png) no-repeat left top; width: 20px; height: 19px; display: inline-block; position: absolute; right: 20px; top: 20px;}
.area_textedior { margin-bottom: 20px;}
.btns_area { text-align:center; width: 100%; margin: 30px 0 60px 0; position: relative; display:inline-block;}
.input_sel { width: 100%;height: 28px;}

.write_table td, .table_td td th { min-height:64px; padding:0; vertical-align: middle;}
.write_table td div { min-height: 64px; vertical-align: middle; position: relative;}
.write_table td div input, .write_table td div select { height: 40px; border: 1px solid #e1e1e1; vertical-align: middle; margin-top: 13px; width: 100%;}
.input_file_list { margin: 13px 0;}
.bnts_area { text-align:center; width: 100%; margin: 30px 0 60px 0; position: relative; display:inline-block;}



@media only screen and (max-width:1400px){
.carousel-container .text0 { font-size: 17px;}
.carousel-container .text1 { margin-right:0; padding-right:0; font-size: 54px;}
.carousel-container .text2 { font-size: 17px; line-height:26px;}

.text-container { text-align:center; left: calc(50% - 275px) !important; max-width: 550px !important; }

.text1 { line-height: 70px;}
.text2 br { display: none !important; visibility: hidden;}
.text0, .text1, .text2 { text-align: center !important; width:100% !important;}


}

@media only screen and (max-height:650px){
.timeline-container { top: 87% !important;}
.carousel-container button{ top: calc(87% - 32px) !important;}
}
@media only screen and (max-width:900px){
.carousel-container .text0 { font-size: 16px;}
.carousel-container .text1 { margin-right:0; padding-right:0; font-size: 40px; line-height: 48px;}
.carousel-container .text2 { font-size: 16px; line-height:26px;}
.text-container {top: 29% !important;}
.timeline-container { top: 87% !important; left: 10% !important; width: 80% !important;}
.carousel-container button{ top:90% !important; width:40px !important; height: 40px !important; left:10% !important;}
.carousel-container button:last-child { left:calc(10% + 45px) !important;}
}
@media only screen and (max-width:780px){
.text-container { text-align:center; left: calc(10% - 0px) !important; max-width: 80%;}
.text1 { margin-bottom: 50px !important;}
}

@media only screen and (max-width:667px){
.carousel-container .text0 { font-size: 15px;}
.carousel-container .text1 { margin-right:0; padding-right:0; font-size: 40px; line-height: 45px;}
.carousel-container .text2 { font-size: 15px; line-height:26px;}
.text-container {top: 25% !important;}
}



@media only screen and (min-width:1417px){
.contents { width: 1400px;}
}
@media only screen and (max-width:1416px){
.con_left { width: calc(45% - 50px); margin-right:80px;}
.con_right { width: calc(55% - 40px); }
.con_right img, .con_left img, .con_line img { width: 100%;}
.summary br { display: none;}	
.container { padding-bottom: 0;}
.contact_list {justify-content: space-evenly;}
.dl_img .dd { margin-left: 60px;}


}
@media only screen and (min-width:0) and (max-width:560px){
.bgbg { width: calc(50% - 50px); background-size: cover; height: 35% !important; background-size: cover;}
}


/* ÀÛÀº ¸ð´ÏÅÍ */
@media only screen and (max-width:1280px){
.contents { width: 100%; /* 1060px */ padding-left:50px; padding-right: 50px; margin-top:0 !important; padding-top:70px; padding-bottom: 70px;}
#tabtab section, #tabtab .tab { margin-left: 50px !important; margin-right: 50px !important;} 
.gnb_menu .depth01 { padding-right: 40px;}

.con_nomal article p  { padding-right: 0 !important;}
.wrap_sub_top h2 { top:calc(50% - 25px); font-size: 16px;}
.wrap_sub_top  { height:400px;}
.wrap_sub_top p { margin-top: -90px; top: 295px;}
.wrap_sub_top p span { font-size: 45px;}
.wrap_sub_top p b { font-size: 28px; margin-bottom: 16px; letter-spacing: 6px;}
.wrap_sub_top p b::after { margin-top: 20px;}
.wrap_sub_top p u, .wrap_sub_top p i { font-size: 28px;}
.wrap_sub_top::after { height: 230px; width: 190px; top:calc(50% - 55px); left:calc(50% - 93px);}
.sub_top_img { height: 470px;}
.title { width: 350px; height: 210px; padding-top: 40px; margin-top: -270px; }
.title h2 { font-size: 55px;}
.title h1 { font-size: 26px;}

.prd_con { padding:55px 55px 20px 55px;}
.tab_in.fixed { margin-left: -50px;}

.contact_add .box_2 {flex-direction: column; margin-bottom:0;}

.pop_inner { margin-top: 15px; height: calc(100% - 35px);}
.pop_con .themb_con h6 { font-size: 26px; line-height:36px; margin-bottom: 15px;}
.pop_con .themb_con p { font-size: 16px; line-height: 27px;}
.pop_header { height: 46px; line-height: 46px;}
.btn_close { width: 46px; height: 46px; background-size: 20px;}

.vh_table td { font-size: 13px;}
.vh_table th { font-size: 13px;}

.con_right img, .con_left img, .con_line img { width: 100%;}
#map { width: 50% !important;}
.img_box img { width: 100%;}
.etc_info { width:calc(100% + 50px);}
.mt_80 { margin-top: 30px !important;}
}

@media (max-width: 1070px) {
.drop_menu { font-size: 19px !important;}
.logo { position: absolute; left: 30px; top:40px;width: 283px; height: 53px; background: url(../img/logo.png) no-repeat left top; text-indent: -9999px; overflow: hidden; display: inline-block;transition: 0.2s; transition-delay: 0.2s; float: left;}
.logo_m {width: 164px; height: 35px; background: url(../img/logo_m.png) no-repeat right top; text-indent: -9999px; position: absolute; left: 310px; top: 41px; overflow: hidden; display: inline-block;transition: 0.2s; transition-delay: 0.2s; float: left; margin-top: 7px; margin-left:20px; padding-left: 20px; float: left;}
.logo_m::before { content:""; display:inline-block; width: 1px; height:35px; background-color:#fff; position:absolute; left:0; top: 0px; margin-right: 20px; opacity: 0.5;transition: 0.2s; transition-delay: 0.2s;}
.main_gnb .logo {background: url(../img/logo.png) no-repeat left top; width: 283px;height: 53px; }


.gnb_menu .logo { background: url(../img/logo.png) no-repeat left top !important; background-size: 200px !important; left: 20px; width: 200px !important; height: 36px;}
.gnb_menu .logo_m { left: 220px; background: url(../img/logo_m.png) no-repeat right top !important; background-size: 100px !important; width: 120px !important; height: 36px; margin-top: 5px;}
.gnb_menu .logo_m::before { background-color:#fff; opacity: 0.5; height: 26px !important;}
.gnb_menu.on .logo_m::before {background-color:#fff !important;}

.gnb_menu.on .logo {background: url(../img/logo_b.png) no-repeat left top !important; background-size: 200px !important; left: 20px; width: 200px !important; height: 36px;}
.gnb_menu.on .logo_m { background: url(../img/logo_m_b.png) no-repeat right top !important; background-size: 100px !important; width: 120px !important; height: 36px; margin-top: 5px;}
.gnb_menu.on .logo_m::before { background-color:#000 !important; opacity: 0.2;}


.sub .logo {background: url(../img/logo.png) no-repeat left top;top: 40px;}
.sub .logo_m { top: 41px;}

}


/* labtop */
@media (max-width:1024px){
.tab li a { font-size: 15px; line-height: 22px;}
.tab_in li a { font-size: 16px;}
.prd_mini2 ul li { width: 46%; margin: 2%;}


}



@media (max-width:900px){
.container { background: #fff;}
.contents { padding-left: 5%; padding-right: 5%; padding-top:0; margin-top:0; padding-bottom: 40px;}

.main_gnb.gnb_menu { background: transparent; height: 80px;}
.gnb_menu .logo { background: url(../img/logo.png) no-repeat left top !important; background-size: 200px !important; left: 20px; width: 200px !important; height: 36px;}
.gnb_menu .logo_m { left: 220px; background: url(../img/logo_m.png) no-repeat right top !important; background-size: 100px !important; width: 120px !important; height: 36px; margin-top: 5px;}
.gnb_menu .logo_m::before { background-color:#fff; opacity: 0.5; height: 26px !important;}
.gnb_menu.on .logo_m::before {background-color:#fff !important;}

.gnb_menu.on .logo {background: url(../img/logo.png) no-repeat left top !important; background-size: 200px !important; left: 20px; width: 200px !important; height: 36px;}
.gnb_menu.on .logo_m { background: url(../img/logo_m.png) no-repeat right top !important; background-size: 100px !important; width: 120px !important; height: 36px; margin-top: 5px;}
.gnb_menu.on .logo_m::before { background-color:#fff !important; opacity: 0.5;}


.gnb_menu .depth01 a { color: #000 !important;}
.familysite { display: none;}
.wrap_sub_top h2 { top:calc(50% - 0px);}
.wrap_sub_top p { top: 165px;}
.wrap_sub_top p b { display: none;}
.wrap_sub_top p span { font-size: 28px; margin-top: 50px;}
.wrap_sub_top p b::after { height: 1px; margin-top:8px; width: 25px;}
.wrap_sub_top::after { display: none; /*  height: 120px; width: 190px; top:calc(50% - 20px); left:calc(50% - 93px); */}

.tab { margin-bottom: 30px;}
.nav.tab { display: flex; width: calc(100% + 10% + 4px); margin-left: calc(-5% - 2px); flex-wrap: nowrap; align-items: stretch; justify-content: space-around;}
.nav.tab li { position: relative; line-height: 20px; text-align: center; border: none; height: auto;}
.nav.tab li a {line-height: 50px; color: #555; font-size: 13px; font-weight: bold; text-align: center; position: relative; margin: 0 auto; display: flex; justify-content: center; align-items: center; line-height: 17px; background:#f7f7f7; border-right:1px solid #ccc; padding:10px 0; min-height:60px;}
.nav.tab li:last-child a { border-right:0;}
.nav.tab li.on { border-bottom:0; background: #fff; border: none;}
.nav.tab li.on a { color: #fff; background: #0057a0; width: auto;}
.nav.tab li.on a::after { content: ""; display: inline-block; width: 100%; height: 3px; background-color:#0057a0; position: absolute; bottom: 0px; left:0;}
.nav.tab li:last-child { border-right:0;}
.nav.fixed { position: fixed; top: 60px; background-color:#fff; z-index:60; margin-top:0;}


.tab_in { margin-bottom: 50px;align-items: stretch;}
.tab_in li {  min-height: 40px; height: auto;}
.tab_in li a, .tab_in li b { font-size: 13px; height: 100%; line-height: 16px;}

.tab_in.fixed { margin-left: -5%;}
.tab_in::after { top: 30px;}
.tab_in_con h5 { font-size: 22px;}
.tab_in_con h5::before { height: 19px; margin-right: 8px;}

.h5_comment { font-size: 14px; line-height: 22px; margin-top: 10px; margin-bottom: 26px;}

.prd_con { padding: 20px 20px 15px 20px;}
.prd_con ul li { width: 100%;}

.themb_con { padding:15px 15px 15px 15px;}
.themb_con h6 { font-size: 17px; margin-bottom: 15px; line-height: 22px;}
.themb_con table tr th { font-size: 13px; padding-left: 10px; width: 95px;}
.themb_con table tr td { font-size: 13px; padding-left: 10px;}

.pop_con .themb_img { width: 100%;}
.pop_con .themb_con { width: 100%; padding-left: 0; margin-top: 20px;}
.pop_con .themb_con p { font-size: 14px; line-height: 22px;}
.pop_con .themb_con h6 { margin-bottom: 15px; font-size: 20px; padding-top: 5px; line-height: 26px;}

.tab_in_con .tt {font-size: 18px; letter-spacing: -1px;}
.tt_comment { font-size: 14px; line-height: 22px;}

.prd_mini2 .themb_con { padding: 15px 20x;}
.prd_mini2 .themb_con h7 { font-size: 17px; padding: 0;}
.themb_con { font-size: 14px; line-height: 20px;}
.prd_mini2 .themb_img { text-align: center; background: #f5f5f5;}
.prd_mini2 .themb_img img { width: auto; height: 100%;}
.flx_2 {flex-direction: column;}
.txt_list { margin-top: 30px;}
.txt_list li { font-size: 14px; line-height: 22px; padding-left: 20px; margin-bottom:26px;}
.txt_list li b { display: inline-block; width: 100%; margin-left: -15px; margin-bottom: 3px;}
.txt_list li b::after { display: none;}


.gnb_menu.on::after { display: none !important;}
.gnb_menu .depth01 { display: inline-block !important; position: fixed; right: -100vw; left: 100vw; top:80px; height:100vh; width:100vw; background: #fff; -moz-transition: all .2s ease-in-out;-webkit-transition: all .2s ease-in-out;transition: all .2s ease-in-out;border-top: 3px solid #009bd9;}
.gnb_menu .depth01 > li:first-child { border-top: 1px solid #e1e1e1;}
.gnb_menu .depth01 li a { display: inline-block; width: 100vw; border-bottom: 1px solid #e1e1e1; text-align: left; text-indent: 30px; height: 50px; line-height: 50px; font-size: 17px; float: left;}
.gnb_menu .depth01 li { padding:0; position: relative;-moz-transition: all .2s ease-in-out;-webkit-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}
.gnb_menu.on .depth02 { display:none !important; border: none;height: 0; opacity:1;  }
.gnb_menu.on .depth02 li { border: none;}
.gnb_menu .depth02 { border:none; height: 0; width: 100%; -moz-transition: all .2s ease-in-out;-webkit-transition: all .2s ease-in-out;transition: all .2s ease-in-out;opacity:1; position: relative; top:0; max-height:0;}
.main_gnb.m_open .menu_toggle:after,
.main_gnb.m_open .menu_toggle:before,
.main_gnb.m_open .menu_toggle div { background-color: #000;}

.sub .logo {background: url(../img/logo.png) no-repeat left top;}
.sub .logo_m { top: 13px;}

.m_open .gnb_menu .depth01 { left:0; right:0 !important; display: inline-block ;width:100vw; height:100vh !important; position: fixed; border-top: 2px solid #009bd9; padding-bottom:80px; overflow-y:scroll;}
.m_open .gnb_menu li.m_on .depth02, .m_open .gnb_menu.on li.m_on .depth02  { position: relative; height: auto; top:0; width:100%; opacity: 1; display: inline-block !important; max-height: 100vw;}  
.m_open .gnb_menu li.m_on .depth02 a, .m_open .gnb_menu.on li.m_on .depth02 a { margin-left:0; color: #333 !important; text-indent: 40px; font-size: 16px; background-color:#f5f5f5;}
.drop_menu { background: url(../img/btn_right_d.png) no-repeat right 25px center; -moz-transition: none !important;-webkit-transition: none !important; transition: none !important;}
li.m_on .drop_menu { background: url(../img/btn_right_u.png) no-repeat right 25px center;}

.gnb_menu .depth01 > li.mo_failysite  { display: inline-block;}
.menu_toggle { display: inline-block; position: absolute; right: 20px; top: 30px; z-index: 60; width: 25px; cursor: pointer;}
.menu_toggle:after,
.menu_toggle:before,
.menu_toggle div {
    background-color: #fff;
    -o-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    content: '';
    display: block;
    height: 3px;
    margin: 5px 0;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    margin-top: 0px;
}
.main .menu_toggle:after,
.main .menu_toggle:before,
.main .menu_toggle div { background-color: #fff !important;}


.sub.onon .gnb_menu .logo { background:url(../img/logo_b.png) no-repeat left top;}
.onon .menu_toggle:after,
.onon .menu_toggle:before,
.onon .menu_toggle div {
    background-color: #000;
    -o-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    content: '';
    display: block;
    height: 3px;
    margin: 5px 0;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    margin-top: 0px;
}

.menu_toggle:after {
    margin-bottom: 0;
}

.m_open .menu_toggle:before {
    transform: translateY(9px) rotate(135deg);
}

.m_open .menu_toggle:after {
    transform: translateY(-7px) rotate(-135deg);
}

.m_open .menu_toggle div {
    transform: scale(0);
}


.carousel-caption h5 { font-size: 48px; word-break: keep-all;}



.wrap_sub_top{margin-top: 0;height: 200px;}
.sub_top_img {height: 200px; background-size: cover;}
.sub .gnb_menu {height: 60px;background: transparent;}
.sub .logo { top: 11px;}
.sub .menu_toggle { top: 20px;}
.sub.m_open .gnb_menu .depth01, .sub .gnb_menu .depth01 {top: 60px; /*border-top:0;*/}



.bnts_area a {width: 80px;}
.title h3 { font-size: 22px; line-height: 28px;}
.title a.etc_box b { font-size: 16px;}
.btn_print { display: none;}
}



/* tab */
@media only screen and (max-width:1023px){
.title { width: 250px; height: 150px; padding-top: 35px; margin-bottom: 0; padding-left: 30px; position: absolute; top: 146px;}
.title h1 { font-size: 19px; padding-bottom: 2px;}
.title h2 { font-size: 35px;}
.carousel-caption h5 { font-size: 48px; word-break: keep-all; margin-bottom:38px;}


.con_nomal article { margin-bottom: 60px;}
.con_nomal article strong { margin-bottom: 6px;}
.con_nomal article strong br { display: none;}
.con_nomal article strong, .con_nomal article strong span, .con_nomal article strong i { font-size: 24px; line-height: 34px;}
.con_nomal article p.summary { font-size: 17px; line-height: 27px; margin-bottom: 28px;word-break: keep-all; font-weight: 500;}
.con_nomal article p.summary2 { font-size: 17px !important; line-height: 27px;}
.con_nomal article p { font-size: 14px; line-height: 24px; word-break: break-all; font-weight: 400; }
.con_nomal article h3 { font-size: 18px; height: 70px;}
.con_nomal article h3::after { height: 40px; top: 18px;}
.con_nomal article h4 { font-size: 20px;}
.con_nomal article p b { font-size: 15px;}
.con_nomal article p b i {font-size: 15px;}
.con_nomal article p span { font-size: 15px;}

.con_right h3, .con_left h3 { margin-top:0 !important;}
.left_2nd { margin-right:30px !important; width:calc(45% - 0px);}

.etc_info { padding:50px 60px;}
.etc_info strong { font-size: 17px !important;}



/* history */
.con_history h3, .con_history h3 b  { font-size:28px; margin-top:30px; margin-bottom: 10px;}
.con_history h3 span { font-size: 25px; }
.con_history article { margin-bottom: 70px;}
.con_history article p.summary { font-size: 17px; line-height: 28px; margin-bottom:10px;}
.history_list { padding-top: 25px;}
.history_list li { font-size:15px; padding-bottom: 22px; padding-left:22px; font-weight:400;}
.history_list li b { font-size: 17px; top:-4px; left: -30px;}
.history_list li b::before { margin-right: 15px; width: 13px; height: 13px;}

/* contact us*/
.contact_add .box_2 { padding-bottom:20px; margin-bottom:30px;}
.contact_add .box_2 p { width: 50%;}
.contact_add .box_2 img { width: 100%;}
.contact_add .mt_40 { margin-top:10px;}

.contact_list li h5 { font-size: 17px; }
.contact_list li p, .contact_list li p span { font-size: 15px;}

.tts li h5 {font-size: 17px;height: auto;line-height: 22px;text-indent: 0;padding: 10px 20px;min-height: 40px;}
.tts li p { margin: 20px;}

article h4 { margin-bottom: 25px; font-size:22px !important;}
article h5 { margin-bottom: 20px;  }

.slag_pyo01 { background-size: 340px;}
}



/* btns */
.btn_file { width: 18%; background: #27344f; text-align: center; color: #fff; font-size: 14px; height: 30px; line-height: 30px; display: inline-block; cursor:hand; float: right;font-family: "Noto Sans KR"; font-weight: 300; font-size: 14px;}
.input_file { opacity: 0; position: absolute; right:0; top:0; height: 30px !important; width: 18% !important; cursor: pointer; margin-top:0 !important;}
.btn_01 { background-color: #2b8adb; display: inline-block; width: 120px; height: 45px; color: #fff; font-size: 17px; font-family: "Noto Sans KR"; font-weight: 300;  text-align: center; margin: 2px; line-height: 45px;}
.btn_02 { background-color: #9097a5; display: inline-block; width: 120px; height: 45px; color: #fff; font-size: 17px; font-family: "Noto Sans KR"; font-weight: 300;  text-align: center; margin: 2px; line-height: 45px; }
.btn_03 { background-color: #182f5c; display: inline-block; width: 120px; height: 45px; color: #fff; font-size: 17px; font-family: "Noto Sans KR"; font-weight: 300;  text-align: center; margin: 2px; line-height: 45px; }
.btn_04 { background-color: #fff; border:1px solid #d0d0d0; position: absolute; left:0; top:40px; display: inline-block; width: 120px; height: 45px; color: #777; font-size: 17px; font-family: "Noto Sans KR"; font-weight: 300;  text-align: center; line-height: 45px; }
.btn_go { background: #182f5c url(../img/btn_go.png) no-repeat right 10px center;display: inline-block; width: 220px; height: 50px; color: #fff; font-size: 17px; font-family: "Noto Sans KR"; font-weight: 400;  text-align: center; margin: 2px; line-height: 50px; }


/* input */
.seacrh_area { display: inline-block;float: left;}
.seacrh_area .sel_item { min-height: 38px; height: auto;line-height: 38px;font-size: 15px; color: #444;  position: relative; box-shadow:0;border-left:0; background:#fff;}
.seacrh_area .sel_item input, .seacrh_area .sel_item select, .seacrh_area .sel_item p, .seacrh_area .radio_top p { 
 font-size: 14px; height: 42px; line-height: 42px; margin:0; border: 1px solid #dadee6; border-right: 0; color: #444; font-family: 'NanumSquare'; text-align:left;
}
.seacrh_area .item_date input { text-indent: 13px; width: 120px;}

.sel_item p { float: right; margin-right: 14px;padding-right: 21px; text-align: right; float: left;}
.sel_item span {font-size: 15px; color: #111; font-family: "NanumSquare"; margin: 0; text-align: right;}
.sel_item input { float: left;text-indent: 12px; height: 30px; line-height: 30px; width: 100%;}
.sel_item label { float:left;}
.sel_item label.on { color:#499aef;}
.btn_search { display: inline-block; width: 60px; height: 42px; line-height: 42px; color: #fff; background-color: #667da3;text-align: center; font-size: 16px; font-family:'NanumSquare'; float: left;}

.item_select, .regi_text, .item_text, .item_textarea, .item_date, .item_search, .radio_top, .item_radio  {position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: stretch;
  align-items: stretch;
 }
.item_select select {background: #fff url(../img/bg_sel.png) no-repeat right 12px center; background-size: 23px 22px; float: right; 
 position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 1%;
  margin-bottom: 0;
  font-size: 15px; color: #000; font-family: "NanumSquare"; margin: 0; text-align: right;padding-left: 10px;
}
.item_text input, .item_text p {
 position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 1%;
  margin-bottom: 0;
  font-size: 15px; color: #000; font-family: "NanumSquare"; margin: 0; text-align: left; padding-left: 10px;}

.item_date input {background: url(../img/icon_date.png) no-repeat right 11px center; background-size: 14px 14px; float: right; border: 1px solid #e1e1e1;
 position: relative;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  width: 1%;
  margin-bottom: 0;
  font-size: 15px; color: #000; margin: 0; text-align: right;  padding-right: 32px; text-align: left; font-family:'Roboto' !important; letter-spacing:0 !important; font-weight: 400 !important; line-height:30px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
 
}



/* footer */
#back_to_top { width: 40px; height: 40px; font-size: 13px; font-weight: 700; bottom:10px; right:10px;}
#back_to_top.on { right:10px;}

.box_2.row2 li { width: calc(50% - 10px);}
.box_2.row2 li img { width: 100%; max-width: 300px;}


}
@media only screen and (max-width:900px){
.con_nomal article { width:100%;}
.con_left { margin-right: 60px;}
.con_left .map_img { width: 300px;}
.title h1 { font-size: 17px;}
.title h2 { font-size:30px;}
.nav.tab li a {color: #555;font-size: 13px;font-weight: 500;text-align: center;position: relative;margin: 0 auto;display: flex;justify-content: center;align-items: center;line-height: 17px;height: 80px;background:#fff;}

}
/* mobile */
@media only screen and (max-width:768px){
.con_nomal article strong, .con_nomal article strong span, .con_nomal article strong i { font-size: 19px; line-height: 28px;}
.btn_go { font-size: 15px; line-height: 44px; height: 44px; width: 170px;}
nav { margin-top: 0;}
.bgbg {width: calc(50% - 20px); background-size: cover;height: 35% !important; min-height: 300px;}
.pop_up { position: fixed; left: 10px; right: 30px; top:10px; width: calc(100% - 40px); height: calc(100vh - 50px); max-height: auto;}
.pop_up_jong { position: fixed; left: 30px; right: 10px; top: 50px; width: calc(100% - 40px); box-shadow: -10px -10px 20px rgba(0, 0, 0, 0.1); height: calc(100vh - 70px); max-height: auto;}
.carousel-caption h5 { text-indent:30px; font-size: 40px; letter-spacing:45px;}
.carousel-caption p { font-size: 15px; line-height: 22px;}
.carousel-caption p br { display: none;}
.wrap_sub_top, .sub_top_img {height: 200px;}
.title {width: calc(100vw + 0vw);margin-left:-5vw;height: 200px;padding-left:0;padding-top: 94px;margin-bottom:0;text-align: center;background: rgba(0, 0, 0, 0.2);position: absolute;top: -200px;margin-top:0;}
.mt_40 { margin-top: 20px !important;}
.mt_30 { margin-top: 15px !important;}

.contact_add #map { height:350px !important; width: 100% !important;}
.contact_add .box_2 {flex-direction: column; margin-bottom:0;}

.con_nomal, .con_history { margin-top: 30px;}
.con_left, .con_right { width: 100%; max-width: 100%;}
.con_left img { height:180px; object-fit: cover; }
.right_img img { height:180px; object-fit: cover; vertical-align: middle;}
.right_img_b { margin-top:30px;}
.con_right h3, .con_left h3 { margin-top:30px !important;}

.img_twin { width: 100%; left:0; margin-top: 30px;}
.img_twin ul li:first-child { margin-left: 0 !important;}
.img_twin ul li { width: calc(50% - 10px) !important;}
.box_2.row2 > li, .box_2.row2 li ul { width: 100%;}
.img_box { width: 100%;}
.m_mt_20 { margin-top: 20px;}

.con_left_right img { height: 290px; float: right; width: auto; object-fit: contain; }
.con_nomal article p.summary { font-size: 16px; line-height: 24px;}

/* business */
.mb_40 { margin-bottom: 20px !important;}
.mb_20 { margin-bottom: 10px !important;}

.etc_info { width: 100%; padding:40px 30px 30px 30px;}
.fitcover { margin-bottom: 40px;}
.fitcover img { height: auto; }

.cut_con { margin-bottom: 30px;}
.map_img { height: auto !important; margin-bottom:20px;}
.row2 { flex-direction: column; flex-wrap: nowrap}
.row2 li { margin-bottom: 20px; margin-right:0; margin-left:0;}
.row2 li p { margin-right: 10px; margin-left: 10px;}
.row2 img { width: 100%;}


.search_board .b_search_txt { width:calc(100% - 180px);}
.search_board .b_search_btn2 { top: -20px; right: 16px;}

.m_mt_30 { margin-top: 30px;}


.table_td td, .table_th th { padding: 10px 10px; font-size: 14px;}
.table_td td, .table_td td a, .table_td td div {font-size: 15px; line-height: 21px;}
.table_td td a img { width: 20px; margin-top: 5px; width: 20px;}
.table_td .board_con td { padding: 20px 10px !important;}
.board_etc a { text-align: left;}




.con_table th, .con_table td { font-size: 15px; line-height: 22px;}

#tabtab section { margin-left: 5% !important; margin-right: 5% !important;}
#tabtab .tab { margin-left:0% !important; margin-right: 0% !important;}


.user {background:url(../img/icon_user_m.png) no-repeat left center !important; background-size: 22px !important;}
.editor th { font-size: 13px;padding-left: 7px; padding-right: 7px; min-width: 90px; letter-spacing: -0.025em;}
.input_file_list { width: 100% !important; margin-top: 7px; float: left;}

.td_block th { display: block; width:80px !important; float: left; height: 44px; line-height: 32px; padding: 6px 7px;}
.td_block td { display: block; width:calc(100% - 90px) !important; float: left;}

.tumb_up .input_txt { width: calc(100% - 75px) !important;}
.btn_file, .input_file  { min-width: 70px !important; }

.slag_pyo01 { background: none;} 
.slag_pyo01 li { width: 100%; margin-left:0; margin-right:0; margin-bottom:30px;}

}
@media only screen and (max-width:620px){
.carousel-caption h5 { text-indent:40px; font-size: 30px; letter-spacing: 40px;}
}
@media only screen and (max-width:600px){
.carousel-caption h5 { text-indent:40px; font-size: 30px;}
.img_twin { left:0; width: 100%; margin-top: 30px;}
.img_twin li { width: 100% !important;margin-left: 0; margin-bottom: 20px;}

.dl_img li .dt, .dl_img li .dd { width: 100% !important;}
.dl_img li .dd { margin-left: 0; margin-top: 30px;}

.col_2 { display: inline-block; width: 100%;}
.col_2 li { width: 100%; margin-bottom: 30px;}

.col_2_2 { display: inline-block; width: 100%;}
.col_2_2 li { width: 100%; margin-bottom: 30px;}

.col_3 { display: inline-block; width: 100%;}
.col_3 li { width: 100%; margin-bottom: 30px;}

}



@media only screen and (max-width:550px){
.carousel-caption h5 { margin-top: -55px; line-height: 60px; font-size:40px; text-indent:40px;}	
.carousel-caption h5 b { width: 100%; display: inline-block;}
.bnts_area {width: 100%;}
.admin_btn { float: right;}
.bnts_area a {width: 60px; font-size: 15px;}
.btn_03 { float:left;}
}


@media only screen and (max-width:479px){
.write h4 span { width: 100%; display: inline-block; margin-left:0; padding-top: 5px;}


}
.admin_btn { position:absolute; right:10px; bottom:10px; display:inline-block; width: 100px; height: 34px; line-height: 34px; text-align:center; border:1px solid #555; color: #999;}

.wrap_login { position: fixed; top: 150px; width: 100%; text-align: center; z-index: 100;}
.login { position: relative; margin:0 auto; width: 100%; max-width: 360px;background: #fff; border-radius: 10px; padding: 40px; box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1); text-align: center;}
.login .close_pop2 { display: inline-block; text-indent: -9999px; overflow: hidden; background:url(../images/btn_close2.png) no-repeat left top; width: 20px; height: 19px; display: inline-block; position: absolute; right: 20px; top: 20px;}
.login form { text-align: left;}
.login h2 { color: #087ef4; font-size: 23px; line-height: 25px; letter-spacing: -0.025em;}
.login p { ?color: #a1b3d1; font-size: 13px; font-family:"NotoSans";font-weight:300; line-height: 16px; margin-bottom: 30px;}
.login .input_text { text-align: left; background: #f5f5f5; border: 0; border-left: 4px solid #087ef4; color: #555; height: 36px; line-height: 36px; margin-bottom: 10px; width: 100%; text-indent: 10px; font-family:"NotoSans";font-weight:300;}
.login .input_ch { height: 13px; width: 13px; margin-right: 10px;}
.login label { color: #a1b3d1; font-size: 13px; font-family:"NotoSans";font-weight:300;}
.login button { background: #087ef4; color: #fff; font-size: 16px;font-family:"NotoSans";font-weight:300; text-align: center; width: 100%; height: 36px; line-height: 36px; border-radius: 30px; display: inline-block; margin-top: 15px;}


@media (max-width:412px){
.gnb_menu .logo { background: url(../img/logo.png) no-repeat left top !important; background-size: 150px !important; left: 20px; width: 150px !important; height: 36px; }
.gnb_menu .logo_m { left:150px; background: url(../img/logo_m.png) no-repeat right top !important; background-size: 60px !important; width: 80px !important; height: 36px;  padding-left: 0 !important;}
.gnb_menu .logo_m::before { background-color:#fff; opacity: 0.5; height: 20px !important; left: 10px; }
.gnb_menu.on .logo_m::before {background-color:#fff !important;}

.gnb_menu.on .logo {background: url(../img/logo.png) no-repeat left top !important; background-size: 150px !important; left: 20px; width: 150px !important; height: 36px; top: 5px;}
.gnb_menu.on .logo_m { background: url(../img/logo_m.png) no-repeat right top !important; background-size: 60px !important; width: 80px !important; height: 36px; margin-top: 10px;}
.gnb_menu.on .logo_m::before { background-color:#fff !important; opacity: 0.5;}
}