@charset "utf-8";

/* 
 * main CSS Document
 * KOWEB
 */

/* header */
body.fp-viewing-2Page #header nav .gnb > li > a,
body.fp-viewing-3Page #header nav .gnb > li > a,
body.fp-viewing-4Page #header nav .gnb > li > a,
body.fp-viewing-5Page #header nav .gnb > li > a{padding: 26.5rem 0 ; }
body.fp-viewing-2Page #header nav .gnb > li > a,
body.fp-viewing-4Page #header nav .gnb > li > a,
body.fp-viewing-5Page #header nav .gnb > li > a,
body.fp-viewing-7Page #header nav .gnb > li > a{color: #222;}
body.fp-viewing-2Page #header .h_menu,
body.fp-viewing-3Page #header .h_menu,
body.fp-viewing-4Page #header .h_menu,
body.fp-viewing-5Page #header .h_menu{border-bottom: 1rem solid rgba(153,153,153,0.14);}
body.fp-viewing-6Page #header,
body.fp-viewing-7Page #header{border-bottom: 1rem solid rgba(153,153,153,.16);}
body.fp-viewing-2Page #header .inq_btn,
body.fp-viewing-4Page #header .inq_btn,
body.fp-viewing-5Page #header .inq_btn,
body.fp-viewing-6Page #header .inq_btn,
body.fp-viewing-7Page #header .inq_btn{background-color: #222;}
body.fp-viewing-3Page #header .inq_btn{background: #3f4c5b;}
body.fp-viewing-3Page #header .mn_btn .burger i,
body.fp-viewing-3Page #header .mn_btn .burger::before,
body.fp-viewing-3Page #header .mn_btn .burger::after,
body.fp-viewing-5Page #header .mn_btn .burger i,
body.fp-viewing-5Page #header .mn_btn .burger::before,
body.fp-viewing-5Page #header .mn_btn .burger::after{background-color: #222;}
body.fp-viewing-3Page #header .mn_btn em,
body.fp-viewing-5Page #header .mn_btn em{color: #222;}
body.fp-viewing-6Page #header nav .gnb > li:nth-child(n+3):nth-child(-n+6) > a {color: #222;}

body.fp-viewing-2Page #header,
body.fp-viewing-4Page #header,
body.fp-viewing-5Page #header {border-bottom: 1rem solid #e8e8e8;}

body.fp-viewing-8Page #header {opacity: 0;}

#fp-nav{top: 50%; transform: translateY(-50%); z-index: 90;}
#fp-nav ul li a + div + span{position: relative; padding-left: 22rem; width: 100%; display: block; font-weight: 400; font-size: 0; white-space: nowrap;}
#fp-nav ul li a + div + span::before{content: ""; position: absolute; width: 8rem; height: 8rem; border-radius: 20rem; background-color: #fff; opacity: 0.34; left:0; top: 5rem;}
#fp-nav ul li a.active + div + span{font-size: 12rem;  left: 0;}
#fp-nav ul li a.active + div + span::before{opacity: 1; background-color: #edcf13;}
#fp-nav ul li:nth-child(1) a.active + div + span{font-size: 0;}
#fp-nav ul li:nth-child(1) a + div + span::before{opacity: 1; left: -3rem; width: 14rem; height: 14rem; background:url("../images/main/icon_home_w.svg") no-repeat}
#fp-nav ul li:nth-child(1) a.active + div + span::before{background:url("../images/main/icon_home_y.svg") no-repeat}
#fp-nav.fp-left{left: 60rem;}
.name_navi{width: 100%;}
.fp-viewing-1Page .name_navi, 
.fp-viewing-2Page .name_navi, 
.fp-viewing-3Page .name_navi, 
.fp-viewing-4Page .name_navi, 
.fp-viewing-5Page .name_navi,
.fp-viewing-6Page .name_navi,
.fp-viewing-7Page .name_navi{opacity: 1;}
.fp-viewing-2Page .name_navi,
.fp-viewing-4Page .name_navi,
.fp-viewing-5Page .name_navi,
.fp-viewing-7Page .name_navi{color: #111;}
.fp-viewing-2Page #fp-nav ul li a:not(.active) + div + span::before,
.fp-viewing-3Page #fp-nav ul li a:not(.active) + div + span::before,
.fp-viewing-4Page #fp-nav ul li a:not(.active) + div + span::before,
.fp-viewing-5Page #fp-nav ul li a:not(.active) + div + span::before,
.fp-viewing-6Page #fp-nav ul li a:not(.active) + div + span::before,
.fp-viewing-7Page #fp-nav ul li a:not(.active) + div + span::before{background-color: #a6a6a6; opacity: 0.34;}
.fp-viewing-2Page #fp-nav ul li:nth-child(1) a + div + span::before, 
.fp-viewing-4Page #fp-nav ul li:nth-child(1) a + div + span::before,
.fp-viewing-5Page #fp-nav ul li:nth-child(1) a + div + span::before,
.fp-viewing-7Page #fp-nav ul li:nth-child(1) a + div + span::before{background: url("../images/main/icon_home.svg") no-repeat; opacity: 1;}
.fp-viewing-3Page #fp-nav ul li:nth-child(1) a + div + span::before,
.fp-viewing-6Page #fp-nav ul li:nth-child(1) a + div + span::before{background: url("../images/main/icon_home_w.svg") no-repeat; opacity: 1;}

#header .wt-logo,
#header .cr-logo {display: none;}
body.fp-viewing-1Page #header .wt-logo {display: block;}
body.fp-viewing-2Page #header .cr-logo {display: block;}
body.fp-viewing-3Page #header .wt-logo {display: block;}
body.fp-viewing-4Page #header .cr-logo {display: block;}
body.fp-viewing-5Page #header .cr-logo {display: block;}
body.fp-viewing-6Page #header .wt-logo {display: block;}
body.fp-viewing-7Page #header .cr-logo {display: block;}

#fp-nav ul li a, .fp-slidesNav ul li a {position: absolute;}

/* 비주얼 */
.area_visual{position:relative; overflow: hidden; border-radius: 0 0 190rem 0;}
.area_visual .main-visual {display: block; transition:all 10s linear; height: 100vh;}
.area_visual .main-visual img {width: 110vw; height: 100%; object-fit: cover;}
.area_visual .swiper-slide-active .main-visual {transform: translateX(-80px); transition:all 10s linear;}
.area_visual .list li{position:relative; height:-webkit-calc(100vh - -0px * 1);height:calc(100vh - -0px * 1);width: 100%;}
.area_visual .list li{background-repeat:no-repeat; background-position:50% 50%; background-size:cover;}
.area_visual .list li.swiper-slide-active .line i{width: 100%;}
.area_visual .list .inner{position: absolute; left: 0; bottom: 214rem;}
.area_visual .list .title *{color: #fff;}
.area_visual .list .title h2{margin-top: 26rem; font-size: 65rem; line-height: 1.2; text-transform: uppercase; font-family: 'Pretendard';}
.area_visual .list .title p{font-size: 24rem; font-weight: 300;}
.area_visual .list .title p b{font-weight: 600;}
.scroll-down {position: absolute; bottom: 60rem; left: 50%; transform: translateX(-50%); z-index: 9;}
.scroll-down i {display: block; position: relative; top: -26rem; color: #fff; font-size: 16rem; font-weight: 400;}
.scroll-down span {position: absolute; top: 0; left: 50%; width: 10px; height: 10px; margin-left: -5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation: sdb07 2s infinite; animation: sdb07 2s infinite; opacity: 0; box-sizing: border-box;}
.scroll-down span:nth-of-type(1) {-webkit-animation-delay: 0s; animation-delay: 0s;}
.scroll-down span:nth-of-type(2) {top: 8px; -webkit-animation-delay: .15s; animation-delay: .15s;}
@keyframes visualAni {
   0% {
       transform: translateX(0);
   }
   100% {
       transform: translateX (-80px);
   }
}
@-webkit-keyframes sdb07 {
   0% {
     opacity: 0;
   }
   50% {
     opacity: 1;
   }
   100% {
     opacity: 0;
   }
 }
 @keyframes sdb07 {
   0% {
     opacity: 0;
   }
   50% {
     opacity: 1;
   }
   100% {
     opacity: 0;
   }
 }
    
.wrap_controller{display: flex; align-items: center; margin-top: 118rem;}
.wrap_controller .line{width: 234rem; height: 1px; background-color: rgba(255,255,255,0.18); position: relative;}
.wrap_controller .line i{position: absolute; left: 0; width: 0; height: 1px; top: 0; display: block; transition: width 5s ease-in-out; z-index: 1; background-color: #fff;}
.wrap_controller .custom-fraction{margin-left: 30rem; margin-right: 17rem;}
.wrap_controller .custom-fraction *{font-size: 16rem; color: #fff; font-weight: 600; display: inline-block; vertical-align: middle;}
.wrap_controller .custom-fraction i{width: 1px; height: 11rem; background-color: #fff; transform: rotate(30deg); margin: 0 5rem;}
.wrap_controller .p_btn{width: 40rem; height: 40rem; border-radius: 100%; box-sizing:  border-box; border:1px solid #fff; display: flex; align-items: center; justify-content: center;}
.wrap_controller .p_btn svg{width: 7rem; fill: #fff;}
.wrap_controller .p_btn.on .play{display: none;}
.wrap_controller .p_btn.on .pause{display: block;}
.wrap_controller .p_btn .pause{display: none;}
.p_btn svg{width: 20rem;}

/* 메인 공통 */
.section-inr {position: relative; height: 100%; max-width: 1400rem; width: calc(100% - 140rem); margin: 0 auto;}
.section h3{font-family:'Pretendard', Sans-serif; font-size: 49rem; font-weight: 300; line-height: 1.349;}
.section h3 b{font-weight: 700;}
.section h3 + p{font-size: 20rem; font-weight: 300; line-height: 1.61; margin-top:17rem;}

/* 버튼 공통 */
.viewAll{display: flex; align-items: center; }
.viewAll span{font-size: 14rem; color: #999;}
.viewAll i{width: 5rem; height: 5rem; position: relative; top: -1rem; margin-left: 8rem; transform: rotate(-45deg); border-right: 1px solid #999; border-bottom: 1px solid #999;}

/* section01 */
.bg-section01 {background: url('../images/main/bg-section01.jpg') no-repeat center/cover; width: 100%; height: 100vh;}
.ceo-info__img {position: absolute; bottom: 0; left: 39.5%;}
.ceo-info__cont {position: absolute; top: 24%; right: 0; width: 390rem;}
.ceo-info__cont strong {font-size: 45rem;}
.ceo-info__cont strong em {letter-spacing: 4rem;}
.ceo-info__cont strong span {padding: 0 0 0 15rem; font-size: 20rem; font-weight: 600;}
.ceo-info__cont dl {padding-top: 42rem; margin-top: 30rem; border-top: 1rem solid #c7b79d;}
.ceo-info__cont dl dt {font-size: 20rem; font-weight: 700;}
.ceo-info__cont dl dd {padding-top: 7rem; font-size: 16rem;}
.ceo-info__cont dl dd:nth-of-type(1) {padding-top: 10rem;}
.ceo-info__cont dl div:nth-child(2) {margin-top: 48rem;}
.sec01-tit__counter {position: absolute; left: 0; top: 25%;}
.sec01-tit__counter p {font-size: 20rem; font-weight: 600;}

.counter-num {margin-top: 29rem; font-family: 'Pretendard';}
.counter-num span {font-size: 88rem; color: #fff;}

.odometer-inside {position: relative; display: flex; gap: 4rem; align-items: baseline; line-height: 1;}
.odometer-inside::before {content: '+'; position: absolute; top: 50%; right: 120rem; transform: translateY(-50%); color: #112237; font-size: 80rem; font-weight: 700;}
.odometer-digit {width: 83rem; height: 95rem;}
.odometer-digit::before {content: ''; position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; border-radius: 5rem; background: #112237; transform: translate(-50%, -50%);}
.odometer-formatting-mark {display: inline-block; width: 32rem; text-align: center; color: #112237 !important;}

  .odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-default .odometer-digit {
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    *zoom: 1;
    *display: inline;
    position: relative;
  }
  .odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner {
    display: block;
    position: absolute;
    top: 4rem;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
  }
  .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon {
    display: block;
  }
  .odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner {
    display: block;
    -webkit-backface-visibility: hidden;
  }
  .odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-default .odometer-digit .odometer-value {
    display: block;
    -webkit-transform: translateZ(0);
    text-align: center;
  }
  .odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner {
    -webkit-transition: -webkit-transform 2s;
    -moz-transition: -moz-transform 2s;
    -ms-transition: -ms-transform 2s;
    -o-transition: -o-transform 2s;
    transition: transform 2s;
  }
  .odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  .odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  .odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
    -webkit-transition: -webkit-transform 2s;
    -moz-transition: -moz-transform 2s;
    -ms-transition: -ms-transform 2s;
    -o-transition: -o-transform 2s;
    transition: transform 2s;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }

.counter-txt {padding-top: 170rem;}
.counter-txt strong {font-size: 55rem; font-weight: 500; line-height: 1.3; white-space: nowrap;}
.counter-txt strong span {font-weight: 700;}
.counter-txt p {padding-top: 25rem; font-size: 20rem; font-weight: 300;}

/* section03 */
#section03 {background: #f7f7f7;}
#section03 .case .image{overflow:hidden; aspect-ratio:1/1;}
#section03 .case .image img {object-fit:cover; width: 100%; height:100%;}
#section03 .area_story {overflow: hidden;}
#section03 .case-info {margin-top: 30rem;}
#section03 .case-info span {display: flex; align-items: center; justify-content: center; width: 85rem; height: 30rem; border-radius: 100rem; border: 2rem solid #d7b461; font-size: 14rem; font-weight: 600; color: #ab8222;}
#section03 .case-info em {display: block; padding-top: 15rem; font-size: 18rem; font-weight: 500; color: #222; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#section03 .case-info p {padding-top: 5rem; font-size: 16rem; font-weight: 300; color: #222; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}

.title-wrap {display: flex; align-items: center; justify-content: space-between; margin-bottom: 23rem;}
.arrow-control {display: flex; gap: 7rem;}
.arrow-control .swiper-button-prev {opacity: .3;}
.arrow-control .swiper-button-next, 
.arrow-control .swiper-button-prev {position: unset; width: 70rem; height: 70rem; margin-top: 0; border: 1rem solid #222; box-sizing: border-box; border-radius: 100%;}
.arrow-control .swiper-button-next:after, 
.arrow-control .swiper-button-prev:after {font-size: 0; background: url('../images/main/ic-arrow.svg') no-repeat; width: 10rem; height: 15rem;}
.arrow-control .swiper-button-prev:after {transform: rotate(-180deg);}

/* section05 */
.area_online > [class^="part_"]{display: flex; align-items: center; }
.area_online .part_info{/* width: 45%; */ width: 882rem; height: 100vh;  box-sizing: border-box; padding-left: 260rem; background:url("../images/main/img_main02_bg.jpg") no-repeat; background-size: cover;  }
.area_online .part_info > *{position: relative; width: 520rem; z-index: 1; color: #fff;}
.area_online .part_info .call{font-size: 38rem; color: #e2c71b; font-weight: 700;}
.area_online .part_info .call i{font-size: 28rem; margin-right: 8rem;}
.area_online .part_info .address{/* display: flex; */ margin-top: 6rem; letter-spacing: -.7rem;}
.area_online .part_info .address li i{opacity: 0.43; margin-right:5rem; width: 20rem; text-align: center;}
.area_online .part_info .info{margin-top: 96rem;}
.area_online .part_form{width: calc(100% - 882rem); height: 100vh; display: flex; align-items: center; justify-content: center;}
.area_online .part_form h4{font-size: 24rem; font-weight: 800; margin-bottom: 8rem;}
.area_online .part_form p {font-size: 16rem; font-weight: 500; color: #666; margin-bottom: 20rem;}
.area_online .part_form form{width: 100%; padding-left: 138rem; padding-right: 310rem;}
.area_online .part_form ul li{display:flex; justify-content: space-between; margin-bottom: 10rem;}
.area_online .part_form ul li:last-child{margin-bottom: 0;}
.area_online .part_form ul li > div.w100{width: 100%;}
.area_online .part_form ul li textarea{width: 100%; height: 140rem; resize: none; background-color: #f8f8f8; border:none; padding: 20rem;}
.area_online .part_form ul li textarea::placeholder{font-size: 14rem; color: #acacac; opacity: 0.62;}
.area_online input[type="text"]{border:none; width: 100%; height: 56rem; background-color: #f8f8f8; padding: 20px; box-sizing: border-box;}
.area_online input[type="password"]{border:none; width: 100%; height: 56rem; background-color: #f8f8f8; padding: 20px; box-sizing: border-box;}
.area_online input[type="text"]::placeholder{font-size: 14rem; color: #acacac; opacity: 0.62;}
.area_online input[type="password"]::placeholder{font-size: 14rem; color: #acacac; opacity: 0.62;}
.area_online .area_button{justify-content: right; margin-top: 26rem;}

.counsel_list {margin-top: 48rem;}
.counsel_list ul li {display: flex; justify-content: space-between; align-items: center; padding: 28rem 40rem; background: rgba(0,0,0,.2); box-sizing: border-box;}
.counsel_list ul li span {flex: none; display: flex; align-items: center; justify-content: center; width: 71rem; height: 25rem; border-radius: 50rem; color: #fff; font-size: 14rem; font-weight: 300;}
.counsel_list ul li span.ongoing {background: #c99d36;}
.counsel_list ul li span.finish {background: #222222;}
.counsel_list ul li p {opacity: .7;}
.counsel_list::-webkit-scrollbar-thumb{background-color:rgba(255,255,255,0.6);}
.counsel_list .counsel-slide{overflow:hidden; position:relative; max-height:339rem;}
.counsel_list .counsel-slide .swiper-scrollbar{left:auto; right:0;}

.spam_code {display: flex; align-items: center; justify-content: center; width: 99rem; height: 60rem; background: #fff; border: 1rem solid #222; box-sizing: border-box; font-family: "Pretendard"; font-size: 16rem; font-weight: 600;}
.spam_code_txt input[type="text"] {height: 60rem !important; margin: 0;}
.spam_code_txt {width: calc(100% - 113rem);}

.area_agree {margin-top: 60rem;}

/* 문의 현황 */
#section04{overflow: hidden; background-color: #fff; position: relative;}
#section04 #canvas{position: absolute; display: block; top: 0; left: 0; }
#particles-js{ position:absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #ffffff; background-image: url(""); background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; } 
.count-particles{ background: #ffffff; position: absolute; top: 48px; left: 0; width: 80px; color: #aaaaaa; font-size: .8em; text-align: left; text-indent: 4px; line-height: 14px; padding-bottom: 2px; font-family: Helvetica, Arial, sans-serif; font-weight: bold; }
.js-count-particles{ font-size: 1.1em; } 
#stats, .count-particles{ -webkit-user-select: none; margin-top: 5px; margin-left: 5px; } 
#stats{ border-radius: 3px 3px 0 0; overflow: hidden; } 
.count-particles{ border-radius: 0 0 3px 3px; }
.area_live {/* min-height: 100vh; */ align-items: flex-start; position: relative; z-index: 1;}
.area_live .part_link{width: 498rem;}
.area_live .part_link .area_button{margin-top: 52rem;}
.area_live .part_board{width: calc(100% - 498rem); align-items: flex-start; justify-content: space-between;}
.area_live .box_board{width: calc(50% - 37rem);}
.area_live .part_list{border-top: 2px solid #222;}
.area_live .part_list a{width: 100%; height: 55rem; display: flex; justify-content: space-between; align-items: center;}
.area_live .part_list li{border-bottom: 1px solid #d0d0d0;}
.area_live .part_list .num{color: #888; font-size: 15rem;}
.area_live .title{display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 13rem;}
.area_live .title h4{font-size: 24rem; font-weight: 600;}
[data-list="subject"]{display: flex; align-items: center;}
[data-list="subject"] p{font-weight: 500; font-size: 15rem;}
[data-list="subject"] p .new{color: #f7d61e; font-size: 12rem; font-weight: 700; position: relative; top: -7rem;}
[data-list="subject"] .situation{height: 24rem; margin-left: 12rem; font-size: 14rem; line-height: 24rem; display: inline-block; border:1px solid transparent; border-radius: 20rem; text-align: center;}
[data-list="subject"] .situation.done{border-color: #eee; background-color: #eee; color: #8e8e8e; width: 64rem;}
[data-list="subject"] .situation.on{border-color: #222; width: 55rem;;}
[data-list="date"]{color: #bababa; font-size: 14rem; font-family: "Pretendard";}


/* 비지니스 */
#section02{background: url("/images/main/img_main04_bg.jpg") no-repeat; background-size: cover; background-position: 50% 50%;}
#section02 .fp-tableCell{vertical-align: bottom;}
.area_business{align-items: center;padding-top: 80rem;height: calc(100% - 80rem);}
.area_business > .part_title{width: 734rem; box-sizing: border-box; padding-left: 260rem;}
.area_business > .part_title *{color: #fff;}
.area_business > .part_link{width: calc(100% - 734rem);height: 100%;}
.part_link ul{display: flex; width: 100%; height: 100%; flex-wrap: wrap; border-left: 1px solid rgba(255,255,255,.16);}
.part_link ul li{height: 50%;width: 50%;box-sizing: border-box;padding:  48rem 60rem; background:transparent; transition: all .3s; display: flex; align-items: flex-end; cursor: pointer;}
.part_link ul li:nth-child(-n + 2){border-bottom: 1px solid rgba(255,255,255,.16);}
.part_link ul li:nth-child(odd){border-right: 1px solid rgba(255,255,255,.16);}
.part_link ul li *{color: #fff; display: block; }
.part_link ul li i{font-size: 22rem; opacity: 0.57; font-weight: 700;}
.part_link ul li em{font-size: 26rem; font-weight: 700; margin-bottom: 17rem;}
.part_link ul li p{color: #d0d0d0; font-size: 16rem; line-height: 1.87;}
.part_link .conts{overflow: hidden; width: 100%;/*  height: 100%;  */position: relative; background:transparent}
.part_link .conts .hide{position: relative; transform: translateY(93rem); transition:  all .5s;}
.part_link .area_button{ margin-top: 38rem; }
.part_link .area_button a{cursor:pointer}
.part_link ul li:nth-child(1):hover{background: url(/images/main/img_main0401_v2.jpg) no-repeat; background-size: cover;}
.part_link ul li:nth-child(2):hover{background: url(/images/main/img_main0402.jpg) no-repeat; background-size: cover;}
.part_link ul li:nth-child(3):hover{background: url(/images/main/img_main0403_v2.jpg) no-repeat; background-size: cover;}
.part_link ul li:nth-child(4):hover{background: url(/images/main/img_main0404_v2.jpg) no-repeat; background-size: cover;}
.part_link ul li:hover .hide{transform: translateY(0);}

#section04 .bg_icon{position: absolute; top: 0; right: 0;}
.area_story {position: relative; z-index: 20;}
.area_story .title{align-items: center;}
.area_story  h3{text-transform: uppercase; font-weight: 700; font-family: "Montserrat", sans-serif;}
.area_story .list .image{position: relative; padding-top: 100%;}
.area_story .list .image img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% ;}
.area_story .list p{color: #111; font-size: 17rem; font-weight: 600; font-family: "Pretendard"; margin-top: 13rem;}
.area_story .viewAll {margin-left: 42rem;}
.swiper-pagination.swiper-pagination-progressbar{position:relative; overflow:hidden; width:100%; height:2px; margin-top:38rem; background:rgba(16,16,16,.12);}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{display:block; position:absolute; left:0; width:100%; height:100%; background:#edcf13; opacity: 0.95; transform-origin:left top;}

/* section06 */
.root_daum_roughmap .wrap_controllers {display: none;}
#section06 .fa-phone:before {position: absolute; left: 0; top: 8rem; font-size: 28rem; color: #e6b646;}
#section06 {background: #f6f4f1;}
#section06 .area_location {display: flex; align-items: center; gap: 134rem; height: 100%;}
#section06 .area_location > div {width: 50%;}
#section06 .location_map {position: relative;}
#section06 .location_map__wrap > div::before {content: ''; position: absolute; bottom: -30rem; left: -30rem; width: 621rem; height: 575rem; background: #eec76b;}
#section06 .location_map__wrap > div {opacity: 0; height: 0;}
#section06 .location_map__wrap > div.active {opacity: 1; height: auto;}
#section06 .info {margin-top: 32rem;}
#section06 .info .call {position: relative; padding-left: 50rem; font-size: 38rem; color: #e6b646; font-weight: 600;}
#section06 .info .address {margin-top: 38rem;}
#section06 .info .address li {display: flex; align-items: baseline; font-size: 16rem; font-weight: 300; font-family: "Pretendard";}
#section06 .info .address li i {flex: none; width: 88rem; font-size: 13rem; font-weight: 800; font-family: "Montserrat", sans-serif;}
#section06 .info .address li:nth-child(n+2) {margin-top: 15rem;} 
#section06 .btn {display: flex; gap: 10rem; margin-top: 50rem;}
#section06 .btn a {display: flex; gap: 9rem; align-items: center; justify-content: center; width: 166rem; height: 55rem; border: 1rem solid #222;}
#section06 .btn a i.naver {height: 15rem;}
#section06 .btn a i.google {height: 17rem;}
#section06 .btn a img {height: 100%;}
#section06 .location_map__wrap {position: relative;}
#section06 .location_tab {position: absolute; bottom: -102rem; left: 50%; display: flex; width: 300rem; background: #fff; transform: translateX(-50%); z-index: 10;}
#section06 .location_tab li {display: flex; align-items: center; justify-content: center; width: calc(100% / 2); height: 55rem; font-size: 18rem; cursor: pointer;}
#section06 .location_tab li.active {background: #c99d36; color: #fff;}
#section06 .location_park img {position: relative; z-index: 9; width: 100%;}
#section06 .location_park::before {z-index: 1;}

@media (max-width:1800px){
    #fp-nav.fp-left{left: 40rem;}
    .area_online .part_info {padding-left: 140rem;}
    .area_online .part_form form{padding-right: 140rem; padding-left: 90rem;}

    .area_business > .part_title{padding-left: 140rem;}
    
    .area_live .part_link{width: 35%;}
    .area_live .part_board{width: 65%;}

    .area_online .part_info > * {width: 680rem;}
}
@media (max-width:1680px){
    body.fp-viewing-6Page #header nav .gnb > li:nth-child(3) > a {color: #fff !important;}

    .area_visual .list .title h2{font-size: 52rem;}
    .area_visual .list .title p{font-size: 20rem; margin-top: 16rem;}
    
    .section h3{font-size: 40rem;}

    .area_live .title h4{font-size: 22rem;}
    .area_live .box_board {width: calc(50% - 24rem);}

    .area_online .part_info,
    .area_online .part_form{width: 50%;}

    .part_link ul li em{font-size: 24rem;}

    .ceo-info__img {left: 43%; width: 33%;}
    .ceo-info__img img {width: 100%;}
  
    .area_online .part_info > * {width: auto;}
}
@media all and (max-width:1480px){
    #fp-nav ul li, .fp-slidesNav ul li{margin:  0 0 20rem;}
    #fp-nav ul li a + div + span{padding-left: 14rem;}
    #fp-nav ul li a.active + div + span{font-size: 10rem;}
    #fp-nav ul li a + div + span::before{width: 6rem; height: 6rem;}
    #fp-nav.fp-left{left: 20rem;}

    body.fp-viewing-2Page #header .h_menu{background-color: rgba(255,255,255,.17);}

    .area_business > .part_title{width: 40%;}
    .area_business > .part_link{width: 60%;}

    .part_link ul li{padding: 40rem;}

    .area_online .part_info,.area_business > .part_title{padding-left: 100rem;}
    .area_online .part_form form{padding:0 90rem;}

    .area_visual .list .inner {bottom: 30%;}
    .area_visual .list .title h2 {font-size: 45rem;}
    
    .wrap_controller {margin-top: 90rem;}

}
@media all and (max-width:1365px){

    #section04 .bg_icon img{width: 380rem;}

}
@media all and (max-width:1300px) {
    #header {background: #fff !important;}
    #header .cr-logo {display: block !important;}
    #header .wt-logo {display: none !important;}
    #header .inq_btn {background: #222 !important;}

    .bg-section01 {height: auto; padding: 100rem 0 0; background: url('../images/main/bg-section01-m.jpg') no-repeat center/cover;}
    .sec01-tit__counter {position: unset; display: flex; flex-direction: column; justify-content: center; text-align: center;}
    .counter-txt {padding-top: 30rem;}
    .counter-txt strong {font-size: 45rem;}
    .counter-num {margin-top: 15rem;}
    .counter-num span {font-size: 69rem;}
    .odometer-inside {justify-content: center;}
    .odometer-digit {width: 65rem; height: 75rem;}
    .odometer-inside::before {right: 230rem; font-size: 70rem;}
    .odometer-formatting-mark {width: 16rem;}

    .ceo-info {display: flex; justify-content: center; margin-top: 70rem;}
    .ceo-info__cont {position: unset;}
    .ceo-info__cont strong {font-size: 30rem;}
    .ceo-info__img {position: unset; width: 43%;}
    .ceo-info__cont {position: unset;}
    .ceo-info__cont dl {padding-top: 20rem; margin-top: 20rem;}
    .ceo-info__cont strong span {padding: 0 0 0 10rem; font-size: 17rem;}
    .ceo-info__cont dl dt {font-size: 18rem;}

    .area_business > .part_title{padding-right: 80rem;}
    .part_link ul{border-left: 0; border-top: 1px solid rgba(255,255,255,.16);}
    .part_link ul li{padding: 56rem 24rem;}
    .part_link ul li em{font-size: 20rem;}
    .part_link ul li p br{display: none;}
    .part_link .conts .hide{transform:translateY(0);}
    .area_business .area_button .btn.w_tr{border-color: rgba(255,255,255,0.2);}
    .area_business{flex-wrap: wrap; height: auto;}
    .area_business > .part_title,.area_business > .part_link{width: 100%;}
    .area_business > .part_title{padding: 60rem 40rem 40rem;}

    .section h3 {font-size: 30rem;}
    .section h3 + p {margin-top: 10rem; font-size: 16rem;}

    #section06 .area_location {gap: 60rem; padding: 100rem 0;}
    #section06 .info {margin-top: 24rem;}
    #section06 .info .call {padding-left: 32rem; font-size: 28rem;}
    #section06 .fa-phone:before {font-size: 22rem;}
    #section06 .info .address {margin-top: 30rem;}
    #section06 .location_map__wrap > div::before {width: 100%; height: 100%; left: -15rem; bottom: -15rem;}
    .root_daum_roughmap .wrap_map {height: 300rem !important;}
    #section06 .area_location {align-items: flex-start;}
}
@media all and (max-width:1280px) {
    #section03,
    #section04 {padding: 150rem 0;}
    .arrow-control .swiper-button-next, 
    .arrow-control .swiper-button-prev {width: 50rem; height: 50rem;}

    .area_online .part_info, .area_business > .part_title {padding-left: 40rem;}
    .area_online .part_form form {padding: 0 40rem;}
    .counsel_list ul li {padding: 20rem 30rem;}
    .spam_code {height: 50rem;}
    .spam_code_txt input[type="text"] {height: 50rem !important;}
}
 @media all and (max-width:1024px){
    body.fp-viewing-2Page #header, body.fp-viewing-3Page #header, body.fp-viewing-4Page #header, body.fp-viewing-5Page #header{top: 0;}
    body.fp-viewing-2Page #header .btn_menu > span,
    body.fp-viewing-3Page #header .btn_menu > span,
    body.fp-viewing-5Page #header .btn_menu > span{background-color: #222;}
    
    .section h3 + p{font-size: 16rem;}
    .section h3 + p br{display: none;}
    .area_visual .list .title h2{font-size: 45rem;}
    .section h3{font-size: 32rem;}
    .area_online .part_info{padding-right: 80rem;}
    .area_online .part_info, .area_business > .part_title{padding-left: 40rem;}
    .area_online .part_info .address{display: block;}
    .area_online .part_info .address li + li{margin-left: 0; margin-top: 4rem;}
    .area_online .part_form form{padding: 0 40rem;}
    .area_online .part_info .info{margin-top: 36rem;}
    .area_online .part_info .call{font-size: 28rem;}

    .area_live .title h4{font-size: 18rem;}
    .part_link .area_button{margin-top: 28rem;}

    #section03,
    #section04 {padding: 100rem 0;}
}
@media all and (max-width:860px){
    #section04{padding: 80rem 0;}
    .viewAll span{font-size: 12rem;}

    .area_visual .list .title h2 br {display: none;}
    .area_visual .main-visual img {width: 130vw;}
    
    .wrap_controller {margin-top: 50rem;}

    .section h3 br{display: none;}
    .section h3 + p{font-size: 15rem;}
    .area_live{flex-wrap: wrap;}
    .area_live .part_link,.area_live .part_board{width: 100%;}
    .area_live .box_board{width: calc(50% - 12rem);}
    .area_live .part_board{margin-top: 60rem;}

    .area_online{flex-wrap: wrap; flex-direction: column-reverse;}
    .area_online .part_info, .area_online .part_form{width: 100%;}
    .area_online .part_info{height: auto; padding:  80rem 32rem}
    .area_online .part_form{height: auto; padding: 30rem 32rem 80rem; box-sizing: border-box;}
    .area_online .part_form form{padding: 0;}
    .area_online .part_info > * {width: 100%;}

    .part_link ul li {height: 300rem;}
    .part_link ul li em{font-size: 18rem; margin-bottom: 4rem;}
    .part_link ul li p{font-size: 14rem; line-height: 1.6;}
    .part_link ul li em{font-size: 16rem;}

    .bg-section01 {padding: 80rem 0;}
    .ceo-info {margin-top: 100rem;}
    .counter-num span {font-size: 55rem;}
    .odometer-digit {width: 60rem; height: 62rem;}
    .odometer-inside::before {right: 135rem; font-size: 50rem;}
    .odometer-formatting-mark {width: 12rem;}

    #section06 .section-inr {width: calc(100% - 64rem);}
    #section06 .area_location {flex-direction: column;}
    #section06 .area_location > div {width: 100%;}
    .root_daum_roughmap .wrap_map {height: 350rem !important;}
    #section06 .area_location {gap: 160rem;}
}
@media all and (max-width:540px){
    #section03,
    #section04 {padding: 80rem 0;}

    .section h3{font-size: 24rem;}
    .section h3 + p{margin-top: 9rem;}

    .area_visual {border-radius: 0 0 100rem 0;}
    .area_visual .list .title h2{margin-top: 20rem; font-size: 28rem; line-height: 1.3;}
    .area_visual .list .title p{font-size: 17rem;}
    .wrap_controller .line{width: 130rem;}
    .wrap_controller .custom-fraction *{font-size: 14rem;}
    .wrap_controller .p_btn{width: 34rem; height: 34rem;}

    .area_business{padding-top: 20rem;}
    .area_business > .part_title{padding: 40rem 24rem 40rem;}
    .part_link ul li{width: 100%; height: auto; padding: 30rem 24rem;}
    .part_link ul li:nth-child(3){border-bottom: 1px solid rgba(255,255,255,.16);}

    .area_live .part_board{flex-wrap: wrap;}
    .area_live .box_board{width: 100%;}
    .area_live .box_board + .box_board{margin-top: 40rem;}
    .area_live .part_link .area_button{margin-top: 22rem;}
    [data-list="subject"] p{font-size: 14rem;}
    [data-list="date"],.area_live .part_list .num{font-size: 13rem;}
    [data-list="subject"] .situation{font-size: 12rem; height: 22rem; line-height: 22rem;}
    [data-list="subject"] .situation.on{width: 50rem; }
    [data-list="subject"] .situation.done{width: 60rem;}

    .area_online .part_form ul li{flex-wrap: wrap; margin-bottom: 8rem;}
    .area_online .part_form ul li > div{width: 100%;}
    .area_online .part_form ul li > div + div{margin-top: 8rem;}
    .area_online input[type="text"]{height: 52rem;}
    .area_online input[type="text"]::placeholder{font-size: 15rem;}
    .area_online .part_form {padding: 20rem 22rem 64rem;}
    .area_online .part_info {padding: 64rem 22rem;}
    .area_online .part_info .address li{font-size: 14rem;}
    .area_online .part_info .call{font-size: 20rem;}
    .area_online .part_info .call i{font-size: 16rem;}

    #section02, #section04{padding: 60rem 0;}
    #section04 .bg_icon img{width: 180rem;}
    .area_story .list p{font-size: 15rem;}
    .swiper-pagination.swiper-pagination-progressbar{margin-top: 18rem;}

    .scroll-down i {font-size: 13rem;}

    .bg-section01 {padding: 60rem 0; background-position-x: -880rem;}
    .section-inr {width: calc(100% - 50rem);}
    .sec01-tit__counter p {padding-top: 10rem; font-size: 16rem;}
    .counter-num span {font-size: 48rem;}
    .counter-txt strong {font-size: 24rem;}
    .odometer-digit {width: 46rem; height: 55rem;}
    .odometer-formatting-mark {width: 10rem;}
    .odometer-inside::before {right: 22rem;}
    .ceo-info {flex-direction: column; margin-top: 45rem;}
    .ceo-info__cont strong {font-size: 22rem;}
    .ceo-info__cont strong em {letter-spacing: 0;}
    .ceo-info__cont strong span {font-size: 14rem;}
    .ceo-info__img {width: 60%; margin: 0 auto;}
    .ceo-info__cont {width: 100%; margin-top: 40rem;}
    .ceo-info__cont dl dt {font-size: 16rem;}
    .ceo-info__cont dl dd {font-size: 14rem;}
    .ceo-info__cont dl div:nth-child(2) {margin-top: 22rem;}

    #section03 .case-info {margin-top: 15rem;}
    #section03 .case-info span {width: 72rem; height: 26rem; font-size: 13rem;}
    #section03 .case-info em {font-size: 17rem;}
    #section03 .case-info p {font-size: 14rem;}
    
    .area_story .title {flex-direction: column; align-items: flex-start;}
    .area_story .viewAll {margin-left: 0; margin-top: 8rem;}
    .arrow-control {gap: 5rem;}
    .arrow-control .swiper-button-next, 
    .arrow-control .swiper-button-prev {width: 40rem; height: 40rem;}
    .arrow-control .swiper-button-next:after, 
    .arrow-control .swiper-button-prev:after {width: 7rem; height: 12rem;}

    #section06 .area_location {padding: 80rem 0; gap: 120rem;}
    #section06 .section-inr {width: calc(100% - 44rem);}
    #section06 .info .address li {flex-direction: column; gap: 5rem;}
    #section06 .btn a {width: 50%; height: 50rem;}
    .root_daum_roughmap .wrap_map {height: 280rem !important;}
    #section06 .location_tab {width: 100%; bottom: -83rem;}
    #section06 .location_tab li {height: 50rem;}
}
@media all and (max-width:480px){}
@media all and (max-width:360px){}