@charset "utf-8";
.slick-track {
  will-change: transform;
  transform: translateZ(0); /* 강제 하드웨어 가속 */
    transition: 1s;
}

.slider .slick-track,
.slider .slick-list{
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    transition-delay: 10ms;
}


button {border:0; background:none;}


#hd {background:none;}
#hd .gnb_1da { color:#fff;}
#hd_btn .tel {color:#fff;}
.menu-icon , .menu-icon:before , .menu-icon:after {background:#fff;}


.language .btn { color:#fff; border-color:rgba(255,255,255,0.3);}
.language .btn:before {background-position:left top;}


.fixed #hd {background:#fff;}
.fixed #hd .gnb_1da { color:#000;}
.fixed #hd_btn .tel {color:#000;}
.fixed .menu-icon , .fixed .menu-icon:before , .fixed .menu-icon:after {background:#000;}
.fixed .language .btn { color:#000; border-color:rgba(0,0,0,0.3);}
.fixed .language .btn:before {background-position:left -17px;}


.root_daum_roughmap .cont {display:none;}
.m_layer {position:fixed; display:flex; align-items: center; justify-content: center; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,0.5); z-index:111111111111; visibility:hidden; opacity:0; transition: 0.3s;}
.m_layer.on { visibility: visible; transform: scale(1); opacity:1;}
.m_layer .inr {width:1100px; height:calc(100vh - 140px); overflow-y:auto; background:#fff; padding:60px; position:relative; opacity:0; transform:scale(1.2); filter:blur(10px); transition: 0.6s ease-in-out; }
.m_layer.on .inr {transform:scale(1); filter:blur(0px); opacity:1;}
.m_layer .inr .btn_close {position:absolute; right:60px; top:60px; transition: 0.3s; padding-bottom:4px; }
.m_layer .inr .btn_close:hover {transform: rotate(180deg);}
.m_layer .inr .btn_close i {font-size:36px; transition: 0.3s;}
.m_layer .inr .btn_close:hover i {color:#007bd8;}
.m_layer .inr .root_daum_roughmap  {width:100% !important;}
.m_layer .inr h2 {font-size:28px; margin-bottom:24px;}
.m_layer .inr h2:after {content:''; display:block; width:32px; height:1px; background:#007bd8; margin-top:14px;}
.m_layer .inr ul { margin-bottom:40px;}
.m_layer .inr ul li {margin:6px 0;}

.mobile_map {display:none;}




#fullpage {word-break:keep-all;}
.main__control {position:fixed; left:21px; top:50%; z-index:101; transform: translateY(-50%);}
.main__control li a {display:block; position:relative; height:34px; margin:20px 0;}
.main__control li a:before {content:''; display:block; width:8px; height:8px; border-radius:8px; background:#ccc; position:relative; top:13px;}
.main__control li.active a:before {
    width: 8px;height: 8px; border-radius: 50%; background: #fff; outline: 2px solid #fff; outline-offset: 6px; display: block;
}
.main__control li a span {position:absolute; right:17px; top:0; height:34px; display:block; width:80px; line-height:34px; text-align:center; background:#000; border-radius:3px; color:#fff; font-size:13px; transition: 0.3s; opacity:0; width:0; font-weight:300;}
.main__control li a span:before {content:''; display:block; width:6px; height:6px; background:#000; position:absolute; right:-3px; top:14px; transform: rotate(45deg);}
.main__control li.active a span { opacity:1; width:80px;  display: none}


#fullpage .m1 {}
#fullpage .m1 .inr {max-width:1590px; margin:0 auto;}



#fullpage .m1 {display: flex;    flex-direction: column;    align-items: center;  position: relative;  z-index: 1;}
#fullpage .m1 .swiper {width: 100%;    height: 100%;    margin-bottom: 20px;  position: relative; }  
#fullpage .m1 .swiper-slide { display: flex;  flex-direction: column;   justify-content: center; 
                                align-items: center;     color: #fff;  text-align: center;}
#fullpage .m1 .swiper-slide p {font-size: 2rem;  margin: 0 0 10px 0;}
#fullpage .m1 .swiper-slide h2 {font-size: 4rem;  margin: 0; }

#fullpage .m1 button {padding: 10px 20px;    font-size: 1rem;}

#fullpage .m1 .swiper .bg1{background:url("../images/main/visual01.png") no-repeat center center; background-size:cover; height: 100vh}
#fullpage .m1 .swiper .bg2{background:url("../images/main/visual04.png") no-repeat center center; background-size:cover; height: 100vh}
#fullpage .m1 .swiper .bg3{background:url("../images/main/visual03.png") no-repeat center center; background-size:cover; height: 100vh}



#fullpage .m1 .page-controls { position: absolute;    right: 30px;    bottom: 40px;  display: flex; gap: 10px;    z-index: 9999; line-height: 1;    align-items: flex-start; }

/* 숫자 페이징 */
#fullpage .m1 .page-controls .swiper-pagination {  display: flex !important;  gap: 8px;  position: relative;  z-index: 1;  align-items: center; }
#fullpage .m1 .page-controls .swiper-pagination-bullet {  width: 45px;  height: 45px;  line-height: 45px;  display: flex;          justify-content: center;  
    align-items: center;  border-radius: 0;  font-size: 14px;  font-weight: normal;  color: #fff;  background: none;  opacity: 1;}

/* 활성 숫자 페이징 */
#fullpage .m1 .page-controls .swiper-pagination-bullet-active {  background: none;  color: #fff;  border: 1px solid #fff;}

/* 재생/일시정지 버튼 */
#fullpage .m1 .page-controls #togglePlay {  font-family: 'Material Icons';  font-size: 30px;        color: #fff;         background: none;  border: none;
  cursor: pointer;  display: flex;  align-items: center;  justify-content: center;  padding: 0;}



#fullpage .m2 .fp-tableCell {/*display:flex;*/}


.m2 .dots-container {opacity:.5;  mix-blend-mode:soft-light; transform: scale(1.08);}
.fp-viewing-mainsection02 #fullpage .m2 .left:before {animation:m2_obj 2s ease-in-out backwards;}
.fp-viewing-mainsection02 #fullpage .m2 .right .box a:before {animation:m2_obj 2s ease-in-out backwards;}
.fp-viewing-mainsection02 #fullpage .m2 .right .notice:before {animation:m2_obj 2s ease-in-out backwards;}


#fullpage .m2 {}
#fullpage .m2  .inr{display: flex}
#fullpage .m2  .inr > div{flex:1; width: 100%; height: 955px;
    display: flex;    align-items: center;    justify-content: center;    flex-direction: column;    text-align: center;     word-break: keep-all;
  position: relative;
    overflow: hidden; 

}


#fullpage .m2 .inr .box1::before,
#fullpage .m2 .inr .box2::before,
#fullpage .m2 .inr .box3::before {    content: "";    position: absolute;    top: 0; left: 0; right: 0; bottom: 0;    background-size: cover;    
    background-position: center;    z-index: 0;    transition: transform 0.5s ease, filter 0.5s ease;}


/*#fullpage .m2 .inr .box1::before { background-image: url("../images/main/m2_01_bg.png"); }
#fullpage .m2 .inr .box2::before { background-image: url("../images/main/m2_02_bg.png"); }
#fullpage .m2 .inr .box3::before { background-image: url("../images/main/m2_03_bg.png"); }*/

#fullpage .m2 .inr .box1::before { background-image: url("../images/main/m2_002_bg.png"); }
#fullpage .m2 .inr .box2::before { background-image: url("../images/main/m2_001_bg.png"); }
#fullpage .m2 .inr .box3::before { background-image: url("../images/main/m2_003_bg.png"); }


#fullpage .m2 .inr > div:hover::before {
    transform: scale(1.05);    filter: blur(10px);}


#fullpage .m2 .inr > div a {    position: relative;    z-index: 1;}


#fullpage .m2  .inr  a{  color: #fff; }
#fullpage .m2  .inr  a p{font-size: 25px; font-weight: 600; margin: 15px 0}
#fullpage .m2  .inr  a p span{display: block; font-size: 16px; font-weight: 100}









#fullpage .m3 {}
#fullpage .m3 .inr {max-width:1500px; margin:0 auto; position:relative;  display: flex; gap: 40px;}
/*#fullpage .m3 h2 {color:#fff; font-size:36px; margin-bottom:30px;}*/
.fp-viewing-mainsection03 #fullpage .m3 { background-position:center 100%; transition-delay: 1s;}
.fp-viewing-mainsection03 #fullpage .obj { opacity:1; bottom:3px; transition-delay: 1s;}
#fullpage .m3 .inr .left{width: 400px; background: none}

#fullpage .m3 .left .bottom_w{display: flex; padding: 10px; justify-content: space-between;}
#fullpage .m3 .left .bottom_w h2{font-size: 15px; color: #000}  
#fullpage .m3 .left .bottom_w #important{color: #000; position :relative !important; bottom:0 !important; width: 50px; font-weight:600 }
#fullpage .m3 .left .bottom_w #important .swiper-pagination-current{color: #ff0000; }
#fullpage .m3 .left .swiper img{border-radius:20px; }

#fullpage .m3 .inr .right{width: calc(100% - 400px);  position: relative;      }                    

#fullpage .m3 .inr .right .top { background:#f1f5ff url("../images/main/m3_01_bg.png") no-repeat bottom right;  border-radius: 30px;  padding: 50px; }


#fullpage .m3 .inr .right .top .tit{  display: flex;    align-items: center;    justify-content: space-between;}
#fullpage .m3 .inr .right .tit h2{font-size: 35px;}
#fullpage .m3 .inr .right .tit a{font-size: 18px;}
#fullpage .m3 .inr .right .txt_w{font-size: 18px; margin-top: 20px; line-height: 160%}
#fullpage .m3 .inr .right .txt_w .time span{color: #d13b43}

#fullpage .m3 .inr .right .txt_w .tel_info br{display: none}

#fullpage .m3 .inr .right .txt_w ul li{color: #444; padding-left: 20px;}

#fullpage .m3 .inr  .bottom{width: 100%; margin-top: 25px;}
#fullpage .m3 .inr .bottom ul{display: flex}
#fullpage .m3 .inr  .bottom ul li{background: #1b2e57; position: relative; height: 180px;
display: flex;    align-items: center;    justify-content: center;    flex-direction: column;    text-align: center;   flex: 1;}
#fullpage .m3 .inr .bottom ul li a{color: #fff; padding: 20px;    display: flex;     flex-wrap: wrap; justify-content: center; gap:15px;}
#fullpage .m3 .inr  .bottom ul .tit { color: #fff; font-size: 25px; border-radius:0 0 20px 0;
    background:#1b2e57 url("../images/main/m3_02_bg.png") no-repeat ;   background-position: calc(100% - 50px) 10%;  }
#fullpage .m3 .inr  .bottom ul .txt{ border-radius:0 0 0 20px}
#fullpage .m3 .inr  .bottom ul p{width: 100%; text-align: center;}
#fullpage .m3 .inr .bottom ul li:after{ content: "";    position: absolute;    right: 0;     top: 50%;     transform: translateY(-50%); 
   border-right: 1px dotted #fff; opacity: 0.3;    height: 50%;  
    
  border-image: repeating-linear-gradient(
        to bottom,  
        #eee 0 2px, 
        transparent 2px 6px 
    ) 1; 
        }

#fullpage .m3 .inr .right .bottom ul li:first-child::after,
#fullpage .m3 .inr .right .bottom ul li:last-child::after{    display: none;}


#fullpage .m3 .inr .right .bottom ul li a img {
    transition: transform 0.5s ease; /* 회전 시 부드럽게 */
}

/* 호버 상태: 360도 회전 */
#fullpage .m3 .inr .right .bottom ul li a:hover img {
   transform: scaleX(-1); /* 좌우 뒤집기 */
}



#fullpage .m4 {background:#f0eff7 url(../images/main/m4_bg.png) no-repeat center 120%; transition: 1s; margin-bottom:-10px; animation:m4_bg 10s ease-in-out infinite;}
@keyframes m4_bg{
	0%{  background-color:#f0eff7;}
    50%{  background-color:#f7f3ef;}
    100%{  background-color:#f0eff7;}
    
}
#fullpage .m4 .inr {max-width:1620px; margin:0 auto; position:relative; padding-bottom:80px;}
#fullpage .m4 h2 {font-size:36px; margin-bottom:20px;}
#fullpage .m4 .slickwrap { margin:0 -15px;}
#fullpage .m4 .slick-slide > div { padding:15px;}
#fullpage .m4 .slick-slide > div .item {  border-radius:5px; background:#fff; text-align:center; overflow:hidden; height:160px; display:flex !important; align-items: center; justify-content: center; position:relative;}
#fullpage .m4 .nav {position:absolute; right:0px; top:4px; display:flex; align-items: center; gap:8px;}
#fullpage .m4 .nav button i {font-size:32px; }
#fullpage .m4 .nav .count { position:relative; top:-2px; margin-right:10px; }
#fullpage .m4 .nav .count * {font-size:16px; font-weight:300;}




.fp-viewing-mainsection04 #fullpage .m4 { background-position:center 100%; transition-delay: 1s;}

      






.fp-viewing-mainfooter #hd {top:-100px;}






@media (max-width: 1600px){
    #fullpage .m1 .inr {margin: 0 50px;}
    #fullpage .m2 .left {padding-left:60px;}
    #fullpage .m3 .inr {margin:0 50px;}
    #fullpage .m4 .inr {margin:0 50px;}

}



@media (max-width: 1559px){
    
  




}
@media (max-width: 1399px){
    
    .main__control {display:none;}
    .fp-section.fp-table, .fp-slide.fp-table {display:block !important; height:auto !important;}
    .fp-tableCell {height:auto !important; display:block !important;}
    
    #fullpage .m1 {/*padding:140px 0 80px;*/}
    #fullpage .m1 h2 {font-size:62px;}
    #fullpage .m1 .txt {font-size:20px; margin:10px 0 20px;}
    #fullpage .m1 ul li {width:calc(33.3333% - 20px);}
    
      #fullpage .m2 {    margin-top: -20px;}
    #fullpage .m2 .left {width:auto; height:600px; padding:70px 0 0 50px;}
    #fullpage .m2 .left .obj {right:50px; bottom:50px;}
    #fullpage .m2 .right {width:auto; height: auto;}
    #fullpage .m2 .right .notice {height:auto; padding:60px 50px;}
    #fullpage .m2 .right .notice .nav {top:-1px;}
    #fullpage .m2 .right .box a {height:300px; padding:60px 50px;}
    #fullpage .m2 .right .box a:first-child:after {background-position:right center;}
    
    #fullpage .m3 {padding:70px 0;}
    #fullpage .m3 .obj {display:none;}
    #fullpage .m3 .inr {margin:0px 50px;}
    
    #fullpage .m4 {padding:70px 0;}
    #fullpage .m4 .inr {margin:0 50px;}
}




@media (max-width: 1023px){
    
#fullpage .m1 .swiper .bg1,
#fullpage .m1 .swiper .bg2,
#fullpage .m1 .swiper .bg3{ height: 650px; }
    
    #fullpage .m1 .swiper-slide p{font-size: 1rem}
    #fullpage .m1 .swiper-slide h2{font-size: 2rem}
    
    
    #fullpage .m1 {/*padding:100px 0 60px;*/}
    #fullpage .m1 .inr {margin:0 30px;}
    #fullpage .m1 h2 {font-size:42px;}
    #fullpage .m1 ul li {width:calc(50% - 20px);}
    #fullpage .m1 ul li a {padding:0 20px; word-break: keep-all;}
    #fullpage .m1 ul li a .go {left:20px; right:20px; font-size:16px;}
    #fullpage .m1 ul li a .go em {width:28px; height:28px; font-size:15px; line-height:28px;}
    
    #fullpage .m2{/*margin-top: -50px;*/}
    #fullpage .m2 .inr{flex-wrap: wrap}
    #fullpage .m2 .inr > div{width: 100%; flex: unset; height: auto;}
    #fullpage .m2 .inr > div a{padding: 100px 0;}
    
    
    
    #fullpage .m3 {padding:60px 0;}
    #fullpage .m3 .inr {margin:0 30px; }
   
    
    
    #fullpage .m3 .inr .right .top {background-size: 35%}
    
   /*#fullpage .m3 .inr .right  .bottom{
    width: 100%;
    margin-top: 25px;
    position: absolute;
    top: 700px;
     left: -400px}*/
    
    #fullpage .m3 .inr{flex-wrap: wrap}   
    #fullpage .m3 .inr .left,
    #fullpage .m3 .inr .right{width: 100%}
    #fullpage .m3 .left .swiper img{width:  100%}
    
    #fullpage .m3 .inr .right .top{background: #f1f5ff;}
    
    #fullpage .m3 .inr .right .txt_w .tel_info br{display: block}
    #fullpage .m3 .inr .right .txt_w .tel_info span{display: none}
    
    #fullpage .m3 .inr .bottom ul{flex-wrap: wrap; }
    #fullpage .m3 .inr .bottom ul .tit{width: 100%; border-radius:20px 20px 0 0}
    #fullpage .m3 .inr .bottom ul li{flex:unset; width: 25%;     height: 180px; }
    #fullpage .m3 .inr .bottom ul .txt{border-radius: 0 0 0px 20px}
    #fullpage .m3 .inr .bottom ul p{    word-break: keep-all !important;}
    #fullpage .m3 .inr .bottom ul li:last-child{border-radius: 0 0 20px 0px}
   
    
     #fullpage .m4 {padding:60px 0;}
    #fullpage .m4 .inr {margin:0 30px;}
    
    
}

@media (max-width: 767px){
    
   
}
    

@media (max-width: 540px){
    
    #fullpage .m3 .inr .bottom ul li{ width: 50%;     height: 150px; }
    #fullpage .m3 .inr .bottom ul .txt{border-radius:0}
    #fullpage .m3 .inr .bottom ul li:nth-child(4){border-radius: 0 0 0px 20px}
    
    #fullpage .m3 .inr .right .top{padding: 30px;}
    #fullpage .m3 .inr .right .tit h2 {    font-size: 25px;}
    
    #fullpage .m3 .inr .right .bottom ul li:nth-child(3)::after{    display: none;}
    
}