html{scroll-behavior: smooth;}

img{max-width: 100%; display: block}
.inner{max-width: 1810px; margin: 0 auto; padding: 0 25px; width: 100%}
.inner2{max-width: 1710px; margin: 0 auto; padding: 0 25px; width: 100%}

.eng_font *{font-family: 'sans-serif' !important;}

/*헤더영역*/


.header{position: fixed; top: 0; left: 0; width: 100%;  z-index: 9999; background: #fff; transition-duration: .5s}
.fp-viewing-main .header{backdrop-filter: blur(10px); background: transparent}
.fp-viewing-main .header.drop{background: #fff; backdrop-filter: blur(0px);}

.header .inner{display: flex; justify-content: space-between;
    align-items: center;}
    
.header:after{content: ''; width: 100%; position: absolute; left: 0; top: 100%; height: 1px; background: #e9e9e9; opacity: 1}    
.fp-viewing-main .header:after{content: ''; background: #fff; opacity: .2} 

.fp-viewing-main .header.drop:after{background: #e9e9e9; opacity: 1}


.header .logo{z-index: 1; opacity: 1; transition-duration: .5s; background: url('../img/logob.png');
    width: 105px;
    height: 24px;
    background-position: center; background-repeat: no-repeat

}


.fp-viewing-main .header .logo{background-image: url('../img/logow.png');}

.fp-viewing-main .header.drop .logo{background-image: url('../img/logob.png');}

.right_nav{display: flex;     justify-content: flex-end;
    align-items: center;
    gap: 50px; transition-duration: 1s}



.right_nav ul{display: flex; gap:50px}



.right_nav ul li{ text-align: center; position: relative}
.right_nav ul li a{color: #1a1a1a; display: block; text-align: center; padding: 31px 0; font-size: 18px; position: relative; font-weight: 600}

.fp-viewing-main .right_nav ul li a{color: #fff}

.fp-viewing-main .header.drop .right_nav ul li a{color:#1a1a1a }


.right_nav ul li .sub_deps{position: absolute;     width: max-content; left: 50%;
    transform: translateX(-50%); top: calc(100% - 6px); opacity: 0; visibility: hidden; transition-duration: .5s; 
    z-index: -1; border: 0px solid #e9e9e9; background: rgba(255,255,255,.8)}
    
.right_nav ul li:hover .sub_deps{opacity: 1; visibility: visible; z-index: 1}
    
.right_nav ul li .sub_deps .sub_deps_a{padding: 0 0; display: block; line-height: 50px; height: 50px; 
background: rgba(255,255,255,.0); transition-duration: .5s; position: relative; }
.right_nav ul li .sub_deps .sub_deps_a a{display: block; padding: 0 45px; color: #666; transition-duration: .5s; }

.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_a a{ color: #fff; }

.fp-viewing-main .header.drop .right_nav ul li .sub_deps .sub_deps_a a{color: #666}


.right_nav ul li .sub_deps .sub_deps_a + .sub_deps_a{border-top: 0px solid #e9e9e9}

.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_a + .sub_deps_a{border-top: 0px solid rgba(255,255,255,.2)}



.right_nav ul li .sub_deps .sub_deps_a a span{position: relative}
/*.right_nav ul li .sub_deps .sub_deps_a a span:after{content: ''; position: absolute; right: -20px; top: 6px; width: 7px; 
height: 8px; background: url('../img/2deps.png'); background-repeat: no-repeat; background-position: center; transition-duration: .5s}*/

.right_nav ul li .sub_deps .sub_deps_a:hover{ }
.right_nav ul li .sub_deps .sub_deps_a:hover a{ font-weight: bold; color: #1a1a1a}

/*.right_nav ul li .sub_deps .sub_deps_a:hover a span:after{background-image: url('../img/2depshover.png');}*/


.right_nav ul li .sub_deps .sub_deps_small{position: absolute; left: calc(100% + 10px);
    top: 0;
    width: max-content; opacity: 0; visibility: hidden; transition-duration: .5s; border: 0px solid #e9e9e9; background: rgba(255,255,255,.8)}
    
    
/*.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_a a span:after{background-image: url('../img/2depsw.png');}   */
    
.fp-viewing-main .right_nav ul li .sub_deps, .fp-viewing-main .right_nav ul li .sub_deps .sub_deps_small{border-color: rgba(255,255,255,.2);
 backdrop-filter: blur(30px); background: rgba(0,0,0,0.02) }
    
.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_a:hover a{ font-weight: bold; color: #fff}   
    
    
.fp-viewing-main .header.drop .right_nav ul li .sub_deps, .fp-viewing-main .header.drop .right_nav ul li .sub_deps .sub_deps_small{background: rgba(255,255,255,.8); backdrop-filter: blur(0px);}
    
    
.fp-viewing-main .header.drop .right_nav ul li .sub_deps .sub_deps_a:hover a{ font-weight: bold; color: #1a1a1a}   
       
    
    
.right_nav ul li .sub_deps .sub_deps_a:hover .sub_deps_small{opacity: 1; visibility: visible}
    

.right_nav ul li .sub_deps .sub_deps_small a{ color: #666 !important; transition-duration: .5s;}

.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_small a{ color: #fff !important; transition-duration: .5s;}
.fp-viewing-main .header.drop .right_nav ul li .sub_deps .sub_deps_small a{color: #666 !important;}


.right_nav ul li .sub_deps .sub_deps_small a:hover{font-weight: bold; color: #1a1a1a !important}
.right_nav ul li .sub_deps .sub_deps_small a + a{border-top: 0px solid #e9e9e9}


.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_small a:hover{font-weight: bold; color: #fff !important}
.fp-viewing-main .right_nav ul li .sub_deps .sub_deps_small a + a{border-top: 0px solid rgba(255,255,255,.2)}


.lang{position: relative}
    
.lang .lang_img{display: flex; padding: 0; gap:0px;    align-items: center;
    justify-content:center; background: #f8f8f8; border-radius: 50px; width: 40px; height: 40px; cursor: pointer}    
    
.fp-viewing-main .lang .lang_img{background: #fff}
    
.fp-viewing-main .header.drop .lang .lang_img{background: #f8f8f8}    
    
.lang_list{position: absolute;     left: 50%;
    transform: translateX(-50%); top: calc(100% + 10px); 
    background: #fff; width: 40px; background: #fff; 
    text-align: center; padding: 0px 0; border-radius: 50px; 
    transition-duration: .5s; opacity: 0; height: 0; max-height: 0px; visibility: hidden; overflow: hidden; border: 1px solid #e9e9e9}    
  
.fp-viewing-main .lang_list{border-color: #fff}
    
.lang a{color: #fff; font-size: 14px;  transition-duration: .5s; color: #828282; display: block; font-weight: 600}
.lang a + a{margin-top: 10px}
.lang a:hover, .lang a.on{ color: #1a1a1a}

.lang_list.on_lang{opacity: 1; height: auto; max-height: 500px; visibility:visible; padding: 15px 0; z-index: 2}



#my-nav{position: fixed; z-index: 8; right: 55px; top: 50%; transform: translateY(-50%);}

#my-nav li{width: 32px; height: 32px; border: 1px solid rgba(204,204,204,.0); transition-duration: .5s; position: relative; border-radius: 60px}
#my-nav li a{width: 6px; height: 6px; background: #e9e9e9; 
position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border-radius: 6px; opacity: 1; transition-duration: .5s}


#my-nav li.active{border: 1px solid rgba(204,204,204,1);}
#my-nav li.active a{opacity: 1; background: #1a1a1a}


.fp-viewing-main > #my-nav li.active{}
.fp-viewing-main > #my-nav li a{background: #fff; opacity: .3;}
.fp-viewing-main > #my-nav li.active a{background: #fff; opacity: 1}


/*메인*/

.main_visual{position: relative}

.slide_bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover !important; background-position: center; z-index: -1}
.slide_bg.slide01{background: url('../img/main/banner01.png');  }
.slide_bg.slide02{background: url('../img/main/banner02.png');  }
.slide_bg.slide03{background: url('../img/main/banner03.png');  }

.main_slide .box{height: 100vh}


.slide_txt {
    max-width: 1620px;
    margin: 0 auto;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding-bottom: 260px;
    position: relative;
    flex-direction: column;
}
.slide_txt h2{font-size: 100px; color: #fff; font-weight: 400; line-height: 1.1;}
.slide_txt p{font-size: 20px; color: #fff; margin-top: 30px}

.slide_txt h2 b{font-weight: 800}

.slide_bg{transition-duration: 3s;animation: boom 3s 1 linear; scale: 1.1;}



.slick-current .slide_bg{scale: 1.0; transition-duration: 3s}




@keyframes boom {
    from {
        scale: 1.1;

    }
    to {
        scale: 1.0;
    }
}


.slide_btn{position: absolute; max-width: 1640px; 
width: 100%; left: 50%; bottom: 80px; display: flex;transform: translateX(-50%); gap:20px; align-items: center; justify-content: flex-end;}
.slide_btn span{width: 60px; height: 60px; display: flex; border: 1px solid #fff; border-radius: 80px;justify-content: center;
    align-items: center; cursor: pointer; transition-duration: .5s}

.slide_btn span:hover{background: rgba(0,0,0,0.4); transition-duration: .5s}


.slide_btn .slick-dots{display: flex; gap:20px}
.slide_btn .slick-dots button{font-size: 0; background: none; border: 0}
.slide_btn .slick-dots li{opacity: .5; cursor: pointer; transition-duration: .5s; width: 140px; height: 5px; background: #fff}
.slide_btn .slick-dots li.slick-active{opacity: 1; }





.buttons_play{width: 62px; height: 62px; position: relative}
.progress-round__wrap{position: relative;
    margin: auto;
    width: 100%;
    height: 100%;
    border: 2px solid #fff;
    border-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    z-index: 11;
    box-sizing: border-box;}
.progress-round__wrap .progress{position: absolute; left: -1px; top: -1px; width: 60px; height: 60px; transform: rotate(-90deg); overflow: visible}
.progress circle {
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  transform-origin:center;
}

.play_btn_are{position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 33}
.play_btn_are button{display: none; background: transparent; border: 0; width: 100%; height: 100%; justify-content: center;
    align-items: center;}
.play_btn_are button.play_on{display: flex;}



/**
 *  Progress Bar
 */
.progress2 {
  display: block;
  width: 100%;
  max-width:75px;
  height: 2px;
  border-radius: 0px;
  overflow: hidden;
  
  background-color: rgba(255,255,255,.5);
  background-image: linear-gradient(to right, white, white);
  background-repeat: no-repeat;
  background-size: 0 100%;
  
  transition: background-size .4s ease-in-out;
  position: absolute;     left: 54px;
    top: 50%;
    transform:translateY(calc(-50% - 30px)) rotate(90deg);
}




.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

.scroll_down{position: absolute; right: 60px;  bottom: 70px; z-index: 2; text-align: center}
.scroll_down .mouse_icon{width: 16px; height: 28px; border: 2px solid #737373; border-radius: 16px; display: block; margin-top: 20px; position: relative}
.scroll_down .mouse_icon .inm{animation-timing-function: linear; 
animation-duration: 3s;
 	 animation-name: scroll_down01;
 	 animation-iteration-count: infinite;
position: absolute; 
left: 50%; top: 4px;  width: 2px; height: 6px; background: #737373; display: inline-block; margin-left: -1px}



.fp-viewing-main .scroll_down .mouse_icon{ border-color: #fff }
.fp-viewing-main .scroll_down .mouse_icon .inm{background: #fff; }


    
@keyframes scroll_down01 {
  0% {
    top: 4px
  }

  50% {
    top: 12px
  }
  
  100% {
   top: 4px
  }
}






.main_tech{padding: 150px 0 50px; height: 100vh}

.main_title h3{display: flex; font-size: 12px; gap:10px;justify-content: flex-start;
    align-items: center;}

.main_title h2{font-size: 60px; line-height: 70px; font-weight: 700; margin: 0px}
.main_title p{font-size: 18px; font-weight: 500; margin-top: 15px; color: #737373; line-height: 36px} 
.main_title p.small_txt{font-size: 20px; line-height: 40px; font-weight: 400; margin-top: 60px}
.main_title p.small_txt b{font-weight: bold}





.flex_hover{display: flex; gap:10px; margin-top: 60px; overflow: hidden}
.flex_hover .box{flex:1 1 0%;
background-position: center; height: 60vh; padding: 45px 60px; transition-duration: 1s; transition-duration: .5s;
position: relative; z-index: 1; overflow: hidden; background: #000}

.flex_hover .box .bg{position: absolute; width: 100%; height: 100%; left: 0; top: 0; transition-duration: 1s}

.flex_hover .box:first-child .bg{background-image: url('../img/main/flex01.png')}
.flex_hover .box:nth-child(2) .bg{background-image: url('../img/main/flex02.png')}
.flex_hover .box:nth-child(3) .bg{background-image: url('../img/main/flex03.png')}
.flex_hover .box:nth-child(4) .bg{background-image: url('../img/main/flex04.png')}

.flex_hover .box:hover .bg{scale:1.2; opacity: .8}


.flex_hover .box .txt_are{height: 100%;
    display: flex;
    flex-direction: column;
        align-items: center;
    justify-content: center; gap:60px; text-align: center; position: relative; z-index: 2}
.flex_hover .box .txt_are h2{font-size: 44px; font-weight: 600; color: #fff; transition-duration: 1.5s; }


.flex_hover .box .txt_are a{display: flex; color: #fff; font-size: 14px;
gap:10px;align-items: center;  font-weight: bold; border: 1px solid #fff; 
padding: 10px 20px; background: rgba(255,255,255,0.25); transition-duration: .5s}
.flex_hover .box .txt_are a span.icon{ width: 10px; height: 10px; background: url(../img/main/flex_hover_more.png); background-position: center;  }

.flex_hover .box .txt_are a:hover{background: #d11e1e}






.main_service{padding: 200px 0 100px}

.main_title a{display: flex; color: #1a1a1a; font-size: 14px; text-shadow:0px 0px 8px rgba(0,0,0,0.1); 
gap:35px;align-items: center;  font-weight: bold; margin-top: 45px}
.main_title a span.icon{background: #d11e1e; width: 24px; height: 24px; border-radius: 25px; display: flex;    justify-content: center;
    align-items: center; position: relative;  transition-duration: .5s}

.main_title a span.icon:after{content: ''; width: 52px; height: 52px; background: #d11e1e; opacity: .1; border-radius: 52px; position: absolute;
transform:translate(-50%, -50%); left: 50%; top: 50%
}

.main_title a span.icon:before{content: ''; position: relative; width: 5px; height: 8px; 
background: url(../img/main/learnmorew.png); background-position: center; transition-duration: .5s}


.main_service{background: url('../img/service_bg.png'); background-repeat: repeat-y; background-position: right top; height: 100vh}

.main_service .left{width: calc(100% - 100px - 543px)}
.main_service .inner2{display: flex; gap:100px}

.service_slide_are{margin-top: 60px}

.service_slide a{background: #f8f8f8; display: block; padding: 25px; height: 240px; display: flex;flex-direction: column;
    justify-content: space-between;
    align-items: flex-start; transition-duration: .5s}
    
.service_slide a:hover{background: #fff; box-shadow: 0px 0px 10px rgba(0,0,0,0.1)}
    
.service_slide a svg{max-height: 45px; width: auto}

.svg_icon{stroke-width: 2px;; transition-duration: .5s}

.svg_icon{stroke-dasharray: 350; stroke-dashoffset: -350;transition-duration: 2s ;
stroke: #1a1a1a; transition-delay: 1s}




.active .svg_icon{stroke-dashoffset: -0;}



.service_slide a h3{font-size: 16px; line-height: 20px; color: #383838; font-weight: bold; transition-duration: .5s}
.service_slide a p{color: #909090; font-size: 14px; line-height: 24px; word-break: keep-all; letter-spacing: -.3px; margin-top: 10px}


.service_slide a:hover .svg_icon{stroke: #d11e1e !important; transition-delay: 0s; transition-duration: 1s}
.service_slide a:hover h3{color: #d11e1e}

.service_slide{margin: 0 -5px}
.service_slide .slick-slide{padding: 5px}


.main_service .right{width: 543px; position: relative}


.main_service .right .sboom img{position: absolute}
.main_service .right .sboom img.s01{right: -90px; top: 50px}
.main_service .right .sboom img.s02{right: 60px; bottom: -50px}
.main_service .right .sboom img.s03{left: 230px; bottom: -40px}
.main_service .right .sboom img.s04{right: -130px; bottom: 180px}



/**
 *  Progress Bar
 */
.service_slide_are .progress3 {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 0px;
  overflow: hidden;
  
  background-color: #e9e9e9;
  background-image: linear-gradient(to right, #1a1a1a, #1a1a1a);
  background-repeat: no-repeat;
  background-size: 0 100%;
  
  transition: background-size .4s ease-in-out;
  margin-top: 50px;
}


.service_slide_are .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}







.main_public{display: flex; height: 100vh; }
.main_public .left{width: 50%; padding: 230px 8rem 100px; background: #f8f8f8 ; background-position: right bottom; background-repeat: no-repeat}
.main_public .right{width: 50%; padding: 230px 8rem 100px}

.board_least{width: 100%}
.board_least_title{display: flex; justify-content: space-between;
    align-items: center;}
.board_least_title h2{font-size: 48px; font-weight: 600; color: #000; text-transform: uppercase}




.board_least_title a{display: flex; color: #1a1a1a; font-size: 14px; text-shadow:0px 0px 8px rgba(0,0,0,0.1); 
gap:35px;align-items: center;  font-weight: bold; }
.board_least_title a span.icon{background: #d11e1e; width: 24px; height: 24px; border-radius: 25px; display: flex;    justify-content: center;
    align-items: center; position: relative;  transition-duration: .5s}

.board_least_title a span.icon:after{content: ''; width: 52px; height: 52px; background: #d11e1e; opacity: .1; border-radius: 52px; position: absolute;
transform:translate(-50%, -50%); left: 50%; top: 50%
}

.board_least_title a span.icon:before{content: ''; position: relative; width: 5px; height: 8px; 
background: url(../img/main/learnmorew.png); background-position: center; transition-duration: .5s}


.board_least_list{margin-top: 70px}
.board_least_list ul{}
.board_least_list ul li{padding:35px 30px; background: #fff; position: relative}
.board_least_list ul li a{display: block; gap:28px; justify-content: flex-start;
    align-items: center; position: relative}
    
.board_least_list ul li{position: relative}    
    
.board_least_list ul li a .date{text-align: right; position: absolute; right: 0; bottom: 0}

.board_least_list ul li a .date p{color: #aeaeae; font-size: 14px; font-weight: 400; transition-duration: .5s; font-family:  'Pretendard';}





.board_least_list ul li a .txt_board{ }
.board_least_list ul li a .txt_board h2{font-weight: bold; color: #1a1a1a; font-size: 20px; transition-duration: .5}
.board_least_list ul li a .txt_board p{color: #828282; font-size: 16px; margin-top: 8px; text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap; word-break: keep-all; padding-right: 120px}




.board_least_list ul li + li{margin-top: 10px}


.board_least_list ul li a:hover .txt_board h2{color: #d11e1e}



.main_public .right .board_least_list ul li{background: #f8f8f8}






.main_news{padding: 200px 0 120px; height: 100vh}
.main_news .main_title{position: relative}
.main_news .main_title a{margin: 0; position: absolute; right: 0; bottom: 0}



.news_slide_are{margin-top: 60px;}






/**
 *  Progress Bar
 */
.news_slide_are .progress {
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 0px;
  overflow: hidden;
  
  background-color: #e9e9e9;
  background-image: linear-gradient(to right, #1a1a1a, #1a1a1a);
  background-repeat: no-repeat;
  background-size: 0 100%;
  
  transition: background-size .4s ease-in-out;
  margin-top: 50px;
}


.news_slide_are .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

.news_slide{margin: 0 -5px}
.news_slide .slick-slide{padding: 0 5px}

.news_slide .box{}

.news_slide .box .img_are{border: 1px solid #e9e9e9; height: 250px; overflow: hidden; display: block}
.news_slide .box .img_are img{width: 100%; transition-duration: 1s}
.news_slide .box:hover .img_are img{scale: 1.1;}


.news_slide .box .txt_are{margin-top: 45px; display: block}

.news_slide .box .txt_are h2{font-size: 20px; line-height: 30px; color: #1a1a1a; font-weight: 600}
.news_slide .box .txt_are p{font-size: 16px; color: #909090; margin: 8px 0}
.news_slide .box .txt_are p.date{font-size: 12px; color: #bdbdbd; margin: 0}






.news_slide .box .img_are {

  box-shadow: inset 0 0 0 2px #f45e61;

  position: relative;

}
.news_slide .box .img_are::before, .news_slide .box .img_are::after {
  box-sizing: inherit;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 2
}



.news_slide .box .img_are.draw {
  transition: color 0.25s;
}
.news_slide .box .img_are.draw::before, .news_slide .box .img_are.draw.draw::after {
  border: 4px solid transparent;
  width: 0;
  height: 0;
}
.news_slide .box .img_are.draw::before {
  top: 0;
  left: 0;
}
.news_slide .box .img_are.draw::after {
  bottom: 0;
  right: 0;
}
.news_slide .box .img_are.draw:hover {

}
.news_slide .box .img_are.draw:hover::before, .news_slide .box .img_are.draw.draw:hover::after {
  width: 100%;
  height: 100%;
}


/*
.news_slide .box .img_are.draw:hover::before {
  border-top-color: #d11e1e;
  border-right-color: #d11e1e;
  transition: width 0.5s ease-out, height 0.5s ease-out 0.5s;
}
.news_slide .box .img_are.draw:hover::after {
  border-bottom-color: #d11e1e;
  border-left-color: #d11e1e;
  transition: border-color .5s ease-out 1s, width 0.5s ease-out 1s, height 1s ease-out 1.5s;
}*/








.main_board_section{padding: 120px 0 50px; }
.main_board_flex{display: flex; gap:80px;}

.main_board_flex .main_txt_board{width: calc(50% - 40px)}

.main_txt_board_title{display: flex;     justify-content: space-between;
    align-items: center; margin-bottom: 20px}
.main_txt_board_title h2{font-size: 28px; line-height: 150%; word-break: keep-all}

a.viewmore{display: flex; gap:15px; font-size: 14px; font-weight: bold; line-height: 150%; word-break: keep-all}
a.viewmore i{width: 24px; height: 24px; background: #d11e1e; border-radius: 24px; display: flex; 
justify-content: center;
    align-items: center; }


.txt_board{border-top: 2px solid #222222; }
.txt_board li{display: flex; gap:15px; padding: 15px 10px;
border-bottom: 1px solid #e9e9e9}
.txt_board li a.txt_title{
	font-size: 18px; word-break: keep-all; flex:1;
	display: -webkit-box;
  -webkit-line-clamp: 1; /* 줄 수 지정 */
  -webkit-box-orient: vertical;
  overflow: hidden; font-weight: 500
}
.txt_board li p.date{width: 110px; text-align: center; font-size: 16px; color: #999999 }




.main_board_slide_are{margin-top: 40px}


.main_board_silde .slick-slide{padding:0 8px }
.main_board_silde a{display: block}
.main_board_silde .thum{border: 1px solid #e9e9e9; overflow: hidden; display: block;
aspect-ratio: 16 / 8; margin-bottom: 25px; transition-duration: .5s}
.main_board_silde .thum img{width: 100%; height: 100%; object-fit: cover;}
.main_board_silde h4{font-size: 18px; color: #1a1a1a; transition-duration: .5s;
display: -webkit-box;
  -webkit-line-clamp: 1; /* 줄 수 지정 */
  -webkit-box-orient: vertical;
  overflow: hidden; ; font-weight: 500}
.main_board_silde p{color: #646464; font-size: 16px; display: -webkit-box;
  -webkit-line-clamp: 1; /* 줄 수 지정 */
  -webkit-box-orient: vertical;
  overflow: hidden; margin-top: 8px;}
.main_board_silde p.date{margin-top: 8px;
color: #828282; font-size: 12px;}

.main_board_silde a:hover .thum{border: 4px solid #d11e1e}
.main_board_silde a:hover h4{color: #d11e1e}

.main_board_silde .slick-dots{display: flex; margin-top: 35px; gap:8px;
justify-content: center;
    align-items: center;}

.main_board_silde .slick-dots button{width: 60px; height: 5px; background: #f1f1f1; font-size: 0; border: 0}

.main_board_silde .slick-dots .slick-active button{background: #d11e1e}


.fp-viewing-foot > #my-nav{transition-duration: .5s; opacity: 0}


.fp-viewing-foot .scroll_down{opacity: 0; transition-duration: .5s}





.footer_are{background: #111111}
.foot_info{padding: 60px 0; position: relative}
.foot_info h3{font-weight: 600; color: #fff; font-size: 20px;}
.foot_info .foot_link{display: flex; gap:30px; margin: 25px 0 20px; align-items: center;}
.foot_info .foot_link a{color: #646464; font-size: 16px; font-weight: bold}

.foot_info .foot_link a.contact_btn{color: #fff; background: #292929; 
border-radius: 1px; padding: 0px 13px; border: 1px solid #383838; line-height: 38px; height: 38px}

.foot_info p{display: flex; color: #fff; font-size: 16px; gap:14px; line-height: 28px}
.foot_info p b{color: #9f9f9f}

.foot_up{position: absolute; right: 0; top: 0; border-radius: 0 0 25px 25px; width: 110px; height: 110px; background: #292929; display: flex; align-items: center;
    justify-content: center; transition-duration: 1s}

.foot_up:hover{padding-bottom: 10px}

.foot_bottom{text-align: center; padding: 15px 25px; border-top: 1px solid #292929}
.foot_bottom p{font-size: 15px; color: #404040}




.fp-warning, .fp-watermark{display: none !important}


body.jpn *{word-break: break-all !important}