.sub_visual{ position: relative; height: 80vh; overflow: hidden; display: flex;     justify-content: center;
    align-items: center; margin-bottom: -80px}
.sub_visual .title_are{ text-align: center;}
.sub_visual .title_are .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%;  
  animation: subbg 3s linear;
  background-position: center; background-size: cover;
  z-index: -1
}

.sub_visual .title_are h2{color: #fff; font-size: 60px; }

@keyframes subbg {
  0% {
    scale:1.1
  }
  100% {
    scale:1
  }
}


.sub_visual .title_are .bg.bg01{background-image: url(../img/sub/subbg01.png)}
.sub_visual .title_are .bg.bg02{background-image: url(../img/sub/subbg02.png)}
.sub_visual .title_are .bg.bg03{background-image: url(../img/sub/subbg03.png)}
.sub_visual .title_are .bg.bg04{background-image: url(../img/sub/subbg04.png)}


.suv_nav_are{position: sticky; background: #fff; border-radius: 80px 80px 0 0; border-bottom: 1px solid #ddd;
left: 0; top: 0; width: 100%; transition-duration: .5s; z-index: 2}
.suv_nav_are.fixed{border-radius: 0; position: fixed; z-index: 3; bottom: auto; top: 0}
.suv_nav_are .sub_deps{display: flex; text-align: center;
    justify-content: center;
    align-items: center;}
.suv_nav_are .sub_deps a{height: 80px; padding: 0 30px; font-size: 18px; position: relative; display: flex;
    justify-content: center;
    align-items: center;}
.suv_nav_are .sub_deps a.on_sub{}
.suv_nav_are .sub_deps a:after{content: ''; position: absolute; left: 0; bottom: 0; width: 0%; height: 2px;
background:#DBB400; transition-duration: .5s}


.suv_nav_are.show{border-radius: 0}

.suv_nav_are .sub_deps a:hover:after, 
.suv_nav_are .sub_deps a.on_sub:after{width: 100%}


.sub_section{padding: 150px 0}


.ceo{background: url(../img/sub/ceo_bg.png); background-position: bottom center; background-repeat: no-repeat; background-size: 100%}
.ceo .inner{display: flex; gap:6rem;
    align-items: flex-start;
    justify-content: flex-start;}
.ceo .ceo_img{border-radius: 10px; overflow: hidden; width: 40%}
.ceo .ceo_img img{width: 100%}

.ceo .ceo_txt{flex:1; padding-top: 40px}
.ceo .ceo_txt h3{word-break: keep-all; font-size: 40px; color: #222; margin-bottom: 30px}

.ceo .ceo_txt p{font-size: 18px; word-break: keep-all; line-height: 1.5}
.ceo .ceo_txt p + p{margin-top: 20px}


.sub_title{}
.sub_title h4{font-weight: bold; color: #DBB400; font-size: 24px; margin-bottom: 10px}
.sub_title h2{font-size: 40px; line-height: 1.5; word-break: keep-all; color: #222}
.sub_title p{margin-top: 25px; font-size: 24px; word-break: keep-all; line-height: 1.5; color: #222}
.sub_title p b{color: #DBB400}


.sub_title .flex_date{display: flex; gap:25px}
.sub_title .flex_date p{font-size: 16px; display: flex; gap:10px}
.sub_title .flex_date p b{color: #222}
.sub_title .flex_date p span{color: #222; opacity: .7}

.history{
	background: url(../img/sub/history.png); background-position:  center; background-repeat: no-repeat; background-size: cover;
	padding: 150px 0 150px 8rem;
	display: flex;
}

.history .sub_title{width: 30%}
.history .sub_title h2{color: #fff}

.history .history_slide{width: 70%}

.history .slide_ct{margin-top: 60px}
.history .slide_ct span .prev{background-image: url(../img/common/prevw.png); }
.history .slide_ct span .next{background-image: url(../img/common/nextw.png); }


.history .history_slide .box{height: 250px; border-radius: 10px; border: 1px solid #fff; padding: 50px;
display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end; transition-duration: .5s; margin-top: 50px}
.history .history_slide .box h4{font-size: 24px; font-weight: bold; color: #fff}
.history .history_slide .box ul{margin-top: 25px;}
.history .history_slide .box ul li{display: flex; gap:15px; font-size: 18px; color: #fff;
justify-content: flex-start;
    align-items: flex-start;}
.history .history_slide .box ul li b{font-weight: bold; color: #DBB400}


.history .history_slide .slick-list{padding-right: 16rem}

.history .history_slide .slick-slide{padding: 0 15px; }


.history .history_slide .slick-slide.slick-current .box{margin-top: 0px}
.history .history_slide .slick-slide.slick-current + .slick-slide.slick-active + .slick-slide .box{margin-top: 0px}

.history .history_slide .slick-slide.slick-current .box,
.history .history_slide .box:hover{background: #fff}


.history .history_slide .slick-slide.slick-current .box h4,
.history .history_slide .box:hover h4{color: #222}


.history .history_slide .slick-slide.slick-current .box ul li,
.history .history_slide .box:hover ul li{color: #222}


.mission{padding: 150px 0}
.mission .inner{display: flex; gap:30px}
.mission .inner .left_box{width: 400px; border: 1px solid #ddd; border-radius: 10px; padding: 80px 40px;
display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;}



.mission .inner .mission_slide{width: calc(100% - 40px - 15px); overflow: hidden; border-radius: 10px; }
.mission .inner .mission_slide .slick-slide{max-height: 80vh; position: relative; overflow: hidden}
.mission .inner .mission_slide img{width: 100%;     height: 100%;
    object-fit: cover;}

.mission .inner .mission_slide h2{position: absolute; 
width: 100%; bottom: -25px; left: 0; color: #fff; font-weight: 900; 
text-align: center; font-size: 10rem; line-height: 1}


.mission .inner .left_box .mission_tab h2{color: #222; opacity: .5; font-size: 20px; transition-duration: .5s}

.mission .inner .left_box .mission_tab.eng h2{font-size: 16px}

.mission .inner .left_box .mission_tab .slick-slide{cursor: pointer; padding: 20px 0; transition-duration: .5s}

.mission .inner .left_box .mission_tab .slick-slide.slick-current h2{opacity: 1; }
.mission .inner .left_box .mission_tab .slick-slide:hover h2{opacity: 1;}

.location{}
.location .map{overflow: hidden; border-radius: 10px; margin-top: 30px;}
.location .map iframe{display: block; width: 100%}
.location .map_info{position: relative; margin-top: 30px;}
.location .map_info ul{display: flex; gap:20px 40px;
align-items: flex-start;
    flex-wrap: wrap;
    justify-content: flex-start}
.location .map_info ul li{display: flex; gap:15px; font-size: 18px; color: #222}
.location .map_info ul li.w100{width: 100%}
.location .map_info ul li b{color: #DFBB19}

.location .map_info .main_btn{position: absolute; right: 0; top: 0}



.rnd_flex{margin-top: 60px; display: flex; gap:30px;}
.rnd_flex .box{height: 45vh; border-radius: 10px; overflow: hidden; padding: 40px 50px;
 flex:1;
display: flex; 
justify-content: flex-start;
    align-items: flex-end; position: relative; background: #000 }

.rnd_flex .box:after{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%;
background-size: cover; z-index: 1; transition-duration: 1s; 
}

.rnd_flex .box:nth-child(1):after{background-image: url(../img/sub/rnd_flex01.png)}
.rnd_flex .box:nth-child(2):after{background-image: url(../img/sub/rnd_flex02.png)}
.rnd_flex .box:nth-child(3):after{background-image: url(../img/sub/rnd_flex03.png)}


.rnd_flex .box .txt{overflow: hidden; position: relative; z-index: 2}
.rnd_flex .box .txt h3{color: #fff; font-size: 24px}
.rnd_flex .box .txt p{font-size: 16px; color: #fff; word-break: keep-all; 
visibility: hidden; transition-duration: 1s; height: 0; max-height: 0; overflow: hidden}

.rnd_flex .box:hover .txt p{visibility: visible; height: auto; max-height: 300px; margin-top: 10px }
.rnd_flex .box:hover:after{scale:1.1; opacity: .8}

.sub_section.rndbg{padding-top: 0; background: url(../img/sub/rndbg.png); background-position: center bottom;
background-repeat: no-repeat; background-size: 100%}

.sub_section.rndbg .inner{display: flex;}

.sub_section.rndbg .sub_title{width: 35%}

.rnd_step{display: flex; flex-wrap: wrap; gap:30px; width: 65%}
.rnd_step .box{width: calc(50% - 15px); border: 1px solid #ddd; border-radius: 10px; padding: 40px}
.rnd_step .box h4{color: #DBB400; font-size: 20px; font-weight: bold; margin-bottom: 40px}
.rnd_step .box p{word-break: keep-all; line-height: 1.4; font-size: 18px; color: #222}

.rnd_step .box,
.rnd_step .box *{transition-duration: .5s}

.rnd_step .box:hover{background: #DBB400}
.rnd_step .box:hover h4,
.rnd_step .box:hover p{color: #fff}

.sub_section.notop{padding-top: 0}

.rnd3 .sub_title{position: relative; margin-bottom: 60px}
.rnd3 .sub_title .slide_ct{position: absolute; right: 0; top: 0}

.rnd_slide{margin: 0 -15px}
.rnd_slide img{width: 100%}
.rnd_slide .thum{border-radius: 10px; overflow: hidden; position: relative}

.rnd_slide .thum .txt{position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 50px; z-index: 2;
display: flex; justify-content: flex-start;
    align-items: flex-end;}
.rnd_slide .thum .txt p{color: #fff; font-size: 24px; font-weight: 700}

.rnd_slide .slick-slide{margin: 0 15px;}


.rnd_num .sub_title{margin-bottom: 80px}


.process_flex{display: flex; gap:30px;}

.process_flex + .process_flex{margin-top: 40px}
.process_flex .box{width: calc(50% - 15px); }

.process_flex .box .in_box{padding: 30px; 
border-radius: 10px;
border: 1px dashed #DBB400;
background: #F5F5F5;}

.process_flex .box h2{padding: 10px; border-radius: 10px; background: #DBB400; text-align: center;
color: #fff; font-size: 20px; margin-bottom: 20px }

.process_flex .box ul{display: flex; gap:20px;}
.process_flex .box ul li{width: calc(50% - 10px); text-align: center}
.process_flex .box ul li .thum{border-radius: 10px; overflow: hidden}
.process_flex .box ul li .thum img{width: 100%}
.process_flex .box ul li p{font-size: 18px; color: #111; margin-top: 20px;}


.process_flex .process_down{text-align: center; margin-top: 40px;}

.process_flex .box.w100{
width: 100%
}




.process_flex .box.w100 .in_box{ background: #fff; }


.process_flex.mid {justify-content: center;}
.process_flex.mid .box .in_box{ background: #fff; }
.process_flex.mid .box .in_box ul li{width: 100%}

.process_flex.mid .box{max-width: 600px}



.rnd_ink{background: url(../img/sub/rnd_ink.png); background-position: center bottom;
background-repeat: no-repeat; background-size: 100%}

.rnd_ink .inner{display: flex; align-items: flex-start;
    justify-content: space-between;}
.rnd_ink .inner .sub_title{padding-top: 50px}



.product_all{display: flex;}
.product_all .box{width: 50%; height: 100vh; display: flex; position: relative; text-align: center;
flex-direction: column;
    justify-content: center;
    align-items: center; background: #000}
.product_all .box h2{color: #fff; font-size: 60px; font-weight: 800; position: relative; z-index: 2}
.product_all .box .main_btn{margin-top: 0px; overflow: hidden; height: 0; visibility: hidden; transition-duration: .5s; z-index: 2; position: relative}
.product_all .box:hover .main_btn{margin-top: 50px; visibility: visible; height: 60px}
.product_all .box:after{content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; opacity: .8; transition-duration: .5s}
.product_all .box:hover:after{opacity: 1}

.product_all .box:first-child:after{background-image: url(../img/sub/product_bg01.png)}
.product_all .box:last-child:after{background-image: url(../img/sub/product_bg02.png)}



.sub_title + .tlb{margin-top: 50px}

.tlb + .tlb{margin-top: 50px;}

.tlb table{width: 100%; border-spacing: 0}
.tlb table th{background: #DBB400; font-size: 18px; color: #fff; text-align: center; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; word-break: keep-all; padding: 10px}
.tlb table th:last-child{border-right: 1px solid #ddd}



.tlb table td{background: #fff; font-size: 18px; color: #222; text-align: center; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; word-break: keep-all; padding: 10px}
.tlb table td:last-child{border-right: 1px solid #ddd}


.product_note{margin-top: 50px; border-radius: 10px; padding:50px; background: url(../img/sub/note_bg.png);
background-position: right; background-repeat: no-repeat;  border: 1px solid #ddd; background-size: cover}

.product_note h2{display: flex; font-size: 24px; word-break: keep-all; margin-bottom: 20px; gap:10px; color: #222;
justify-content: flex-start;
    align-items: center;}
.product_note p{font-size: 18px; word-break: keep-all; line-height: 1.5; color: #222}

p.tlb_note{font-size: 16px; font-weight: 400; margin-top: 20px; color: #222; }
p.tlb_note span{opacity: .5}
p.tlb_note b{opacity: 1}

.product_last{background: url(../img/sub/product_last.png); background-position: center; background-size: cover; text-align: center}
.product_last h2{color: #fff; font-size: 24px;}
.product_last p{margin-top: 20px; color: #fff; font-size: 18px; line-height: 1.5; word-break: keep-all}
.product_last a{margin-top: 50px; border-radius: 60px; height: 60px; display: inline-flex; background: #fff; color: #222; font-size:18px; 
justify-content: center;
    align-items: center; padding: 0 60px; font-weight: bold; transition-duration: .5s}

.product_last a:hover{color: #fff; background-color: #DBB400}



.product_02_flex{display: flex;  gap:30px; margin-top: 50px}
.product_02_flex .box{ border: 1px solid #ddd; border-radius: 10px; padding: 40px; flex:1}
.product_02_flex .box h4{color: #DBB400; font-size: 20px; font-weight: bold; margin-bottom: 40px}
.product_02_flex .box p{word-break: keep-all; line-height: 1.4; font-size: 18px; color: #222}

.product_02_flex .box,
.product_02_flex .box *{transition-duration: .5s}

.product_02_flex .box:hover{background: #DBB400}
.product_02_flex .box:hover h4,
.product_02_flex .box:hover p{color: #fff}


.flex_tlb{display: flex; gap:30px; margin-top: 50px}
.flex_tlb .box{text-align: center}
.flex_tlb .box .thum{border-radius: 10px; overflow: hidden}
.flex_tlb .box .thum img{max-width: 100%}

.flex_tlb .box h3{padding: 10px; border-radius: 10px; background: #DBB400; text-align: center;
color: #fff; font-size: 20px; margin-top: 10px }


.flex_tlb .tlb{flex:1}

.flex_tlb .tlb table{border-top: 1px solid #ddd}
.flex_tlb .tlb table td{padding: 22px 10px}

.flex_tlb .tlb table td.point{position: relative}
.flex_tlb .tlb table td.point:after{content: ''; background: rgba(219, 180, 0, 0.05); border-left: 3px solid #DBB400;
border-right: 3px solid #DBB400; position: absolute; left: 0; top: 0; width: 100%; height: 100%}



.flex_tlb .tlb table tr:first-child td.point:after{border-top: 3px solid #DBB400;}
.flex_tlb .tlb table tr:last-child td.point:after{border-bottom: 3px solid #DBB400;}





.form_in{margin-top: 60px;}
.form_in ul{display: flex; gap:30px 40px;flex-wrap: wrap}
.form_in ul li{width: calc(50% - 20px)}
.form_in ul li.w100{width: 100%}

.form_in ul li input,
.form_in ul li select{padding: 0 20px; line-height: 60px; 
font-size: 18px; word-break: keep-all; border: 1px solid #ddd; border-radius: 5px; width: 100%; height: 60px}

.form_in ul li textarea{padding: 20px; line-height: 150%; word-break: keep-all; 
font-size: 18px; width: 100%; height: 250px; border: 1px solid #ddd; border-radius: 5px;}

.form_in ul li input:placeholder,
.form_in ul li textarea:placeholder,{color: #666}
.form_in ul li label{font-size: 18px; color: #1d1d1b; font-weight: 700; display: block; margin-bottom: 10px;}
.form_in ul li label span{color: #DBB400}

.flex_input{display: flex; gap:20px; color: #999; font-size: 18px;justify-content: flex-start;
    align-items: center;}
.form_in ul li select{
	-o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url(../img/sub/drop.png) calc(100% - 20px) center no-repeat;;
}
.form_in ul li select::-ms-expand { display: none}


.file_are{display: flex; gap:20px; }
.file_are button{border-radius: 5px; height: 60px; line-height: 60px; text-align: center; padding: 0 45px; color: #fff; 
background: #1D1D1B; border:1px solid #1D1D1B; min-width: 155px; font-size: 18px}



.ck_agree{display: flex; gap:20px; margin-top: 30px;justify-content: flex-start;
    align-items: center;}
.ck_agree p{font-size: 18px}
.ck_agree p a{font-weight: bold}
.ck_agree input{width: 18px; height: 18px}

.iq_btn_are{margin-top: 80px; text-align: center}



.inq_btn{ border-radius: 60px; height: 60px; display: inline-flex; background: #f5f5f5; color: #222; font-size:18px; 
justify-content: center;
    align-items: center; padding: 0 60px; font-weight: bold; transition-duration: .5s; border: 0; }

.inq_btn p{font-size: 18px;color: #222; transition-duration: .5s}

.inq_btn:hover{color: #fff; background-color: #DBB400}
.inq_btn:hover p{color: #fff;}






/*board*/

.board_common_btn_list{margin-top: 80px}
.board_common_btn_list ul{display: flex; gap:10px;align-items: center;
    justify-content: flex-end;}
.board_common_btn_list a, .board_common_btn_list button{border: 1px solid #ddd; border-radius: 5px; background: #fff; font-size: 16px; 
padding: 0 15px; height: 40px; line-height: 40px; color: #333; display: inline-block; text-align: center}

.board_top_flex{display: flex; justify-content: space-between;
    align-items: flex-start; margin-bottom: 30px}

.total_board{}
.total_board p{font-size: 14px; color: #666}
.total_board p b{font-weight: bold; color: #222}

.search_board form{display: flex; gap:10px}
.search_board form select{background: #f5f5f5 url(../img/sub/drop_search.png); 
background-position: 90% center; background-repeat: no-repeat; background-size: 13px auto;
border-radius: 5px; padding: 0 20px; font-size: 15px; color: #666; height: 60px; line-height: 60px; border: 0;
-o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; position: relative}

.search_board form select::-ms-expand{ 
	display: none;
}

.search_board .sch_bar{background: #f5f5f5; border-radius: 5px; display: flex; overflow: hidden}
.search_board .sch_bar input{font-size: 15px; padding: 0 20px; line-height: 60px; border: 0; background: #f5f5f5}
.search_board .sch_bar button{padding: 0 20px; border: 0; background: #f5f5f5}


.board_tlb table{width: 100%; border-top:2px solid #20409A; border-spacing: 0 }
.board_tlb table td{font-size:18px; padding:35px 15px; border-bottom: 1px solid #ddd; font-weight: 500; color: #666 }
.board_tlb table td.empty_table{font-size: 1em;padding: 20px 0 !important;
    color: #666;
    text-align: center;}

.board_tlb table td.num{text-align: center; width: 80px; font-size: 15px; color: #999}
.board_tlb table td.num .notice_icon{color: #20409A}

.board_tlb table td.date{width: 170px;  }
.board_tlb table td.date p{font-size: 16px; color: #999; text-align: center;display: flex; gap:5px}
.board_tlb table td.down{text-align: center; width: 170px; font-size: 15px; color: #999}
.board_tlb table td a.flexa{display: flex; gap:10px}
.board_tlb table td .point{font-size: 14px; background:#FF8A00 ; padding:5px 10px ; border-radius: 3px; color: #fff}


.board_tlb .down_load{}

.board_tlb .down_load{display: inline-flex; gap:10px; justify-content: center;
    align-items: center; font-size: 16px; color: #fff; background: #18459D; padding: 15px 25px 15px 15px; border-radius: 100px}
.board_tlb .down_load i{background: #fff; width: 30px; height: 30px; display: flex; justify-content: center;
    align-items: center; border-radius: 30px}




.board_detail_content{border-top: 1px solid #ddd; padding: 50px 0; border-bottom: 1px solid #ddd; margin-top: 60px}
.board_view_btn{text-align: center; margin-top: 100px}



.gall_custom{margin-top: 60px}


.gall_list_style{display: flex; gap:40px 60px;    flex-wrap: wrap;}
.gall_list_style li{width: calc(33.33% - 40px)}
.gall_list_style li.empty_list{width: 100%}

.gall_list_style .gall_img{overflow: hidden; border-radius: 10px}
.gall_list_style .gall_img img{width: 100%; height: 100%;object-fit: cover;
    aspect-ratio: 16 / 9;}
    
.gall_list_style.certifications .gall_img img{aspect-ratio: 21 / 29;}
    
.gall_list_style.certifications li{width: calc(25% - 45px)}
    
.board_list_txt{margin-top: 25px}
.board_list_txt p{font-size: 16px; color: #aaa; margin-bottom: 10px}  
.board_list_txt h3{color: #010101; font-size: 18px; font-weight: bold;
word-break: keep-all;
display: -webkit-box;
  -webkit-line-clamp: 1; /* 줄 수를 2줄로 제한 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; }    


.gall_list_style.certifications .board_list_txt{text-align: center}
    
.if_video_are{max-width: 1024px; margin: 0 auto 50px}   



.gall_news_style{border-top: 2px solid #20409A}
.gall_news_style li{padding: 50px 40px; border-bottom: 1px solid #ddd}

.gall_news_style .gall_img{max-width: 200px; max-height: 200px; overflow: hidden}
.gall_news_style .gall_img img{    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 1;}

.gall_news_style .gall_con{display: flex; gap:50px;justify-content: flex-start;
    align-items: center;}
    
    
.board_list_txt2{}
.board_list_txt2 p{font-size: 16px; color: #1b1b1b; margin-top: 10px;
word-break: keep-all;
display: -webkit-box;
  -webkit-line-clamp: 2; /* 줄 수를 2줄로 제한 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; }  
.board_list_txt2 h3{color: #1B1B1B; font-size: 24px; font-weight: bold;
word-break: keep-all;
display: -webkit-box;
  -webkit-line-clamp: 1; /* 줄 수를 2줄로 제한 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; }    
    
.board_list_txt2 p.list_date{color: #666; margin-top: 50px}  
    
    
.board_detail_content .video-container {
  position:relative;
  height:0;
  padding-bottom:56.25%;
  overflow: hidden; border-radius: 5px
}

.board_detail_content .video-container iframe {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}


#bo_v_file li{padding: 25px 0; border: 0; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; box-shadow: none;
border-radius: 0}
#bo_v_file li a{display: flex; gap:20px; font-size: 18px}

#bo_v_file li i{float: none; margin: 0}
#bo_v_file li i img{margin: 0}

#bo_v_file li a strong{font-weight: 400}


.tlb table sub{
	font-size: 60%;
    vertical-align: text-bottom;
    margin-bottom: 10px
}