html {
  scroll-behavior: smooth;
}
*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


.f10{font-size: 10px}
.f11{font-size: 11px}
.f12{font-size: 12px}
.f13{font-size: 13px}
.f14{font-size: 14px}
.f15{font-size: 15px}
.f16{font-size: 16px}
.f16 .date {
    position: relative;
    bottom: -10px;
}
.f17{font-size: 17px}
.f18{font-size: 18px}
.f19{font-size: 19px}
.f20{font-size: 16px}
.f21{font-size: 21px}
.f22{font-size: 22px}
.f23{font-size: 23px}
.f24{font-size: 24px}
.f25{font-size: 25px}
.f26{font-size: 26px}
.f27{font-size: 27px}
.f28{font-size: 28px}
.f29{font-size: 29px}
.f30{font-size: 30px}
.f35{font-size: 35px}
.f40{font-size: 40px}
.f45{font-size: 45px}

.emt10{height: 10px}
.emt20{height: 20px}
.emt30{height: 30px}
.emt40{height: 40px}
.emt50{height: 50px}
.emt60{height: 60px}
.emt70{height: 70px}
.emt80{height: 80px}
.emt90{height: 90px}
.emt100{height: 100px}
.emt110{height: 110px}
.emt120{height: 120px}
.emt130{height: 130px}
.emt140{height: 140px}
.emt150{height: 150px}


.inner{ padding: 0 5rem;}
.inner2{ padding: 0 14rem;}

#fullpage {
  width:100%;
  height:100%;
}

/* header */


/* CUSTOM NAVIGATION */






.fp-watermark{display: none}



.section{overflow: hidden; position: relative}
.main_full{background: #fff}




/* main_banner */

#my-nav{position: fixed; left: 5rem; top: 50%; transform: translateY(-50%);}
#my-nav li{position: relative; display: flex; gap:4px; font-size: 12px; }
#my-nav li.active{border: 0px solid rgba(255,255,255,1); }
#my-nav li span{color: #BBB; font-weight: 900; text-transform: uppercase; transition-duration: .8s}
#my-nav li.active span{color: #005EAE}

#my-nav li .txt{display: none}
#my-nav li .plus{display: none}

#my-nav li.active .num{display: none}
#my-nav li.active .plus{display: block}
#my-nav li.active .txt{display: block}


#my-nav li + li{padding-top: 22px; margin-top: 22px;}
#my-nav li + li:after{content: ''; width: 17px; height: 1px; background: #DEDEDE; position: absolute; left: 0; top: 0}











/* foot */

.in_pdiing{padding: 20px}

.footer{
	padding: 80px 0; background: #272727;
	border-radius: 30px
}

.foot_flex{display: flex; justify-content: space-between;
    align-items: stretch;}

.foot_flex .left{display: flex;
flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;}

.foot_sns{}
.foot_sns p{color: #bbb; font-size: 14px; word-break: keep-all; line-height: 150%}
.foot_sns p b{display: block; margin-bottom: 10px;}
.foot_sns .sns_flex{margin-top: 25px; display: flex; gap:7px}
.foot_sns .sns_flex a{}

.foot_flex .right{}

.foot_nav{display: flex;}
.foot_nav li{width: 156px;}
.foot_nav li a{display: block; font-size: 16px; line-height: 150%; word-break: keep-all; color: #fff; opacity: .3; transition-duration: .8s; word-break: keep-all; overflow-wrap: break-word}
.foot_nav li a + a{margin-top: 5px;}
.foot_nav li a:hover{opacity: 1; text-decoration: underline}
.foot_nav li .foot_nav_list{margin: 10px}
.foot_nav li h4{color: #fff; font-size: 18px; font-weight: 500; line-height: 150%; word-break: keep-all; margin: 10px}


.foot_info{padding-top: 20px; margin-top: 40px; border-top: 1px solid rgba(255, 255, 255, 0.10); display: flex; gap:60px; align-items: center;}
.foot_info li a{display: flex; align-items: center; gap:14px; font-size: 16px; color: #fff}


.foot_info li i{width: 60px; height: 60px; 
border: 1px solid rgba(255, 255, 255, 0.30);
background: #272727; display: flex;
justify-content: center;
align-items: center; border-radius: 60px}

.foot_info li:last-child i{background: #005EAE; border-color: #005EAE}
.foot_info li:last-child a {color: #005EAE; font-weight: 700}

/* header */


.header{position: fixed; left: 0; top: 0; width: 100%; 
height: 100px; z-index: 9999;  transition-duration: .5s}
.header-main{
    background-color: transparent;
}
.header-sub{
    background-color: #fff;
    height: 130px;
}
.header .inner{position: relative;display: flex;
justify-content: space-between;
    align-items: center; height: 150px}

.header .left{display: flex; gap:15px; align-items: center;}
.header .right{display: flex; gap:50px; align-items: center;}

.header .logo{ width: 159px; height: 29px; background: url(../img/new/logow.png); 
background-size: 100% auto; 
background-repeat: no-repeat; position: relative}


.header .remote{position: relative;  padding: 10px 18px; border-radius: 70px;
display: inline-flex; background: rgba(255, 255, 255, 0.10); gap:10px; font-size: 14px; color: #111;     align-items: center; }
.header .remote i{width: 14px; height: 14px; background: url(../img/new/remotew.png); 
background-size: 100% auto; 
background-repeat: no-repeat}

.header .remote span{color: #fff; font-weight: 600}


.header .nav_btn{position: relative; border-radius: 60px;  display: flex;
width: 60px; height: 60px;justify-content: center;
    align-items: center; background: #005EAE}
    
    
.header .nav_btn i{width: 21px; height: 9px; position: relative; display: inline-block}    
    
.header .nav_btn span{width: 100%; height: 2px; background: #fff; position: absolute; left: 0; top: 0; transition-duration: .5s}

.header .nav_btn span:nth-child(2){top: auto; bottom: 0; width: 80%; left: auto; right: 0}

.header .top_right{position: relative;  display: flex; gap:5px; }

.header .top_search{width: 60px; height: 60px; border-radius: 60px; ;
background: rgba(255, 255, 255, 0.10);
justify-content: center;
    align-items: center; display: flex;}

.header .top_search a{width: 19px; height: 19px; display: inline-block; background: url(../img/new/top_search.png);
background-position: center; background-repeat: no-repeat; background-size: 100%; auto}

.header .lang_top{position: relative;
width: 60px; height: 60px; border-radius: 60px; ;
justify-content: center;
    align-items: center; display: flex; background: rgba(255, 255, 255, 0.10); }
.header .lang_top a{width: 19px; height: 19px; display: inline-block; background: url(../img/new/lang.png);
background-position: center; background-repeat: no-repeat; background-size: 100%; auto}

.header .lang_top .lang_list{position: absolute; top: calc(100% + 5px); 
padding: 15px; background: #fff; border-radius: 5px; border: 1px solid #666; text-align: center;
width: max-content;
    left: 50%;
    transform: translateX(-50%); transition-duration: .8s; display: none}
.header .lang_top .lang_list a{font-size: 14px; display: block; width: auto;height: auto}
.header .lang_top .lang_list a + a{margin-top: 5px}

.header .lang_top .lang_list a.atv{color: #005EAE}
.header .lang_top .lang_list.on{display: block}

.top_nav{display: flex; align-items: flex-start;
    justify-content: center; gap:60px;}
    
.top_nav li{height: 60px; display: flex; text-align: center; justify-content: center;
    align-items: center; position: relative; }    
.top_nav li a.deps_big{color: #fff; font-size: 18px; transition-duration: .8s}
.top_nav li:hover a.deps_big{color: #0059FF;  }

.top_nav li .deps_nav{position: absolute; top: 100%; background: #fff; padding:0 15px; width: max-content;
    min-width: 150px; height: 0; max-height: 0; visibility: hidden; overflow: hidden; transition-duration: .5s; border-radius: 5px;
    border: 1px solid #111; text-align: left}
.top_nav li .deps_nav a{font-size: 16px; color: #434343; transition-duration: .5s; display: block; padding: 10px 0}
.top_nav li .deps_nav a:hover{color: #005EAE;  }
.top_nav li .deps_nav a + a{margin-top: 0px; border-top: 1px solid #efefef}

.top_nav li:hover .deps_nav{height: auto; max-height: 500px; visibility: visible; padding: 12px 15px; box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.10);
 transition-duration: .8s; }








.all_nav{position: fixed; left: 0; top:-100%; width: 100%; height: 100%; z-index: 9996; background: rgba(0,0,0,0.8); 
display: flex; align-items: center; transition-duration: .5s; opacity: 0;
justify-content: flex-start; padding: 0 10rem
    }
.nav_full{display: flex; gap:50px; justify-content: center;
    align-items: flex-start; flex-direction: column;}
.nav_full li{display: flex; gap:80px; align-items: center}    
.nav_full a.deps_big{font-size: 40px; color: #fff; font-weight: bold; display: block; width: 150px; transition-duration: .8s}
.nav_full li:hover a.deps_big{color: #005EAE}
.nav_full .deps_nav{display: flex; gap:10px 40px; align-items: center; flex:1;     flex-wrap: wrap;}
.nav_full .deps_nav a{font-size: 18px; color: #fff; line-height: 1.5; word-break: keep-all; display: block; transition-duration: .5s; opacity: .6 }
.nav_full .deps_nav a:hover{opacity: 1}

.mo_open{display: none}
.mo_nav_are{display: none}


.open_all .header .nav_btn span{background: #fff}
.open_all .header .lang_top a{background-image: url(../img/new/lang.png)}

.open_all .all_nav{top: 0; opacity: 1}
.open_all .top_nav{visibility: hidden}

.open_all .header .nav_btn span:nth-child(1){top: 50%;
        transform: translateY(-50%) rotate(45deg);}

.open_all .header .nav_btn span:nth-child(2){bottom: 50%;
        transform: translateY(50%) rotate(-45deg); width: 100%; left: 0; right: auto}

.open_all .header{background: transparent; border-bottom: 0}
.open_all .header .logo{background-image: url(../img/new/logow.png);}


.open_all .header .lang_top,
.open_all .header .top_search,{ background: rgba(255, 255, 255, 0.10)}
.fp-viewing-main .header .lang_top,
.fp-viewing-main .header .top_search,
.fp-viewing-gallery .header .lang_top,
.fp-viewing-gallery .header .top_search{background: #111}


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

.fp-viewing-main .header .remote,
.fp-viewing-gallery .header .remote{background: #F2F2F2}

.fp-viewing-main .header .remote i,
.fp-viewing-gallery .header .remote i{background-image: url(../img/new/remote.png);}

.fp-viewing-main .header .remote span,
.fp-viewing-gallery .header .remote span{color: #111}

.fp-viewing-main .top_nav li a.deps_big,
.fp-viewing-gallery .top_nav li a.deps_big{color: #111}



.fp-viewing-foot > #my-nav,
.fp-viewing-foot > .header{display: none}








.scrolldown {
    position: absolute;
    bottom: 45px;
    left: 50%;
    z-index: 2;
    text-align: center;
    transform: translateX(-50%); 
}

.scrolldown .mouse{width: 18px; height: 26px; position: relative; display: inline-block; 
border-radius: 40px;
border: 1.5px solid #111; }


.scrolldown .mouse i{
	width: 1.5px; height: 7px; background: #111; position: absolute; left: 50%; top: 5px;
	animation: move-box 2s infinite;
transform: translateX(-50%); 
}


.scrolldown.white .mouse{border-color: #fff}
.scrolldown.white .mouse i{background: #fff}
.scrolldown.white p{color: #fff}

.scrolldown p{color: #111; font-size: 12px; word-break: keep-all; margin-top: 12px}






@keyframes move-box {
    0% {
        top: 5px
    }
    100% {
        top: 50%
    }
}







.main_intro{height: 100vh; position: relative; }
.main_intro_img{text-align: center; position: relative; max-width: 100%; margin-top: 100px; }
.main_intro_img img{max-width: 100%}

.main_intro_img .btn_are{}
.main_intro_img .btn_are a{position: absolute; 
/*background: linear-gradient(304deg,rgba(75, 67, 237, 0.3) 0%,  0%, rgba(140, 136, 299, 0.3) 100%);*/
background:rgba(220,219,250,100);
box-shadow:2px 2px 5px 1px rgba(220,219,250,0.8);
border-radius: 15px; display: flex; gap:15px; font-size: 18px; color: #111; word-break: keep-all;
padding: 5px;
    align-items: center; font-weight: bold; padding-right: 15px;
    z-index: 2
}
.main_intro_img .btn_are a i{width: 50px; height: 50px; border-radius: 20px; 
display: flex; background: #fff;
    align-items: center;
        justify-content: center;
		box-shadow:1px 1px 5px 1px rgba(103,103,225,0.3);
}

.main_intro_img .btn_are a i img{max-width: 40px}

.main_intro_img .btn_are .top a:nth-child(1){left: 20%; top: 20%}
.main_intro_img .btn_are .top a:nth-child(2){left: 45%; top: 8%}
.main_intro_img .btn_are .top a:nth-child(3){left: 50%; top: 20%}
.main_intro_img .btn_are .top a:nth-child(4){left: 70%; top: 30%}

.main_intro_img .btn_are .bottom a:nth-child(1){left: 10%; top: 62%}
.main_intro_img .btn_are .bottom a:nth-child(2){left: 25%; top: 75%}
.main_intro_img .btn_are .bottom a:nth-child(3){left: 70%; top: 73%}




.view_ct{position: absolute; right: 0; bottom: 90px;}
.view_ct a{display: block; width: 110px; 
border-radius: 5px 0 0 5px;
background: #F2F2F2; padding: 14px; color: #939393; font-weight: 800; font-size: 14px; word-break: keep-all; transition-duration: .8s}
.view_ct a + a{margin-top: 7px;}

.view_ct a:hover{color: #fff; background-color:#005EAE }




.main_product{background: #101C27; 
}

.main_product_are{
	height: 100vh;
display: flex;
justify-content: center;
    align-items: center;
    width: 100%;
    overflow: hidden;
    position: relative
}

.main_product .inner{width: 100%; padding: 0 5rem;     box-sizing: border-box;}

.main_product:after{content: '';
	background: #fff; opacity: 0.03;
	border-radius: 0 20px 20px 0;
	height: 37vh; 
	position: absolute;
	left: 0; top: 50%;
	width: calc(100% - 5rem);
	    transform: translateY(-50%);
}

.thum_big_slide_are{width: 100%; z-index: 2; position: relative;  overflow: hidden;}




.thum_big_slide .box{display: flex; gap:30px;
    align-items: center;
    justify-content: center;  position: relative;  width: 100%}




.thum_big_slide .box .thum{flex:1; display: flex;
align-items: center;
    justify-content: flex-end;}
.thum_big_slide .box .thum img{max-width: 100%}
.thum_big_slide .box .txt{flex:1; position: relative; height: 37vh;
display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;}
    
.thum_big_slide .box .txt h3{margin-bottom: 15px; font-size: 20px; color: #fff; font-weight: bold; word-break: keep-all; line-height: 150%}
.thum_big_slide .box .txt h2{font-size: 60px; word-break: keep-all; line-height: 150%; font-weight: 800; color: #fff}
.thum_big_slide .box .txt p{color: #fff; font-size: 17px; line-height: 150%; word-break: keep-all; margin-top: 35px; opacity: .8}


.thum_big_slide .product_more{gap:37px; font-size: 14px; color: #fff; word-break: keep-all; font-weight: 700; padding: 23px 29px;
border-radius: 10px 0; background: #005EAE; display: inline-flex;
position: absolute; right: 0; bottom: 0; align-items: center;
}

.thum_small_slide_are{width: 380px; position: absolute; right: 5rem; bottom: 50px; z-index: 3}
.thum_small_slide{}

.thum_small_slide img{max-width: 100%}
.thum_small_slide .thum{border: 1px solid rgba(255,255,255,0.1); border-radius: 10px;
padding: 10px;
    aspect-ratio: 1; transition-duration: .8s}

.thum_small_slide .slick-slide{padding: 10px; text-align: center; cursor: pointer}

.thum_small_slide .slick-slide.slick-current .thum{border-color: #fff}


.thum_small_slide p{margin-top: 12px; color: #fff; opacity: 0.2; font-size: 14px; font-weight: 700; line-height: 150%; word-break: keep-all; transition-duration: .8s}
.thum_small_slide .slick-slide.slick-current p{opacity: 1}


.main_search{height: 100vh; overflow: hidden}
.main_search_are{border-radius: 30px;
background: url(../img/new/main/main_search_are.png); background-position: center; background-repeat: no-repeat;
height: calc(100vh - 40px); background-size: cover;
display: flex; 
flex-direction: column;
    align-items: center;
    justify-content: center;
}


.main_title{margin-bottom: 30px; position: relative}
.main_title img{max-width: 100%; display: inline-block}
.main_title h2{color: #111; line-height: 120%; font-size: 44px; word-break: keep-all; margin-top: 8px;
text-transform: uppercase}
.main_title.center{text-align: center}

.more_btn_title{position: absolute; right: 0; bottom: 0; display: flex; gap:10px;  align-items: center; color: #111; font-size: 14px; font-weight: bold}

.main_search_are .main_title h2{color: #fff}

.search_in{display: flex; border: 2px solid #fff; border-radius: 75px; height: 75px; width: 100%; max-width: 800px;
overflow: hidden}
.search_in input{flex:1; padding: 0 30px; height: 75px; line-height: 75px; word-break: keep-all; color: #fff;
    background: transparent;
    border: 0;
    font-size: 18px;}

.search_in button{width: 75px; height: 75px;
    background: transparent;
    border: 0; display: flex; justify-content: center;
    align-items: center;}



.flex_search{display: flex; width: 100%; max-width: 1540px; margin-top: 60px; }
.flex_search a{flex:1; gap:25px; padding: 25px 0; display: block; border-radius: 20px; transition-duration: .8s;    box-sizing: border-box;}
.flex_search a:hover{background: #005EAE;
backdrop-filter: blur(92px); }

.flex_search a .in_box{padding: 0 25px}

.flex_search a + a .in_box{border-left: 1px solid rgba(255,255,255,0.1); }


.flex_search a .icon{max-width: 100%; margin-bottom: 40px}
.flex_search a h3{color: #fff; word-break: keep-all; font-size: 20px; font-weight: 800}
.flex_search a p{margin-top: 3px; font-size: 16px; word-break: keep-all; color: #fff; opacity: 0.6}
.flex_search a i{margin-top: 25px; width: 45px; height: 45px; border-radius: 45px;
background: rgba(255, 255, 255, 0.06); 
display: flex; justify-content: center;
    align-items: center;}
.flex_search a i img{max-width: 100%}



.flex_search a:nth-child(4) .icon{margin-bottom: 14px}











.main_board{
	background: #F4F4F4;
}

.main_board .main_board_are{ padding: 0 0 0 14rem; width: 100%;box-sizing:border-box;}
.main_board_slide{width: 100%; margin: 0 -15px}
.main_board_slide_are{overflow: hidden; }


.main_board_slide .slick-list{padding-right: 14rem}

.main_board_slide a{background: #fff; padding:16px 15px; border-radius: 20px; display: block; transition-duration: .8s}

.main_board_slide a.end{opacity: 0.6}

.main_board .fp-overflow{overflow-x:hidden;}

.main_board_slide a .thum{display: block; border-radius: 15px; overflow: hidden;    box-sizing: border-box;}
.main_board_slide a .thum img{width: 100%; height: 100%;
object-fit: cover;
    aspect-ratio: 77 / 43;    box-sizing: border-box;}

.main_board_slide a.end *{opacity: 0.6}


.main_board_slide .slick-slide{padding: 0 15px}

.main_board_slide .txt{padding: 0 15px; margin-top: 15px; min-height: 72px;}

.main_board_slide .txt h3{
	display: -webkit-box;
  -webkit-line-clamp: 2; /* 줄 수를 2줄로 제한 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; 
  font-size: 18px; font-weight: 600; color: #111; line-height: 150%; word-break: keep-all
}


.main_board_slide .txt p{
	display: -webkit-box;
  -webkit-line-clamp: 1; /* 줄 수를 2줄로 제한 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; 
  margin-top: 8px;
  font-size: 13px; word-break: keep-all; color: #005EAE; font-weight: 600
}

.main_board_slide .last{border-top: 1px dashed #DEDEDE; padding-top: 15px; display: flex; align-items: center;
    justify-content: space-between; margin-top: 15px}
.main_board_slide .last p{font-size: 13px; color:#B8B8B8; font-weight: 600; word-break: keep-all }
.main_board_slide .last .tag{display: inline-block; color: #fff; font-size: 12px; font-weight: 600; word-break: keep-all; padding: 6px 14px;
background: #111; border-radius: 30px}

.main_board_slide .last_in{padding: 0 15px}



.main_slide_ct{margin-top: 34px; display: flex; gap: 30px;     align-items: center;}
.main_slide_ct i{width: 1px; height: 14px; background: #BBBBBB; display: inline-block}
.main_slide_ct p{cursor: pointer; display: inline-flex; gap:10px; font-size: 14px; color: #111; word-break: keep-all;     align-items: center;}
























/*pop*/

.agree_pop{display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; background: rgba(0,0,0,0.5)}
.agree_pop.atv_pop{display: block}

.agree_pop_content{position: absolute; left: 50%;
  top: 50%; background: #fff; padding: 60px; border-radius: 20px;
  transform: translate(-50%, -50%); width: 100%; max-width: 900px}



.agree_pop_content .agree_title{position: relative; }

.agree_pop_content .agree_title h2{font-size: 25px;}
.agree_pop_content .agree_title .close_pop{position: absolute; right: 0; top: 0; cursor: pointer}

.agree_pop_info{max-height: 400px; overflow-y: auto; margin-top: 15px; padding: 15px 0; border-top: 1px solid #ddd}
.agree_pop_info h3{font-size: 18px; font-weight: bold; word-break: keep-all; margin-bottom: 10px}
.agree_pop_info p{font-size: 16px; font-weight: 400; word-break: keep-all}
.agree_pop_info p + h3{margin-top: 30px}