body{font-family: 'SUIT', sans-serif;overflow:hidden;}
h2{font-family: 'SUIT', sans-serif;}
h3{font-family: 'SUIT', sans-serif;}
h4{font-family: 'SUIT', sans-serif;}
p{font-family: 'SUIT', sans-serif;}
input,button{font-family: 'SUIT', sans-serif;}

#page_cont{
	width:100%;
	max-width:1660px;
	margin:0 auto;
}

	/* 위로 가는 애니메이션 */
	.waypoints-up {opacity:0;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;transition:all 1s ease-in-out;-webkit-transform:translate3d(0,30px,0);-moz-transform:translate3d(0,30px,0);-o-transform:translate3d(0,30px,0);-ms-transform:translate3d(0,30px,0);transform:translate3d(0,30px,0)}
	.w-active .waypoints-up {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	.waypoints-ups {opacity:0;-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-transform:translate3d(0,30px,0);-moz-transform:translate3d(0,30px,0);-o-transform:translate3d(0,30px,0);-ms-transform:translate3d(0,30px,0);transform:translate3d(0,30px,0)}
	.w-active .waypoints-ups {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}

	/* 아래로 가는 애니메이션 */
	.waypoints-down {opacity:0;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;transition:all 1s ease-in-out;-webkit-transform:translate3d(0,-30px,0);-moz-transform:translate3d(0,-30px,0);-o-transform:translate3d(0,-30px,0);-ms-transform:translate3d(0,-30px,0);transform:translate3d(0,-30px,0)}
	.w-active .waypoints-down {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	.active .waypoints-down {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	
	/* 오른쪽으로 가는 애니메이션 */
	.waypoints-right {opacity:0;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;transition:all 1s ease-in-out;-webkit-transform:translate3d(-30px,0,0);-moz-transform:translate3d(-30px,0,0);-o-transform:translate3d(-30px,0,0);-ms-transform:translate3d(-30px,0,0);transform:translate3d(-30px,0,0)}
	.w-active .waypoints-right {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	.active .waypoints-right {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	
	/* 왼쪽으로 가는 애니메이션 */
	.waypoints-left {opacity:0;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;transition:all 1s ease-in-out;-webkit-transform:translate3d(30px,0,0);-moz-transform:translate3d(30px,0,0);-o-transform:translate3d(30px,0,0);-ms-transform:translate3d(30px,0,0);transform:translate3d(30px,0,0)}
	.w-active .waypoints-left {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	.active .waypoints-left {opacity:1;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}
	
	/* 가운데 출력 애니메이션 */
	.waypoints-center {opacity:0;-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;-ms-transition:all 1s ease-in-out;transition:all 1s ease-in-out}
	.w-active .waypoints-center {opacity:1}
	.active .waypoints-center {opacity:1}
	
	/* 딜레이 */
	.delay-05 {-webkit-transition-delay:.5s;-moz-transition-delay:.5s;-o-transition-delay:.5s;-ms-transition-delay:.5s;transition-delay:.5s}
	.delay-075 {-webkit-transition-delay:.75s;-moz-transition-delay:.75s;-o-transition-delay:.75s;-ms-transition-delay:.5s;transition-delay:.75s}
	.delay-10 {-webkit-transition-delay:1s;-moz-transition-delay:1s;-o-transition-delay:1s;-ms-transition-delay:1s;transition-delay:1s}
	.delay-15 {-webkit-transition-delay:1.5s;-moz-transition-delay:1.5s;-o-transition-delay:1.5s;-ms-transition-delay:1.5s;transition-delay:1.5s}
	.delay-20 {-webkit-transition-delay:2s;-moz-transition-delay:2s;-o-transition-delay:2s;-ms-transition-delay:2s;transition-delay:2s}
	.delay-25 {-webkit-transition-delay:2.5s;-moz-transition-delay:2.5s;-o-transition-delay:2.5s;-ms-transition-delay:2.5s;transition-delay:2.5s}
	.delay-30 {-webkit-transition-delay:3s;-moz-transition-delay:3s;-o-transition-delay:3s;-ms-transition-delay:3s;transition-delay:3s}
	.delay-35 {-webkit-transition-delay:3.5s;-moz-transition-delay:3.5s;-o-transition-delay:3.5s;-ms-transition-delay:3.5s;transition-delay:3.5s}


.t__act{
	transition: transform 1.5s cubic-bezier(0.4, 0, 0, 1) 1.5s,opacity 1.8s cubic-bezier(0.4, 0, 0, 1) 1.5s;
	transform: translateY(50px);
	opacity: 0;
	transition-delay: 0.25s;
}

.t__act_right{
	transition: transform 1.5s cubic-bezier(0.4, 0, 0, 1) 1.5s,opacity 1.8s cubic-bezier(0.4, 0, 0, 1) 1.5s;
	transform: translateX(-50px);
	opacity: 0;
	transition-delay: 0.25s;
}

.t__act_left{
	transition: transform 1.5s cubic-bezier(0.4, 0, 0, 1) 1.5s,opacity 1.8s cubic-bezier(0.4, 0, 0, 1) 1.5s;
	transform: translateX(150px);
	opacity: 0;
	transition-delay: 0.25s;
}

.t__act.is-inview{
	transform: translateY(0px);
    opacity: 1;
}

.t__act_right.is-inview{
	transform: translateX(0px);
    opacity: 1;
}

.t__act_left.is-inview{
	transform: translateX(0px);
    opacity: 1;
}

.c-scrollbar{
	z-index:9999;
}

#cont_area{
	width:1280px;
	margin:0 auto;
}




.header {width: 100%; position:absolute; z-index: 105;top:0;left:0;transition: transform .3s cubic-bezier(0.4, 0, 0, 1);}
.header.down{
	background:#ffffffe6;
}

.header.down .head_area .gnb_area .menu_area li.gnb_cont a.gnb_1_1{color: #111}
#header.down .hd_inner .right_menu .lang_list .lang_text a{color: #111}
#header.down .hd_inner .right_menu .lang_list .lang_text.line{background: #111;}

.header:not(.first){transform: translateY(-100%);}
.header.active{transform: translateY(0);background:#fff;box-shadow: 0px 3px 17px rgb(0 0 0 / 2.5%); }
.header.active .head_area .gnb_area .menu_area li.gnb_cont a.gnb_1_1{color:#111;}
.header.active .head_area .gnb_area .menu_area li.gnb_cont{    padding: 23px 25px;}
.header.active .head_area .gnb_area .menu_area li.gnb_cont:hover .sub_menu{top:67px;}
.header.active .head_area .right_menu .all_menu{color:#111;}
.header.active .head_area .lang .active{color:#111;}
.header .head_area {width:100%; z-index: 5; display: flex; justify-content: space-between; align-items: flex-start;}
.header .head_area .hd_inner {width: 100%;padding:0 70px;}
.header .head_area .header_cont_area {display: flex; justify-content:space-between; align-items: center;}
.header .head_area .logo {}
.header .head_area .logo a {display: inline-block;}
.header .head_area .logo a img {width: 100%; max-width: 215px;}
.header.open .head_area .logo a img{filter: brightness(0) invert(1);}
.header .head_area .gnb_area {display: flex; align-items: center;}
.header .head_area .gnb_area .menu_area {display: none; vertical-align: middle;}
.header .head_area .gnb_area .menu_area li.gnb_cont {display: inline-block; padding: 50px 0px; vertical-align: top; cursor: pointer; position: relative; text-align: center;overflow: hidden;min-width:190px;transition:.35s all;}
.header.down .head_area .gnb_area .menu_area li.gnb_cont{padding:35px 0;}
.header .head_area .gnb_area .menu_area li.gnb_cont a.gnb_1_1{color:#fff;font-size:18px;font-weight:400;letter-spacing:-.20px;}
.header .head_area .gnb_area .menu_area li.gnb_cont:hover a {color:#34A1A2;}
.header .head_area .gnb_area .menu_area li.gnb_cont .sub_menu {opacity:0;text-align: center; position: absolute; top: 60px; left: 50%; transform: translateX(-50%); width: 100%;background-color: #fff;padding: 5px 0;border-radius: 4px;}
.header .head_area .gnb_area .menu_area li.gnb_cont:hover{overflow:visible;}
.header .head_area .gnb_area .menu_area li.gnb_cont:hover .sub_menu{opacity: 1;visibility: visible;top:80px;transition: opacity 300ms ease, top 600ms ease;}
.header .head_area .gnb_area .menu_area li.gnb_cont .sub_menu li {display: block;border-bottom:1px solid #ebebeb;}
.header .head_area .gnb_area .menu_area li.gnb_cont .sub_menu li:last-child{border-bottom:0;}
.header .head_area .gnb_area .menu_area li.gnb_cont .sub_menu li a {color: #888888; word-break: keep-all;font-size:14px;letter-spacing:-.20px;line-height:40px;    display: block;}
.header .head_area .gnb_area .menu_area li.gnb_cont .sub_menu li a:hover {color:#1f9fa1; transition: all 0.3s ease-in-out;}
.header .head_area .right_menu {display: flex; align-items: center;margin-left:90px;}
.header .head_area .right_menu .all_menu {display: inline-block;cursor: pointer; position: relative;vertical-align: middle;color:#fff;}
.header .head_area .right_menu .all_menu .c-burger{
	opacity: 1;
    transform: scaleX(1);
    transition: transform .6s cubic-bezier(0.4, 0, 0, 1),opacity .6s cubic-bezier(0.4, 0, 0, 1);
    transition-delay: 1s;
	height: 37px;
    position: relative;
    padding: 15px 0;
}



#header .hd_inner .right_menu .lang_list{
	position: relative;
    float: left;
    z-index: 100;
	display:flex;
	align-items: center;
}

#header .hd_inner .right_menu .lang_list .lang_text{
	margin: 0 6px;
}

#header .hd_inner .right_menu .lang_list .lang_text a{
	display: block;
	font-size: 18px;
	line-height: 30px;
	color: #ffffff85;
	font-weight: 500;
	position: relative;
	letter-spacing: 0px;
}

#header .hd_inner .right_menu .lang_list .lang_text.on_lang a {
    color: #34A1A2;
}

#header.sub_down .hd_inner .right_menu .lang_list .lang_text.on_lang a {
    color: #34A1A2;
}

#header.drop .hd_inner .right_menu .lang_list .lang_text a{
	color:#ffffff85;
}

#header.drop .hd_inner .right_menu .lang_list .lang_text.on_lang a{
	color:#34A1A2;
}


#header.drop .hd_inner .right_menu .mem_area a{
	color:#ffffff85;
}

#header .hd_inner .right_menu .lang_list .on_lang a{
	color:#fff;
}

#header .hd_inner .right_menu .lang_list .lang_text.line{
    content: "";
    width: 1px;
    height: 10px;
    background: #eeeeee;
	display:inline-block;
	margin:0 10px;
}

#header.drop .hd_inner .right_menu .lang_list .lang_text.line{
	background:#eeeeee;
}


#header .menu_btn{
	margin-left:50px;
	width:80px;
	height:80px;
	position:relative;
	transition:.35s all;
}

#header.down .menu_btn{
	margin-left:50px;
	width:60px;
	height:60px;
	position:relative;
}

#header .menu_btn .menu_round{
	width:100%;
	height:100%;
	position:relative;
	background:#34A1A2;
	border:0;
}

#header .menu_btn .menu_t{
	width:18px;
	height:14px;
	display:block;
	position:relative;
	margin:0 auto;
}

#header .menu_btn .menu_t span{
	transition : all .4s;
	display:block;
	height:2px;
	background:#fff;
	position:absolute;
	right:0;
}

#header .menu_btn .menu_t span:nth-child(1){
	top:0;
	width:100%;
}

#header .menu_btn .menu_t span:nth-child(2){
	top:6px;
	width:70%;
}

#header .menu_btn .menu_t span:nth-child(3){
	bottom:0;
	width:100%;
}

#header .menu_btn .menu_round:hover span:nth-child(2){
	width:100%;
}

#header .menu_btn .menu_round:hover span:nth-child(3){
	width:100%;
}

#header.drop .menu_btn .menu_t span{
	background:#34A1A2;
}



.header .head_area .lang {display: inline-block; position: relative; padding: 20px 20px; overflow: hidden; cursor: pointer; margin: 0 50px;}
.header .head_area .lang .active {color:#fff; position: relative; font-size: 17px; font-weight: 600; padding-bottom: 6px; display: flex; align-items: center;}
.header .head_area .lang .active .arrow {display: inline-block; position: relative; transform: rotate(315deg); margin-left: 18px; margin-top: -4px;}
.header .head_area .lang .active .arrow::after {content: ''; display: inline-block; position: absolute; left: 0; top: 0; width: 8px; height: 8px; cursor: pointer; border-bottom: 2px solid #fff; border-left: 2px solid #fff;}
.header .head_area .lang:hover {overflow: visible;}
.header .head_area .lang:hover .lang_menu {opacity: 1; visibility: visible; top: 55px; transition: opacity 300ms ease, top 600ms ease;}
.header .head_area .lang .lang_menu {opacity: 0; background-color: #fff; padding: 10px 20px; border-radius: 4px; width: 100%; position: absolute; left: 0; top: 30px; box-shadow: 6px 4px 17px rgb(0 0 0 / 15%); text-align: center; z-index: 9;}
.header .head_area .lang .lang_menu a {font-size: 15px; font-weight: 600; color:#888; display: block; margin: 12px 0;}
.header .head_area .lang .lang_menu a:hover {color: #34A1A2;}
.header .head_area.on {height: 380px; background-color: #fff; transition: all 0.7s ease-in-out;}
.header .head_area.on .hd_inner {border-bottom: 1px solid #e6e6e6; transition: all 0.5s ease;}
.header .head_area.on .gnb_area .menu_area li.gnb_cont {color:#111; transition: all 0.3s ease-in-out;}
.header .head_area.on .lang .active {color:#34A1A2;}
.header .head_area.on .lang .active .arrow::after {border-bottom: 2px solid #222; border-left: 2px solid #222;}
.header .head_area.on .right_menu .all_menu span {background: #222;}
.header .head_area.active {background-color: #fff;}
.header .head_area.active .hd_inner {border-bottom: 1px solid #e6e6e6; transition: all 0.5s ease;}
.header .head_area.active .gnb_area .menu_area li.gnb_cont {color:#111; transition: all 0.3s ease-in-out; }
.header .head_area.active .lang .active {color:#222;}
.header .head_area.active .lang .active .arrow::after {border-bottom: 2px solid #222; border-left: 2px solid #222;}
.header .head_area.active .right_menu .all_menu span {background: #222;}


.header .m_menu_btn {display: inline-block; cursor: pointer; display: none;}
.header .m_menu_btn .menu-trigger {position: relative; width: 16px; height: 15px;  margin-top: -5px;}
.header .m_menu_btn .menu-trigger span {position: absolute; right: 0; width: 100%; height: 2px; background-color: #172244; border-radius: 100px;}
.header .m_menu_btn .menu-trigger span:nth-child(1) {top: 0;}
.header .m_menu_btn .menu-trigger span:nth-child(2) {top: 6px; width: 80%;}
.header .m_menu_btn .menu-trigger span:nth-child(3) {bottom: 0;}
.header .modal {opacity:0;position: fixed; width: 100%; height: 100vh; top: 0; right: 0; bottom: 0; z-index: 999; background-color:#fff;transform:translateX(100%);transition:.8s all;background-image:url("../img/main/menu_back.png");background-repeat:no-repeat;background-size:cover;background-position:center;}
.header .modal.open{opacity:1;transform:translateX(0%);}
.header .modal .max_w{
	display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    align-items: center;
	position:relative;
	width:100%;
	height:100%;
}
.header .modal .header_close_btn {display: inline-block; width: 65px; height: 65px;  cursor: pointer; z-index: 1;background:#34A1A2;border-radius:100%;color:#fff;font-size:24px;margin-bottom:60px;}
.header .modal .modal_title{color:#222222;font-size:60px;font-weight:900;line-height:44px;letter-spacing:-.20px;text-align:center;margin-bottom:60px;}
.header .modal .con {width:100%;}
.header .modal .con .modal_menu {width: 100%; z-index: 1;display: flex;
    align-items: flex-start;
    justify-content: center;}
.header .modal .con .modal_menu li {width:100%;position:relative;text-align:center;}
.header .modal .con .modal_menu li a.tit1{color:#222222;font-size:32px;font-weight:bold;line-height:115px;letter-spacing:-.20px;cursor:pointer;transition:.6s all;display:block;border-bottom:1px solid #dddddd;}
.header .modal .con .modal_menu .f40 {}
.header .modal .con .modal_menu li a {color:#666666;}
.header .modal .con .modal_menu li a:hover {color:#34A1A2;}
.header .modal .con .modal_menu li .modal_sub_menu {padding-top:30px;}
.header .modal .con .modal_menu li .modal_sub_menu li a {font-size: 18px;font-weight: 500; color:#666666;line-height:45px;display:block;text-align:center;}
.header .modal .con .modal_menu li .modal_sub_menu li a:hover {color:#34A1A2;}
.header .modal .bottom {position: absolute; bottom: 80px; width: 100%; display: flex; justify-content: space-between; align-items: flex-end; width: calc(100% - 30px);}
.header .modal .bottom .bt_left {}
.header .modal .bottom .bt_left .text {}
.header .modal .bottom .bt_left .text .f16 {color:#999;}
.header .modal .bottom .bt_left .text .f16 .ft_txt {margin-right: 15px;}
.header .modal .bottom .bt_left .text .f16 .ft_txt strong {font-weight: 500; color:#555; margin-right: 10px;}
.header .modal .bottom .bt_right .f14 {font-weight: 500; color:#999;}

.header .modal .briks-line {width: 100%; z-index: 0;}
.header .modal .briks-line .brick {width: 25%;}
.header .modal .briks-line, .briks-line .brick {position: absolute; top: 0; left: -1px; height: 100%; pointer-events: none;}
.header .modal .briks-line .brick {border-right: 1px solid #eee;  border-top: 0 solid #eee; height: 100%;}
.header .modal .briks-line .brick:nth-child(4n) {left: 75%; border-right: 0;}
.header .modal .briks-line .brick:nth-child(4n-1) {left: 50%;}
.header .modal .briks-line .brick:nth-child(4n-2) {left: 25%;}
.header .modal .briks-line .brick:nth-child(4n-3) {left: 0;}


.c-bookmark {
    position: fixed;
    right: 0;
    top: 0;
    background-color: #34A1A2;
    color: #fff;
    z-index: 100;
    transform: rotate(-90deg) translateY(100%);
    transform-origin: right top;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px 0 0 0;
	transition: transform .9s cubic-bezier(0.4, 0, 0, 1),background-color .9s cubic-bezier(0.4, 0, 0, 1);
	font-size:17px;
	letter-spacing:2.5px;
	font-weight:400;
}

.c-bookmark {
    height: 4.6875rem;
    width: 13.75rem;
}

.c-bookmark:focus, .c-bookmark:hover {
    color: #fff;
    background-color: #4156c2;
}

html.is-loaded .c-bookmark {
    transform: rotate(-90deg) translateY(-100%);
}


.modal_popup {background: rgb(0 0 0 / 60%); position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 9999;}
.modal_popup .popup {background-color: #fff; width:100%; max-width: 960px; height: calc(100vh - 100px);max-height:540px; position: relative; top: 50%; left:50%; transform: translate(-50%, -50%); padding:0px; margin: 0;}
.modal_popup .popup .pop_close_btn i{color:#fff;font-size:20px;cursor:pointer;}
.modal_popup .popup .pop_close_btn{position:absolute;top:0;right:-30px;}
.modal_popup .popup .video_area{display:flex;width:100%;height:100%;position:relative;}
.modal_popup .popup .video_area iframe{width:100%;height:100%;position:relative;}

#area_menu{visibility:hidden; opacity:0; position:fixed; top:0; right:0; bottom:0; width:100%; height:0%; background:#333332; text-align:left; z-index:12000; -webkit-transform: translateY(-100%); transform: translateY(-100%); transition:all 1s ease; overflow: hidden;}
#area_menu #cont_area{position:relative;height:100%;}
#area_menu #menu_wrap{position:relative;height:100%;display: flex; flex-direction:column;justify-content: center;align-items: center;}
#area_menu #menu_wrap .list{position: relative;display: flex;flex-wrap: wrap;justify-content: space-between;width:100%;}
#area_menu #menu_wrap .list > li{position: relative;width:23%; box-sizing:border-box; color: #fff;}


#area_menu.active{visibility:visible; opacity:1; -webkit-transform: translateY(0); transform: translateY(0); height:100%; transition:all .5s ease;}
#area_menu .inr{height:100%;}
#area_menu #menu_wrap{position:relative;}
#area_menu #menu_wrap:after{display:block;visibility:hidden;clear:both;content:""}
#area_menu #menu_wrap .list{}
#area_menu #menu_wrap .list > li{position:relative; display:block; margin:0 1%;border-right:1px solid #40403e;padding:40px 25px;}
#area_menu #menu_wrap .list > li:nth-child(4){border-right:0;}

#area_menu #menu_wrap .list > li > a{display:block; font-size:32px; font-weight:bold; letter-spacing:-1px; color:#fafbff; line-height:1.3em; word-break:keep-all; transition:all 0.3s ease; opacity:0; transform: translate3d(0, 150%, 0);}
#area_menu.active #menu_wrap .list > li > a{opacity:1; transform: translate3d(0, 0, 0); transition: 1.3s 0.7s;}
#area_menu #menu_wrap .list > li:last-child{margin:0;}
#area_menu #menu_wrap .list > li > a:hover{color:#fff;}
#area_menu #menu_wrap .list > li .sub_menu{display:block; margin:25px 0 0; opacity:0; transform: translate3d(0, 150%, 0)}
#area_menu.active #menu_wrap .list > li .sub_menu{opacity:1; transform: translate3d(0, 0, 0); transition: 1.1s 0.9s;}
#area_menu #menu_wrap .list > li .sub_menu > li{}
#area_menu #menu_wrap .list > li .sub_menu > li > a{display:inline-block; padding:10px 0; font-size:18px; font-weight:500; line-height:1.2em; color:#fafbff; transition:all 0.3s ease;}
#area_menu #menu_wrap .list > li .sub_menu > li > a:hover{color:#fff; font-weight:500;}

#area_menu .com_info{position:absolute; right:0; bottom:0; text-align:right;}
#area_menu .com_info h1{font-size:24px; font-weight:300; color:#fff;}
#area_menu .com_info span{font-size:12px; font-weight:400; color:#626464; letter-spacing:-1px;}

#area_menu .sub_menu2{

}

#area_menu .sub_menu2 .sub_menu2_li .sub_tit2{
	color:#898987;
	font-weight:500;
	font-size:15px;
	letter-spacing:-.30px;
	line-height:1.2em;
	padding:10px 0;
	display:block;
}

#area_menu .all_menu_top{
	display:flex;
	justify-content: space-between;
	align-items: center;
	width:100%;
	margin-bottom:90px;
}

#area_menu .all_menu_top .title{
	color:#fafbff;
	font-size:64px;
	font-weight:bold;
	letter-spacing:-.30px;
	line-height:84px;
}

#area_menu .all_menu_top .close_btn{
	cursor:pointer;
	font-size:20px;
	color:#fafbff;
}


.mobile_gnb{
	display:none;
	position:absolute;
	top:61px;
	left:0;
	width:100%;
	z-index:9999;
}

.mobile_gnb .gnb_areas{
	background:#fff;
	border-bottom: 1px solid rgba(255,255,255,0.3);
	transition:.1s all;
	height:0;
	overflow:hidden;
}

.mobile_gnb .gnb_areas .mg_1{
}

.mobile_gnb .gnb_areas .mg_1 .mg_title{
	font-size:14px;
	font-weight:bold;
	letter-spacing:-.2px;
	background:#f7f7f7;
	display:block;
	padding:16px 35px;
}

.mobile_gnb .gnb_areas .mg_1 .mg_2{
	display:none;
	padding:16px 35px;
}
.mobile_gnb .gnb_areas .mg_1 .mg_2 .mg_2_area{
	margin:14px 0;
}

.mobile_gnb .gnb_areas .mg_1 .mg_2 .mg_2_area a{
	font-size:13px;
}
.mobile_gnb .gnb_areas .mg_1 .mg_2{
	display:none;
	padding:16px 35px;
}
.mobile_gnb .gnb_areas .mg_1 .mg_2 .mg_2_area{
	margin:14px 0;
}

.mobile_gnb .gnb_areas .mg_1 .mg_2 .mg_2_area a{
	font-size:13px;
}


.mobile_gnb .gnb_areas .mg_1 .mg_2 .mg_2_area a.mg_3{
	font-weight:400;
	color:#999999;
	font-size:12px;
	letter-spacing:-.2px;
	line-height:30px;
	display:block;
}


#content{
	width:100%;
	min-width:1280px;
}





.section_01 .slide_area{
	position:relative;
}

.section_01 .main_slider .slide_cont{
	width:100%;
	height:100vh;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

.section_01 .main_slider .slide_cont .img_area{
	position:relative;
	width:100%;
	height:100%;
		background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

.section_01 .main_slider #slide_1 .img_area{
	background-image:url("../img/main/main_background1.jpg");
}

.section_01 .main_slider #slide_2 .img_area{
	background-image:url("../img/main/main_background2.jpg");
}


.section_01 .main_slider div.slick-active .img_area{
    animation: slick-scale 5s;
}

@keyframes slick-scale {
	0% {
		transform: scale(1.2);
	}
	100% {
		transform: scale(1);
	}
}
@keyframes slick-scale {
	0% {
		transform: scale(1.2);
	}
	100% {
		transform: scale(1);
	}
}
@keyframes slick-h {
	0% {
        transform: translateX(30px);
        opacity: 0;
    }
    30% {
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}


.arrow_area{
    margin: 0 auto;
    position: absolute;
    width: 100%;
    top: 50%;
    left: 0;
	-webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

 .arrow_area ul{
	display: flex;
    justify-content: space-between;
 }

 .arrow_area ul li{
	width:45px;
	height:45px;
	display:inline-block;
	cursor:pointer;
	position:relative;
}

.arrow_area ul li::after{
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:-2;
	background:rgba(0,0,0,0.8);
	display:block;
}

.arrow_area object{
    position: absolute;
    z-index: -1;
	width: 25%;
	left:50%;
	top:50%;
	-webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.arrow_area .prev object{
	transform:translate(-50%,-50%) rotate(180deg);
}
/*
.arrow_area .prev::before{
	content:"〈 ";
	color:#fff;
	line-height:43px;
	text-align:center;
	display:block;
	font-size:25px;
}

.arrow_area .next::before{
	content:" 〉";
	color:#fff;
	line-height:43px;
	text-align:center;
	display:block;
	font-size:25px;
}*/

.arrow_area ul li.slick-disabled object{
	opacity:0.4;
}



#main_slider .slick-dots{
	position: absolute;
	bottom:35%;
	left:50%;
	width:100%;
	max-width:1400px;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

#main_slider .slick-dots li{
	background:none;
	width:50px;
	height:50px;
	text-align:center;
	display:inline-block;
	line-height:36px;
	margin-right:10px;
	cursor:pointer;
	opacity: 0.5;
}

#main_slider .slick-dots li.slick-active{
	opacity:1;
}


#main_slider .slick-dots li:last-child{
	margin-right:0;
}


#main_slider .slick-dots .fp-arc-loader{
	transform: rotate(-90deg);
}

#main_slider .slick-dots .fp-arc-loader .path{
    display: none
}

#main_slider .slick-dots li.slick-active .fp-arc-loader .path{
    display: inline-block !important;
    stroke-dasharray: 1000;
    stroke-dashoffset: 0;
    animation: dash linear 35000ms;
    animation-iteration-count: unset;
}

@keyframes dash {
	from {
	  stroke-dashoffset: 1000;
	}

	to {
	  stroke-dashoffset: 0;
	}
  }

#main_slider .slide_cont .text_area{
    position: absolute;
    top: 50%;
    left: 50%;
	width:100%;
	max-width:1400px;
	transform:translate(-50%,-50%);
	opacity:0;
}

#main_slider .slick-current.slick-active .slide_cont .text_area{
	opacity:1;
}

#main_slider .slide_cont .text_area h2.main_title{
	overflow:hidden;
}

#main_slider .slide_cont .text_area h2.main_title strong span{
	color:#fff;
	font-size:60px;
	font-weight:400;
	letter-spacing:-4.5px;
	text-align:left;
	font-family: 'Noto Serif KR', serif;
}

#main_slider .slick-current.slick-active .slide_cont .text_area .m_t {
	display: inline-block;
	white-space: pre;
	animation: text-active-animation 1s cubic-bezier(.5, 0, .5, 1) both; 
}

#main_slider .slide_cont .text_area p.main_sub_title{
	margin:25px 0;
	overflow:hidden;
}

#main_slider .slide_cont .text_area p.main_sub_title span{
	color:#fff;
	text-align:left;
	font-size:120px;
	font-weight:900;
	letter-spacing:-.2px;
}

#main_slider .slide_cont .text_area span.y_t{
	background: linear-gradient(to right, #1e9ea1, #1e9ea1);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

#main_slider .slick-current.slick-active .slide_cont .text_area span.main_small_title{
	color:#fff;
	font-size:18px;
	letter-spacing:-.20px;
	line-height:30px;
	opacity:1;
	display:block;
	animation: text-active-animation 1s cubic-bezier(.5, 0, .5, 1) both; 
	font-weight: 300;
	font-family: 'Poppins', sans-serif;
	margin-bottom:40px;
}

#main_slider .slick-current.slick-active .slide_cont .text_area span.main_small_title b{
	font-weight:600;
}

@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		transform: translateY(100%);
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		transform: translateY(0px);
	}
}


/* 메인 비주얼 :: pause,play */
.main-visual-control {position:absolute; top:63%; margin-top:80px;transform:translateY(-50%);}
.main-visual-control .inner-box {display:flex; align-items:center; max-width:1420px; margin:auto;}
.main-visual-control .control-box {position:relative; width:70px; height:70px; }
.main-visual-control .control-box .play-btn {position:absolute; top:0; left:0; width:100%; height:100%; margin:auto; font-size: 18px;color:#fff; z-index:20;}
.main-visual-control .control-box .play-btn.pause i:before {content:"\ea3e";}
.main-visual-control .control-box .play-btn:focus {outline:none;}
.main-visual-control .circle-box {position:relative; margin:auto; width:100%; height:100%; border:5px solid #fff; border-color:rgba(255, 255, 255, 0.2); border-radius: 50%; z-index:11; box-sizing:border-box;}
.main-visual-control .circle-box svg{
	overflow: visible; 
	position:absolute;
	top:2px;
	left:-2px;
	width:60px;
	height:60px;
	fill:none; 
	stroke:#fff;
	transform: rotate(-90deg); /* 시계반대방향으로 돌아가기 / 시계방향 -> scale제거 */
}
.main-visual-control .circle-box svg circle { transform-origin: center; stroke: #fff; stroke-dasharray: 360; stroke-dashoffset: 360; stroke-width: 6px; }

/* 메인 비주얼 :: 카운터 */
.main-visual-control{position:absolute; left:0; width:100%; z-index:11; font-size:12px; color:#fff; letter-spacing:-0.5px; }
.main-visual-control .counter-box {position:relative; width:130px; line-height:37px; margin-left:42px; text-align:center; }
.main-visual-control .counter-box .count-box {display:flex; align-items:center; justify-content:center;}
.main-visual-control .counter-box .count-box span,
.main-visual-control .counter-box .count-box .middle{ vertical-align:top; font-weight:700;opacity:0.5;filter:Alpha(opacity=50);}
.main-visual-control .counter-box .count-box .middle{width:1px; height:8px; background-color:rgba(255,255,255,0.2); margin:0 10px}
.main-visual-control .counter-box .count-box .cur-num {opacity:1;filter:Alpha(opacity=100);}

/* 메인 비주얼 :: 화살표 */
.main-visual-control .slick-arrow{	position:absolute;  top:50%;transform:translateY(-50%); border:0; cursor:pointer; z-index:9; font-size:30px; color:#fff; opacity:0.5;filter:Alpha(opacity=50);}
.main-visual-control .slick-arrow.slick-prev{left:-10px;}
.main-visual-control .slick-arrow.slick-next{right:-10px;}


.section_01 .sns_area{
	position:absolute;
	left:130px;
	bottom:140px;
	display:flex;
}

.section_01 .sns_area .icon{
	margin-right:30px;
}

.section_01 .sns_area .icon a{
	color:#fff;
	font-size:23px;
}

.section_01 .sns_area .icon:nth-child(1) a:hover{
	color:#3b5998;
}

.section_01 .sns_area .icon:nth-child(2) a:hover{
	color:#0e76a8;
}

.section_01 .sns_area .icon:nth-child(3) a:hover{
	color:#c4302b;
}


.section_01 .scroll_area{
	position:absolute;
	right:60px;
	bottom:110px;
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}

.section_01 .scroll_area .text{
	color:#ffffff;
	writing-mode: vertical-rl;
	font-size:10px;
}

.section_01 .scroll_area .mouse{
	width:12px;
	height:30px;
	border:2px solid #fff;
	border-radius:5px;
	margin-top:20px;
}

.section_01 .scroll_area .mouse span::before{
	content:"";
	display:block;
	width:2px;
	height:2px;
	background:#fff;
	margin:0 auto;
	position:absolute;
	bottom:8px;
	left:6px;
	animation: bounce .5s infinite alternate;
    -webkit-animation: bounce .5s infinite alternate;
}

@keyframes bounce {
  from {
     transform: translateY(0px);
  }
  to {
     transform: translateY(-10px);
  }
}
@-webkit-keyframes bounce {
  from {
     transform: translateY(0px);
  }
  to {
     transform: translateY(-10px);
  }
}

/* 마우스 스크롤 다운 띄용 
animation: bounce .5s infinite alternate;
    -webkit-animation: bounce .5s infinite alternate;


@keyframes bounce {
  from {
     transform: translateY(0px);
  }
  to {
     transform: translateY(-7.5px);
  }
}
@-webkit-keyframes bounce {
  from {
     transform: translateY(0px);
  }
  to {
     transform: translateY(-7.5px);
  }
}
*/

/* 버튼 물방울 번짐 
.button {
  -webkit-font-smoothing: antialiased;
  background-color: #ed1c24;
  box-sizing: border-box;
  border-radius: 4px 25px 4px 4px;
  border: none;
  color: #fff;
  display: block;
  font-family: &quot;Montserrat&quot;, sans-serif;
  font-size: 14px;
  font-weight: 400;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  letter-spacing: 1px;
  color: white;
  height:52px;
	line-height:52px;
	text-align:center;
  text-transform: uppercase;
  transition: all 0.1s ease-out;
}
.button:hover {
  background-color: #ed1c24;
  color: #fff;
}
.button:active {
  transform: scale(0.95);
}
.button--bubble {
  position: relative;
  z-index: 2;
  color: white;
  background: none;
}
.button--bubble:hover {
  background: none;
}
.button--bubble:hover + .button--bubble__effect-container .circle {
  background: #ed1c24;
}
.button--bubble:hover + .button--bubble__effect-container .button {
  background: #ed1c24;
}
.button--bubble:active + .button--bubble__effect-container {
  transform: scale(0.95);
}
.button--bubble__container {
  position: relative;
  display: block;
}
.button--bubble__container .effect-button {
  position: absolute;
  width: 50%;
  height: 25%;
  top: 50%;
  left: 25%;
  z-index: 1;
  transform: translateY(-50%);
  background: #ed1c24;
  transition: background 0.1s ease-out;
}

.button--bubble__effect-container {
  position: absolute;
  display: block;
  width: 200%;
  height: 400%;
  top: -150%;
  left: -50%;
  filter: url(&quot;#goo&quot;);
  transition: all 0.1s ease-out;
  pointer-events: none;
}
.button--bubble__effect-container .circle {
  position: absolute;
  width: 25px;
  height: 25px;
  border-radius: 15px;
  background: #ed1c24;
  transition: background 0.1s ease-out;
}
.button--bubble__effect-container .circle.top-left {
  top: 40%;
  left: 27%;
}
.button--bubble__effect-container .circle.bottom-right {
  bottom: 40%;
  right: 27%;
}


.button--bubble__container {
  top: 50%;
}

@-webkit-keyframes hue-rotate {
  from {
    -moz-filter: hue-rotate(0);
    -ms-filter: hue-rotate(0);
    filter: hue-rotate(0);
  }
  to {
    -moz-filter: hue-rotate(360deg);
    -ms-filter: hue-rotate(360deg);
    filter: hue-rotate(360deg);
  }
}

@keyframes hue-rotate {
  from {
    -moz-filter: hue-rotate(0);
    -ms-filter: hue-rotate(0);
    filter: hue-rotate(0);
  }
  to {
    -moz-filter: hue-rotate(360deg);
    -ms-filter: hue-rotate(360deg);
    filter: hue-rotate(360deg);
  }
}

*/

.detail_btn{
	width:200px;
	height:60px;
	border:3px solid #ececec;
	border-radius:30px;
	background:transparent;
	color:#a6a6a6;
	font-size:15px;
	font-weight:bold;
}

.detail_btn:hover{
	transition:cubic-bezier(0.2, 0, 0, 1) .7s;
	border-color:#72b548;
	color:#72b548;
}

.detail_btn.on_type{
	border-color:#72b548;
	color:#72b548;	
}

.grid_area{
    display: grid;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    grid-template-columns: repeat(12, 1fr);
    gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
}

.section_02{
	width:100%;
	position:relative;
	padding:90px 0;
	padding-bottom:19.5rem;
	background-position:bottom+8.125rem right;
	background-image:url("../img/main/bg_html2.png");
	background-size:auto;
	background-repeat:no-repeat;
}

.section_02 .title_area{
	grid-column-start: 1;
    grid-column-end: 7;
    position: relative;
	margin-top:70px;
}

.section_02 .title_area::before{
	content:"";
	background-image:url("../img/main/bg_html1.png");
	background-size:auto;
	width:236px;
	height:236px;
	background-position:center;
	background-repeat:no-repeat;
	position:absolute;
	top:-70px;
	left:-120px;
}

.section_02 .title_area h2.title{
	color:#161c0c;
	font-size:60px;
	font-weight:bold;
	line-height:68px;
	letter-spacing:-.3px;
	text-align:left;
}

.section_02 .title_area p.sub_title{
	color:#727372;
	text-align:left;
	font-size:16px;
	font-weight:500;
	letter-spacing:-.30px;
	line-height:28px;
	padding:32px 0;
	padding-bottom:42px;
}




.section_02 .cont_box#b_1{
	grid-column-start: 8;
    grid-column-end: 13;
	position: relative;
	margin-top:70px;
}

.section_02 .cont_box#b_2{
	grid-column-start: 1;
    grid-column-end: 7;
	position: relative;
	top:-14.375rem;
}

.section_02 .cont_box#b_3{
	grid-column-start: 8;
    grid-column-end: 13;
	position: relative;
	top:8.125rem;
}



.section_02 .cont_box .img_area{
	display:block;
}

.section_02 .cont_box .img_area img{
	max-width:100%;
}

.section_02 .cont_box .text_area{
	padding-top: 50px;
}

.section_02 .cont_box .text_area h2.box_title{
	color:#161c0c;
	font-size:32px;
	font-weight:600;
	letter-spacing:-.30px;
}

.section_02 .cont_box .text_area p.box_subtitle{
	color:#8b8c8b;
	font-size:18px;
	line-height:32px;
	letter-spacing:-.30px;
	font-weight:400;
	padding-top:30px;
}

.section_03 .pr_slider_area{
	position:relative;
	width:100%;
}

.section_03 .text_wrap{

}

.section_03 .text_wrap .swiper-slide{
	opacity:0 !important;
}

.section_03 .text_wrap .swiper-slide.swiper-slide-active{
	opacity:1 !important;
}

.section_03 .pr_slider_area .swiper-container {
    overflow: visible !important;
}

@media screen and (min-width: 992px){
	.section_03 .text_wrap{
		position: absolute;
		top: 0;
		right: 8vw;
		width: 650px;
		height: 700px;
		background-color: #fff;
		z-index: 10;
	}

	.section_03 .pr_slider_area .swiper-slide .img-wrap {
		margin-bottom: 0;
		width: calc(62.5vw - 8vw);
	}

	.section_03 .text_wrap .swiper-slide{
		padding: 7.125vw 8.313vw 2.5vw;
		overflow:hidden;
	}

	.section_03 .pr_slider_area .swiper-container {
		padding-right: 8vw;
	}
}

@media screen and (min-width: 1600px){
	.section_03 .text_wrap{
		right: calc((100% - 1280px) / 2);
		width: 690px;	
	}

	.section_03 .text_wrap .swiper-slide{
		padding: 75px 100px 101px;
		overflow:hidden;
	}

	.section_03 .pr_slider_area .swiper-container {
		padding-right: calc((100% - 1200px) / 2);
	}
}

.section_03 .img-wrap img{
	max-width:100%;
}

.section_03 .arrow_pr{
	position:absolute;
	bottom:0;
	width:260px;
	height:95px;
	background:#fff;
	left: -260px;
	z-index:150;
}

.section_03 .arrow_pr .arrow_cont{
	position:absolute;
	font-size:35px;
	color:#222222;
	top:50%;
	transform:translateY(-50%);
	cursor:pointer;
	    line-height: 32px;
}

.section_03 .arrow_pr .arrow_cont.arrow_le{
	left:5%;
}

.section_03 .arrow_pr .arrow_cont.arrow_ri{
	right:5%;
}

.section_03 .arrow_pr .arrow_cont.swiper-button-disabled{
	opacity:.4;
}

.section_03 .arrow_pr .swiper-pagination-custom{
    display: flex;
    position: relative;
    bottom: auto;
    left: 50%;
    height: 100%;
    align-items: center;
    justify-content: center;
    width: 50%;
    transform: translateX(-50%);
}

.section_03 .arrow_pr .swiper-pagination-custom span{
	color:#222222;
	font-size:16px;
	font-weight:bold;
	letter-spacing:-.20px;
	margin:0 15px;
}

.section_03 .arrow_pr .swiper-pagination-custom span.total{
	color:#22222296;
}

.section_03 .tech_area{
	background:#f9f9f9;
	margin:50px 0;
	position:relative;
	margin-bottom:0;
}

.section_03 .tech_area .img_section{
	min-height:606px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.section_03 .tech_area .img_section img{
	max-width:100%;
}

.section_03 .tech_area .text_section{
	display:block;
	width:100%;
	max-width:1660px;
	border-top:1px solid #dddddd;
	min-height:245px;
	padding:60px 0;
	margin:0 auto;
}

.section_03 .tech_area .text_section h2{
	color:#222222;
	font-weight:500;
	font-size:44px;
	line-height:65px;
	letter-spacing:-.25px;
	text-align:center;
}

.section_03 .tech_area .text_section p{
	color:#444444;
	font-size:18px;
	line-height:28px;
	letter-spacing:-.25px;
	text-align:center;
	margin-top:15px;
}

.section_03 #tech_slider .swiper-slide {
    opacity: 0 !important;
}

.section_03 #tech_slider .swiper-slide.swiper-slide-active{
    opacity: 1 !important;
}

.section_03 #tech_slider .arrow_tech{
	position:absolute;
	bottom:18%;
	max-width:1060px;
	width:100%;
	left:50%;
	transform:translateX(-50%);
    z-index: 200;
}

.section_03 #tech_slider .arrow_tech .arrow_cont{
	width:75px;
	height:75px;
	border:1px solid #dddddd;
	border-radius:100%;
	text-align:center;
	display:flex;
	font-size:35px;
	color:#222;
	position:absolute;
	align-items: center;
    justify-content: center;
	cursor:pointer;
}

.section_03 #tech_slider .arrow_tech .arrow_cont.arrow_le{
	left:0;
}

.section_03 #tech_slider .arrow_tech .arrow_cont.arrow_ri{
	right:0;
}


.section_03 #tech_slider .arrow_tech .arrow_cont.swiper-button-disabled{
	opacity:.4;
}


.section_03 .text_wrap .inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.section_03 .text_wrap .swiper-info-items.item {
    display: none;
    opacity: 0;
}

.section_03 .text_wrap .swiper-info-items.item.active {
    display: block;
    animation: fadeIn-animation .5s forwards;
}


.section_03 .text_wrap .swiper-slide h3.count{
	color:#34A1A2;
	font-size:48px;
	font-weight:500;
	line-height:64px;
	letter-spacing:-.25px;
}

.section_03 .text_wrap .swiper-slide h2.title{
	color:#222222;
	font-size:35px;
	font-weight:500;
	letter-spacing:-.25px;
	line-height:64px;
	margin-top:10px;
}

.section_03 .text_wrap .swiper-slide p{
	color:#777777;
	font-size:16px;
	line-height:28px;
	letter-spacing:-.25px;
	font-weight:500;
	padding:65px 0;
	word-break:keep-all;
}

.button_view{
	border:1px solid #111111;
	width:200px;
	height:65px;
	font-size:16px;
	font-weight:500;
	color:#333333;
	transition:.35s all;
}


.button_view:hover{
	background:#444;
	border:1px solid #444;
	color:#fff;
}

.section_03{
	width:100%;
	background:#fff;
	position:relative;
	padding:90px 0;
	background-size:auto;
	background-repeat:no-repeat;
}

.section_03 .title_area{
	grid-column-start: 1;
    grid-column-end: 13;
    position: relative;
	margin-top:70px;
	text-align:center;
}


.section_03 .title_area h2.title{
	color:#34A1A2;
	font-size:20px;
	font-weight:bold;
	letter-spacing:-.3px;
	text-align:center;
	position:relative;
	display:inline-block;
	margin:0 auto;
}


.section_03 .title_area p.sub_title{
	color:#222222;
	text-align:center;
	font-size:40px;
	font-weight:400;
	letter-spacing:-.30px;
	line-height:62px;
	padding:32px 0;
	padding-bottom:42px;
	font-family: 'Noto Serif KR', serif;
	word-break:keep-all;
}

.section_03 .tab_area ul{
	max-width:900px;
	display:flex;
    flex-wrap: wrap;
    justify-content: center;
	margin:0 auto;
	margin-bottom:80px;
}

.section_03 .tab_area li a{
	color:#b2b2b2;
	font-size:18px;
	font-weight:500;
	line-height:35px;
	letter-spacing:-.25px;
	display:block;
	margin:0 30px;
	transition:.35s all;
	word-break:keep-all;
}

.section_03 .tab_area li a.on{
	color:#34A1A2;
	border-bottom:1px solid #34A1A2;
}

.section_03 .tab_area li a:hover{
	color:#34A1A2;
}

.section_03 .tab_area li{
    display: flex;
    align-items: center;
    justify-content: center;
	margin-bottom:5px;
}

.section_03 .tab_area li::after{
	content:"";
	width:1px;
	height:20px;
	background:#dddddd;
	display:inline-block;
}

.section_03 .tab_area li:first-child{
	padding-left:0;
}

.section_03 .tab_area li:last-child::after{
	display:none;
}


.section_03 .cont_box .img_area,
.section_03 .cont_box .img_area a{
	display:block;
}

.section_03 .cont_box .img_area img{
	max-width:100%;
}

.section_03 .cont_box .text_area{

}

.section_03 .cont_box .text_area h2.box_title{
	color:#161c0c;
	font-size:52px;
	font-weight:bold;
	letter-spacing:-.30px;
	text-align:left;
}

.section_03 .cont_box .text_area h3.product{
	color:#34A1A2;
	font-size:22px;
	font-weight:bold;
	line-height:32px;
	letter-spacing:-.30px;
	text-align:left;
	padding-top:30px;
}

.section_03 .cont_box .text_area p.box_subtitle{
	color:#727372;
	font-size:16px;
	line-height:28px;
	letter-spacing:-.30px;
	font-weight:500;
	padding-top:30px;
	padding-bottom:45px;
}


.section_03 .cont_box#c_1{
	grid-column-start: 1;
    grid-column-end: 7;
	position: relative;
}

.section_03 .cont_box#c_2{
	grid-column-start: 8;
    grid-column-end: 13;
	position: relative;
}


.section_03 .cont_box#c_3{
	grid-column-start: 1;
    grid-column-end: 7;
	position: relative;
	margin-top:110px;
}

.section_03 .cont_box#c_4{
	grid-column-start: 7;
    grid-column-end: 13;
	position: relative;
	margin-top:110px;
}

.section_03 .cont_box#c_5{
	grid-column-start: 1;
    grid-column-end: 7;
	position: relative;
	margin-top:110px;
}

.section_03 .cont_box#c_6{
	grid-column-start: 8;
    grid-column-end: 13;
	position: relative;
	margin-top:110px;
}





.section_04{
	background:#fff;
	padding-top:90px;
	position:relative;
}

.section_04::after{
	/*content:"";
	width:100%;
	height:45%;
	background:#fff;
	position:absolute;
	left:0;
	bottom:0;*/
}



.section_04 .slide_area{
	position:relative;
}

.section_04 .top_cont{
	position:relative;
	padding-bottom:15px;
	margin-bottom:45px;
}

.section_04 #cont_area{
	position:relative;
}

.section_04 .top_cont h2.title{
	color:#161c0c;
	font-size:60px;
	font-weight:bold;
	line-height:68px;
	letter-spacing:-.30px;
}

.section_04 .swiper-controls {
    display: flex;
    position: absolute;
    right: 0;
	bottom:0;
    z-index: 150;
}



.section_04 .swiper-button-next,
.section_04 .swiper-button-prev{
	background:transparent;
	border:3px solid #34A1A2;
	border-radius:100%;
	width:50px;
	height:50px;
	position:relative;
	top:auto;
	left:auto;
	right:auto;
	bottom:auto;
}

.section_04 .swiper-button-next i,
.section_04 .swiper-button-prev i{
	color:#34A1A2;
}

.section_04 .swiper-button-next{
	margin-left:10px;
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{
	border:3px solid #e5e5e5;
	opacity:1 !important;
}

.swiper-button-next.swiper-button-disabled i, .swiper-button-prev.swiper-button-disabled i{
	color:#e5e5e5;
}


.section_04 .swiper-button-next:after,
.section_04 .swiper-button-prev:after{
	display:none;
}


.pr_slider_area{
	display:none;
}

.pr_slider_area.view{
	display:block;
}

#pr_slider .img_cont{
	max-width:394px;
	border-radius:10px;
	overflow:hidden;
	position:relative;
}

#pr_slider .img_cont img{
	max-width:100%;
}

#pr_slider .img_cont .video_latest{
	width:100%;
	height:100%;
	position:absolute;
    display: flex;
    justify-content: center;
    align-items: center;
}

#pr_slider .text_area{
	padding-top:40px;
}

#pr_slider .text_area h2.subject{
	color:#161c0c;
	font-size:20px;
	font-weight:600;
	letter-spacing:-.30px;
	word-break:keep-all;
	line-height:28px;
	margin-bottom:15px;
}

#pr_slider .text_area span.datetime{
	font-size:16px;
	font-weight:500;
	color:#bbbbbb;
	letter-spacing:-.30px;
	line-height:28px;
}






.section_05{
	position:relative;
	width:100%;
	background:#f9f9f9;
	padding:10rem 0;
}

.section_05 .banner_area{

}

.section_05 .banner_area .banner_box{
	border-radius:10px;
	overflow:hidden;
	height:150px;
	position:relative;
}

.section_05 .banner_area .banner_box a{
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 100%;
}

.section_05 .banner_area .banner_box .text_box h2{
	color:#ffffff;
	font-size:24px;
	font-weight:bold;
	letter-spacing:-.30px;
	line-height:28px;
	margin-bottom:10px;
}

.section_05 .banner_area .banner_box .text_box span{
	color:#ffffff;
	font-size:16px;
	font-weight:400;
	letter-spacing:-.30px;
	line-height:28px;
}

.section_05 .banner_area .banner_box .btn_sm{
	width:150px;
	height:40px;
	border-radius:20px;
	background:#222222;
	color:#fff;
	font-size:15px;
	font-weight:bold;
	letter-spacing:-.30px;
	border:0;
}


.section_05 .banner_box#contact_box{
	background-color:#67ca2cbd;
	background-image:url("../img/main/bg_html4.png");
	background-position:center+70%;
	background-repeat:no-repeat;
	grid-column-start: 1;
    grid-column-end: 7;
    position: relative;
    background-blend-mode: soft-light;
}

.section_05 .banner_box#certi_box{
	background-color:#39c263bd;
	background-image:url("../img/main/bg_html5.png");
	background-position:center center;
	background-repeat:no-repeat;
	grid-column-start: 7;
    grid-column-end: 13;
    position: relative;
    background-blend-mode: soft-light;
}




#footer{
	background:#232a33;
	padding:90px 110px;
	padding-bottom:0;
}

#footer .foot_menu{
	grid-column-start: 2;
    grid-column-end: 11;
}

#footer .foot_info{
	grid-column-start: 2;
	grid-column-end: 12;
	border-top:1px solid #e5e5e5;
	padding:45px 0;
	margin-top:60px;
	display:flex;
	    align-items: center;
		flex-wrap:wrap;
}

#footer .foot_menu ul{
	display:flex;
}
#footer .foot_menu ul.foot_area2{
	flex-direction: column;
	margin-top:28px;
}

#footer .foot_menu ul li.foot_area{
	min-width:260px;
}

#footer .foot_menu ul li.foot_area a.foot_a{
	color:#ffffff;
	font-size:21px;
	font-weight:400;
	line-height:32px;
	letter-spacing:-.20px;
}

#footer .foot_menu ul.foot_area2 .foot_menu_li{
	padding-bottom:10px;
}

#footer .foot_menu ul.foot_area2 .foot_menu_li .foot_li{
	color:#ffffff85;
	font-size:14px;
	letter-spacing:-.20px;
	line-height:26px;
	font-weight:400;
}



#footer .saup_info{
	flex:1;
}

#footer .saupjang{

}

#footer .saupjang span{
	color:#fff;
	font-size:16px;
	letter-spacing:-.20px;
	font-weight:400;
	line-height:32px;
	margin-right:25px;
	word-break:keep-all;
}

#footer .saupjang span b{
	color:#7a8899;
	font-size:16px;
	font-weight:400;
	margin-right:15px;
}

#footer .foot_info .copylight{
	color:#5c6673;
	font-size:14px;
	font-weight:400;
	letter-spacing:-.20px;
	word-break:keep-all;
	text-align:right;
}

#footer .foot_info .foot_copy{
	width:100%;
	max-width:25%;
}

#footer .foot_info .foot_logo{
	text-align:left;
	max-width:18%;
	width:100%;
}

#footer .foot_info .foot_logo img{
	max-width:100%;
}


.section_grid_area{
	position:relative;
	padding:32rem 0;
	padding-top:10rem;
	background-color:#fff;
	background-image:url("../img/main/point_back.png");
	background-size: auto;
	background-position:bottom center;
	background-repeat:no-repeat;
}

.section_grid_area .about_title{
	padding-left:70px;
	padding-top:30px;
}

.section_grid_area .about_title .title_area h2.title{
    color: #34A1A2;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: -.3px;
    text-align: center;
    position: relative;
    display: inline-block;
    margin: 0 auto;
}

.section_grid_area .grid_area{
    align-items: start;
}

.section_grid_area .about_title{
	grid-column-start:1;
	grid-column-end:4;
}

.section_grid_area .point_1{
	grid-column-start:5;
	grid-column-end:9;
}

.section_grid_area .point_2{
	grid-column-start:9;
	grid-column-end:13;
	padding-top:150px;
}

.section_grid_area .about_title .title_area p.sub_title{
    color: #222222;
    text-align: left;
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -.30px;
    line-height: 52px;
    padding: 32px 0;
    padding-bottom: 42px;
    font-family: 'Noto Serif KR', serif;
}

.section_grid_area .about_title .title_area p.sub_title_sub{
	color:#999999;
	font-size:18px;
	letter-spacing:-.25px;
	line-height:32px;
	font-weight:500;
}

.section_grid_area .about_section{
	position:relative;
}

.section_grid_area .about_section .img_point{
	max-width:100%;
}

.section_grid_area .about_section .img_point img{
	max-width:100%;
}

.section_grid_area .about_section .text_point{
	width:100%;
	max-width:400px;
	position:absolute;
	bottom:-60px;
	background:#fff;
	padding:20px 0;
}

.section_grid_area .about_section .text_point span{
	color:#34A1A2;
	font-size:18px;
	font-weight:bold;
	line-height:64px;
	letter-spacing:-.25px;
}

.section_grid_area .about_section .text_point h2{
	color:#222222;
	font-size:24px;
	letter-spacing:-.25px;
	line-height:32px;
	text-align:left;
	margin-top:10px;
	font-weight:400;
}




.section_about{
	width:100%;
	position:relative;
    height: 100vh;
    max-height: 950px;
}

.section_about .grid_area{
	grid-template-columns: repeat(2, 1fr);
	gap:0;
	position:relative;
	width:100%;
	height:100%;
}

.section_about .left_section{
	position:relative;
	overflow:hidden;
}

.section_about .left_section .tab_cont_area{
	position:absolute;
	top:0;
	left:130px;
	width:100%;
	height:100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.section_about .left_section .tab_cont_area h2{
	color:#ffffff;
	font-size:44px;
	font-weight:bold;
	letter-spacing:-.25px;
	margin-bottom:25px;
}

.section_about .left_section .tab_cont_area ul li{
	display:block;
	line-height:36px;
	color:#ffffff;
	font-size:18px;
	font-weight:bold;
	position:relative;
	cursor: pointer;
	margin-bottom:20px;
}

.section_about .left_section .tab_cont_area ul li span{
	display:inline-block;
	position:relative;
    -webkit-transition: padding .3s;
    transition: padding .3s;
}


.section_about .left_section .tab_cont_area ul li.now_on span{
	padding-left:30px;
}

.section_about .left_section .tab_cont_area ul li span:before {
    content: '';
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -1px;
    background: #fff;
    opacity: 0;
    -webkit-transform-origin: 100% 50%;
    -ms-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transform: scale3d(0, 1, 1);
    transform: scale3d(0, 1, 1);
    -webkit-transition: opacity .2s, -webkit-transform .3s;
    transition: opacity .2s, -webkit-transform .3s;
    transition: transform .3s, opacity .2s;
    transition: transform .3s, opacity .2s, -webkit-transform .3s;
    -webkit-transition-delay: .2s, 0s;
    transition-delay: .2s, 0s;
}

.section_about .left_section .tab_cont_area ul li:hover > span:before {
    -webkit-transform-origin: 0% 50%;
    -ms-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
    opacity: 1;
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}

.section_about .left_section .tab_cont_area ul li span:after {
    display: block;
    width: 12px;
    position: absolute;
    top: 50%;
    left: 0;
    font-family: 'xeicon';
    content: "\e93f";
    font-size: 22px;
    font-weight: normal;
    text-align: center;
    color: #fff;
    opacity: 0;
	transform: translateY(-50%);
    -webkit-transition: opacity .3s, left .2s;
    transition: opacity .3s, left .2s;
}

.section_about .left_section .tab_cont_area ul li.now_on span:after{
	opacity:1;
}

.section_about .left_section .bg_area{
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
}

.section_about .left_section .bg_area .bg_section{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	-webkit-transform: scale(1.03) rotate( 0.01deg);
    -ms-transform: scale(1.03) rotate( 0.01deg);
    transform: scale(1.03) rotate( 0.01deg);
    -webkit-transition: -webkit-transform 2s, opacity .3s linear;
    transition: -webkit-transform 2s, opacity .3s linear;
    transition: transform 2s, opacity .3s linear;
    transition: transform 2s, opacity .3s linear, -webkit-transform 2s, opacity .3s linear;
	opacity:0;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

.section_about .left_section .bg_area .bg_section#bg_section1{
	background-image:url("../img/main/about_back1.jpg");
}
.section_about .left_section .bg_area .bg_section#bg_section2{
	background-image:url("../img/main/about_back2.jpg");
}
.section_about .left_section .bg_area .bg_section#bg_section3{
	background-image:url("../img/main/about_back3.jpg");
}
.section_about .left_section .bg_area .bg_section#bg_section4{
	background-image:url("../img/main/about_back4.jpg");
}

.section_about .left_section .bg_area .bg_section.bg_on{
	opacity:1;
	-webkit-transform: scale(1) rotate(0deg);
    -ms-transform: scale(1) rotate(0deg);
    transform: scale(1) rotate(0deg);
}

.section_about .left_section .bg_area img{
	max-width:100%;
	max-height:100%;
}

.section_about .right_section{
	position:relative;
}

.section_about .right_section .bg_section_cont{
	display:none;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	background:#eeeeee;
}

.section_about .right_section .bg_section_cont.cont_on{
   display:block;
  -webkit-animation: fadeins 2s;
    animation: fadeins 2s;
}

.section_about .right_section .bg_section_cont .bg_content{
	width:100%;
	height:100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    align-content: center;
}

.section_about .right_section .bg_section_cont .bg_content .cont_title{
	color:#222222;
	font-weight:500;
	font-size:32px;
	line-height:40px;
	letter-spacing:-.25px;
	margin:30px auto;
	font-family: 'Noto Serif KR', serif;
	text-align:center;
}

.section_about .right_section .bg_section_cont .bg_content .cont_desc{
	text-align:center;
	color:#444444;
	font-size:18px;
	font-weight:400;
	line-height:28px;
	letter-spacing:-.25px;
}

.section_about .right_section .bg_section_cont .bg_content .button_view{
	margin-top:70px;
}


@keyframes fadeins {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes fadeins {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}