@charset "utf-8";

html,body{width:100%;margin:0; padding:0; border:0;}
.wrap{position:relative; z-index:0; width:100%; overflow:hidden}
#wrap {position: relative; width: 100%;};
#container {width: 100%; }

:root {

	--f-pt : "Pretendard";
	--f-po : "Poppins";
	--f-ro : "Roboto Condensed", serif;
	--f-en : 'Helvetica Now Display';

	--c-red : #E30613;

}

@keyframes fadeInDown {
	from {  opacity: 0;-webkit-transform: translate3d(0, -50%, 0);transform: translate3d(0, -50%, 0);}
	to {opacity: 1;-webkit-transform: none;transform: none;}
}
@keyframes fadeInUp {
	from {  opacity: 0;-webkit-transform: translate3d(0, 50%, 0);transform: translate3d(0, 50%, 0);}
	to {opacity: 1;-webkit-transform: none;transform: none;}
}
@keyframes fadeInleft {
	from {  opacity: 0;-webkit-transform: translate3d(-50%, 0, 0);transform: translate3d(-50%, 0, 0);}
	to {opacity: 1;-webkit-transform: none;transform: none;}
}
@keyframes fadeInright {
	from {  opacity: 0;-webkit-transform: translate3d(50%, 0, 0);transform: translate3d(50%, 0, 0);}
	to {opacity: 1;-webkit-transform: none;transform: none;}
}
@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}
@keyframes cursor_scale {
  0% {
    opacity: 0;
	transform: scale(0, 0);
  }
  50% {
	opacity: 1;
	transform: scale(0.5, 0.5);
  }
  100% {
    opacity: 0;
	transform: scale(1, 1);
  }
}

/*s:gnb*/






/* aside.lf_aside{position:fixed; left:-45px;z-index:10   ; transform: rotate(90deg);top: 50%;transition:all 0.3s}
aside.rt_aside{position:fixed; right:-13px;z-index:10 ; transform: rotate(90deg);top: 50%;;transition:all 0.3s;} */

/* 
aside li{display:inline-block; vertical-align:middle; margin: 0 10px;}
aside li a{color:#fff; font-family: var(--f-po); font-weight:500; font-size:21px; text-transform: capitalize;} */

.view header.move{top:-80px;transition:all 0.6s}
/* .view aside.lf_aside.move{opacity:0;;transition:all 0.3s}
.view aside.rt_aside.move{opacity:0;;transition:all 0.3s} */
/*e:gnb*/

@keyframes undownAni1 {
	0% {transform: translate(5px,0);}
	50% {transform: translate(-5px,10%);}
	100% {transform: translate(5px,0);}
}

@keyframes undownAni2 {
	0% {transform: translate(-5px,0);}
	50% {transform: translate(5px,-10%);}
	100% {transform: translate(-5px,0);}
}

@keyframes undownAni3 {
	0% {transform: translate(-5px,0);}
	50% {transform: translate(5px,10%);}
	100% {transform: translate(-5px,0);}
}


@keyframes undownAniA {
	0% {transform: translate(0,5px);}
	50% {transform: translate(10%,-5px);}
	100% {transform: translate(0,5px);}
}
@keyframes LRAniB {
	0% {transform: translate(0,-5px);}
	50% {transform: translate(-10%,5px);}
	100% {transform: translate(0,-5px);}
}
@keyframes undownAniC {
	0% {transform: translate(0,-5px);}
	50% {transform: translate(10%,5px);}
	100% {transform: translate(0,-5px);}
}

span.br_line{display:block}
.bg_wrap {position: fixed; width:100%; height: 100vh; overflow: hidden; display: flex; left: 0; top: 0; z-index: 2; gap: 20px; }
.bg_wrap .bg-box {display: flex; align-items: center; height: 100vh;}
.bg_wrap .bg-box#item01 {padding-bottom: 20%;}
.bg_wrap .bg-box#item01 span {animation: undownAni1 10s infinite alternate;}
.bg_wrap .bg-box#item02 {padding-top: 20%;}
.bg_wrap .bg-box#item02 span {animation: undownAni2 13s infinite alternate;}
.bg_wrap .bg-box#item03 {padding-bottom: 20%;}
.bg_wrap .bg-box#item03 span {animation: undownAni3 15s infinite alternate;}
.bg_wrap img {max-width: 100%; filter: brightness(0) contrast(0.5); opacity: 0.7;}
/* .bg_wrap .bg_box01{position:absolute; left:19%;top:-250px;;background-size:cover; background-position:center;height:100%;z-index:2;transition:all 3.0s}
.bg_wrap .bg_box01 img{width:1222.2px; filter: grayscale(1);}
.bg_wrap .bg_box02{position:absolute; right:-7%;top:-200px;background-size:cover; background-position:center;height:100%;;z-index:2;transition:all 1.5s}
.bg_wrap .bg_box02 img{width:507.6px;}
.bg_wrap .bg_box03{position:absolute; left:8%;;top:500px;background-size:cover; background-position:center;height:100%;;z-index:1;transition:all 1.5s;display:none}
.bg_wrap .bg_box03 img{width:1107.9px;} */



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

	/* .bg_wrap .bg_box01{ left:10%;top:0;}
	.bg_wrap .bg_box02{ right:-15%;top:-150px;}
	.bg_wrap .bg_box03{ left:0;} */

	
	header nav ul.gnb li.nav-btn{margin:20px 0}
	header nav ul.gnb.on li.nav-btn > a{font-size:35px; }
	header nav ul.gnb.on li.pdf_btn > a {font-size: 20px;}
	header nav ul.gnb.on li.pdf_btn{display:block}
}


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

	
/* 
	.bg_wrap .bg_box01 img{width:1018.5px}
	.bg_wrap .bg_box02{ right:-15%;top:-75px;}
	.bg_wrap .bg_box02 img{width:423px}
	.bg_wrap .bg_box03 img{width:923.25px} */

	header nav ul.gnb li.nav-btn{margin:20px 40px}
	header nav ul.gnb.on li.nav-btn .sub_menu {width:auto; display:block;}


}

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

	
	span.br_line{display:inline}
	/* .bg_wrap .bg_box01{ left:10%;top:-50px;}
	.bg_wrap .bg_box01 img{width:679px}
	.bg_wrap .bg_box02{ right:-10%;top:-25px;}
	.bg_wrap .bg_box02 img{width:282px}
	.bg_wrap .bg_box03{ left:0%;top:300px;}
	.bg_wrap .bg_box03 img{width:615.5px} */


	/* #m_menu {right:0px; width: 30px; height: 30px;} */
	header .cont_box h1{left:0}
	header .cont_box h1 img{width:100px}

	header nav ul.gnb li.nav-btn{margin:10px 3%;transition:all 0.3s}
	header nav ul.gnb.on li.nav-btn > a{font-size:25px; }
	/* aside.lf_aside{display:none}
	aside.rt_aside{display:none} */



}


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

	.bg_wrap {flex-direction: column; justify-content: space-around;}
	.bg_wrap .bg-box {height: 30vh;}
	.bg_wrap .bg-box span {height: 30vh;}
	.bg_wrap .bg-box span img {max-width: 100%; max-height: 100%;}
	.bg_wrap .bg-box#item02 {justify-content: end;}
	.bg_wrap .bg-box#item01, .bg_wrap .bg-box#item02, .bg_wrap .bg-box#item03 {padding: 0;}

	.bg_wrap .bg-box#item02 span {animation: LRAniB 13s infinite alternate;}

	/* .bg_wrap .bg_box01{ left:0;top:-10px;}
	.bg_wrap .bg_box01 img{width:339.5px}
	.bg_wrap .bg_box02{ right:-5%;top:-10px;}
	.bg_wrap .bg_box02 img{width:141px}
	.bg_wrap .bg_box03{ left:-5%;top:250px;display:none}
	.bg_wrap .bg_box03 img{width:307.75px} */
	
	

	header nav ul.gnb li.nav-btn{display:block}
	header nav ul.gnb.on li.nav-btn .sub_menu {display:none}
	header nav ul.gnb.on li.pdf_btn > a {font-size:16px;}
	
}

/************ header ************/
header{position:fixed;/*background:#fff;*/;  z-index:200;width:100%;top:0px;transition:all 0.6s;padding:0 20px; background: rgba(0,0,0,0.7); left: 0;}

header .cont_box{max-width:1840px;margin:0 auto;padding:25px 40px;font-size:0;position:relative; display: flex; justify-content: space-between; align-items: center;}
header .cont_box h1{ z-index: 210; font-size: 0;}
header .cont_box ul{display:inline-block;width:100%;vertical-align:middle;text-align:right}
header .cont_box ul li.nav-btn{display:inline-block; ;vertical-align:middle;margin:0 20px}
header .cont_box ul li.nav-btn > a{color:#000000; font-size:18px;transition:all 0.3s;  font-family: 'NanumSquare', sans-serif;font-weight:700}

header .cont_box nav {position: relative; width: 50px; height: 50px;}
#m_menu {display:block;width: 50px;height:50px; position: absolute; left: 0; top: 0; ;-webkit-transform: rotate(0deg);; transform: rotate(0deg); -webkit-transition: .25s ease-in-out;;transition: .25s ease-in-out;cursor: pointer;z-index:999}
/* #m_menu::before {content:""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border-radius: 50%; background: rgba(0,0,0,0.5); } */
#m_menu span {display: block;position: absolute;height: 3px; width: 30px;background: #fff; ;opacity: 1;left: 0; -webkit-transform: rotate(0deg); ;transform: rotate(0deg); -webkit-transition: .25s ease-in-out; ;transition: .25s ease-in-out; border-radius: 2px; left: 10px;}
#m_menu span:nth-child(1) { top: 13px;}
#m_menu span:nth-child(2) { top: 23px;}
#m_menu span:nth-child(3) {top: 33px;}
#m_menu.open span:nth-child(1) {left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(45deg);}
#m_menu.open span:nth-child(2) {opacity: 0;left: -60px;}
#m_menu.open span:nth-child(3) { left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-45deg);}


header nav .gnb_bg {position: fixed;height:0;left:0;top:0;background:#1C1C15;z-index:-1;width:0;padding:0;transition:all 0.3s; display: flex; align-items: center; justify-content: center;}
header nav .gnb_bg.on{height:100%;z-index:200;width:100%;;;transition:all 0.3s;}
header nav .gnb_bg.on .gnb-wrap {opacity: 1; pointer-events: auto; transition: 0.3s 0.3s;}
header nav .gnb_bg .gnb-wrap {width: 80%; max-width: 1600px; margin: auto; display: flex; opacity: 0; pointer-events: none; transition: 0s;}
header nav .gnb_bg .gnb-wrap .right {width: 53%; padding-left: 27%; height: 60vh; position: relative; }
header nav .gnb_bg .gnb-wrap .right::before {content:""; width: 1px; height: 100%; position: absolute; left: 25%; top: 0; background: #3C3C3C;}

header nav .right .r-dep2 {display: none;}
header nav .right .r-dep2.on {display: block;}
header nav .right .r-dep2 ul {text-align: left;}
header nav .right .r-dep2 li {margin-top: 18px;}
header nav .right .r-dep2 a {display: block; font-weight: 500; font-size: 32px; font-family: var(--f-po); color: #666; text-transform: uppercase; }
header nav .right .r-dep2 a:hover {color: #fff;}
header nav .right .brochure {position: absolute; left: 50%; bottom: 48px;}
header nav .right .brochure a {height: 54px; padding: 0 22px; background: var(--c-red); color: #fff; font-size: 16px; font-weight: 500; font-family: var(--f-po); display: inline-flex; align-items: center; justify-content: center;}

header nav .gnb { position: relative; width: 47%;}
header nav .gnb .dep2 { display: none;}
header nav .gnb .dep2 ul {text-align: left;}
header nav .gnb .dep2.on {opacity: 1;}
header nav .gnb .dep2 a {display: block; font-weight: 500; font-size: 32px; font-family: var(--f-po); color: #fff; text-transform: uppercase; }

header nav .gnb .gnb-btn { font-family: var(--f-po); font-size: 80px; font-weight: 700; position: relative;display: inline-block;}
header nav .gnb .gnb-btn .upper {color: var(--c-red); position: absolute; left: 50%; top: 50%; display: block; transform:translate(-50%,-50%); clip-path: ellipse(50% 0% at 50% 100%); transition: 0.3s; z-index: 2;}
header nav .gnb .gnb-btn .under {color: #fff; display: block; position: relative; z-index: 1;}
header nav .gnb .gnb-btn .under::after {content:""; width: 100%; height: 100%; background: #1C1C15; position: absolute; left: 0; bottom: 0; clip-path: ellipse(50% 0% at 50% 100%); transition: 0.3s;} 
header nav .gnb .gnb-btn:hover .upper {clip-path: ellipse(80% 100% at 50% 100%);}
header nav .gnb .gnb-btn:hover .under::after {clip-path: ellipse(80% 100% at 50% 100%);}
@media screen and (max-width:1024px){
	header nav .gnb {width: 100%; text-align: center;}
	header nav .gnb .gnb-btn {font-size: 60px;}
	header nav .gnb_bg .gnb-wrap {flex-direction: column;}
	header nav .gnb_bg .gnb-wrap .right {width: 100%; height: unset; padding: 0;}
	header nav .gnb_bg .gnb-wrap .right::before {display: none;}
	header nav .gnb_bg .gnb-wrap .right .dep2-wrap {display: none;}
	header nav .right .brochure {position: static; margin: 10vh auto 0; text-align: center;}

	header .cont_box nav {width: 40px; height: 40px;}
	#m_menu { width: 40px; height: 40px;}
	#m_menu span {width: 22px; height: 2px; left: 9px;}
	#m_menu span:nth-child(1) {top: 11px;}
	#m_menu span:nth-child(2) {top: 19px;}
	#m_menu span:nth-child(3) {top: 27px;}

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

	header .cont_box h1 {left: 0;}
	#m_menu {right: 0;}

	
	
}
@media screen and (max-width:684px){
	header .cont_box {padding: 20px 10px;}
	header .cont_box h1 img{width:80px}

	header .cont_box nav {width: 30px; height: 30px;}
	#m_menu { width: 30px; height: 30px;}
	#m_menu span {width: 16px; height: 2px; left: 7px;}
	#m_menu span:nth-child(1) {top: 8px;}
	#m_menu span:nth-child(2) {top: 14px;}
	#m_menu span:nth-child(3) {top: 20px;}
}
@media screen and (max-width:480px){
	header nav .gnb .gnb-btn {font-size: 40px;}
	header nav .right .brochure a {font-size: 14px; height: 42px; padding: 0 12px;}
}



/************ footer **** ********/
.footer {width:100%; padding:80px 5%; background:#1C1C15; color:#999; font-size:16px; position:relative; z-index:10; line-height: 1.5;}
.footer .f-top {display: flex; justify-content: space-between; align-items: start; gap: 60px; }
.footer .f-top .left {}
.footer .f-top .left ul {display: flex; gap: 125px;}
.footer .f-top .left ul li {flex-shrink: 0;}
.footer .f-top .left .tit {color: #fff; font-family: var(--f-po); font-weight: 600; margin-bottom: 30px; font-size: 16px;}
.footer .f-top .left p span {display: block; word-break: auto-phrase; pointer-events: none;}
.footer .f-top .left p span + span {margin-top: 6px;}
.footer .f-top .left .sns {display: flex; gap: 24px; align-items: center;}

.footer .f-top .right {}
.footer .f-top .right .contact {}
.footer .f-top .right .contact a {display: flex; justify-content: space-between; align-items: center; padding: 0 10px 18px; border-bottom: 1px solid #999; width: 400px; color: #666; font-size: 16px; font-weight: 600; font-family: var(--f-po);}
.footer .f-top .right .contact a::after {content:""; width: 24px; height: 24px; background: url(/img/common/arrow_r_g.svg) center no-repeat; background-size: cover;}
.footer .f-top .right .copyright {font-family: var(--f-po); margin-top: 50px; text-align: right; font-size: 13px;}

.footer .f-logo {margin-top: 100px;}
.footer .f-logo img {max-width: 100%;}






@media screen and (max-width:1680px){
	.footer {font-size: 14px;}
	.footer .f-top .left ul {gap: 60px;}
	.footer .f-top .right .contact a {width: 260px;}
}

@media screen and (max-width:1280px){
	.footer .f-top .right {position: absolute; right: 5%; bottom: 80px;}
	.footer .f-top .right .copyright {margin-top: 30px;}
	/* .footer .f-top {flex-direction: column;} */
}
@media screen and (max-width:1024px){
	.footer .f-top ul {flex-wrap:wrap; }
	.footer .f-top .left ul li:nth-child(1) {width: 100%;}
}
@media screen and (max-width:768px){
	.footer {font-size: 12px; padding: 40px 5%;}
	.footer .f-top .left ul {flex-direction: column; gap: 16px; }
	.footer .f-top .left .tit {display: none;}
	.footer .f-top .left .sns {margin-top: 16px;}

	.footer .f-top .right {bottom: 40px;}
	.footer .f-top .right .contact a {width: 140px; font-size: 14px; padding: 0 5px 5px; margin-left: auto;}
	.footer .f-top .right .copyright {font-size: 12px;}

	.footer .f-logo {width: 80px; padding-bottom: 48px; margin-top: 60px;}
}

/* top btn */
a#MOVE_TOP_BTN {position: fixed;  width: 48px; height: 48px; border-radius: 50%; right: 32px; bottom: 32px;display:block;z-index: 100; background: #111 url(/img/common/top_btn.png) center no-repeat; } 

@media screen and (max-width:480px){
	a#MOVE_TOP_BTN {right: 16px; width: 42px; height: 42px;}
}