.sub_visual{height: 450px; background-position: center; background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end; padding-bottom: 90px;}
    
.sub_visual .inner{width: 100%}    
    
.sub_visual.bg01{background-image: url(../img/sub/bg01.png)}
.sub_visual.bg02{background-image: url(../img/sub/bg02.png)}
.sub_visual.bg03{background-image: url(../img/sub/bg03.png)}
.sub_visual.bg04{background-image: url(../img/sub/bg04.png)}

.sub_visual p{font-size: 16px; font-weight: bold; color: #fff}
.sub_visual h2{font-size: 42px; font-weight: bold; color: #fff; margin-top: 10px; text-transform: uppercase}
.sub_visual .sub_visual_nav{display: flex; gap:15px; margin-top: 50px;justify-content: flex-start;
    align-items: center;}
.sub_visual .sub_visual_nav li{font-size: 16px; color: #fff}
.sub_visual .sub_visual_nav li i{width: 4px; height: 4px; background: #fff; border-radius: 4px; display: block}



.sub_are{padding: 150px 0}
.sub_are.notop{padding-top: 0}
.sub_are.nobottm{padding-bottom: 0}
.ceo{display: flex; align-items: flex-start;
    justify-content: space-between; gap:50px}
.ceo .txt{flex:1}
.ceo .txt h2{color:#1a1a1a; font-size: 42px; line-height: 1.5; word-break: keep-all; margin-bottom: 40px; font-weight: 400}
.ceo .txt h2 b{font-weight: bold; }
.ceo .txt p{color:#1a1a1a; font-size: 18px; line-height: 1.6; word-break: keep-all;  }
.ceo .txt p + p{margin-top: 15px;}
.ceo .txt .sign_ceo{display: flex; margin-top: 80px; gap:15px;
    align-items: center;
    justify-content: flex-end; }
.ceo .txt .sign_ceo h3{font-size: 22px; color:#1a1a1a ; font-weight: 500}

.ceo .thum{border-radius: 0px 40px 0px 0px;
/* drop */
box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15); overflow: hidden; width:max-content }
.ceo .thum img{max-width: 100%; }





.sub_title{margin-bottom: 70px; position: relative}
.sub_title h2{color: #1a1a1a; font-size: 42px; font-weight: 400; word-break: keep-all}
.sub_title h2 b{font-weight: bold}
.sub_title h2 b.color{color: #153985}
.sub_title p{margin-top: 15px; font-size: 18px; line-height: 1.5; color: #1a1a1a; word-break: keep-all}
.sub_title p.date{color: #999}

.sub_title h3{color: #1a1a1a; font-size: 30px; font-weight: 400; word-break: keep-all;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;}
.sub_title h3 b{font-weight: bold}
.sub_title h3 b.color{color: #153985}

ul.dist{}
ul.dist li{font-size: 18px; line-height: 1.5; word-break: keep-all; padding-left: 15px; color: #1a1a1a; position: relative}
ul.dist li:after{content: '·'; position: absolute; left: 0; top: 0}

.management{}
.management .box{padding-left: 50%; position: relative; border-radius: 400px; 
overflow: hidden; height: 240px; border: 1px solid #ddd; width: 90%}
.management .box .txt{display: flex; gap:50px;  justify-content: flex-start;
    align-items: center; padding-left: 0px; height: 100%; padding-right: 25px}
.management .box .txt h3{font-size: 24px; font-weight: bold; }
.management .box .txt *{transition-duration: 1s}
.management .box .thum{position: absolute; width: 50%; left: 0; top: 0;
 height: 100%; border-radius: 300px; overflow: hidden; transition-duration: 1s; z-index: -1}
.management .box .thum img{width: 100%; height: 100%; object-fit: cover;}

.management .box:hover .thum{width: 100%}

.management .box:hover .txt *{color: #fff}

.management .box + .box{margin-top: 30px;}


.management .box:nth-child(2){ margin: 30px 0 0 auto; padding-left: 0; padding-right: 50%;}
.management .box:nth-child(2) .thum{left: auto; right: 0 }
.management .box:nth-child(2) .txt{padding-left: 100px}


.management_flex{display: flex; margin-top: 150px; justify-content: space-between;
    align-items: center; gap:50px}
.management_flex .left h3{font-size: 24px; color: #153985; font-weight: bold; line-height: 1.5; word-break: keep-all}
.management_flex .left p{margin-top: 15px; font-size: 18px; line-height: 1.5; color: #1a1a1a; word-break: keep-all}


.management_flex .right{display: flex; gap:16px;flex-wrap: wrap; max-width: 675px; width: 100%}
.management_flex .right .box{padding: 100px 25px; width: calc(50% - 8px); border: 1px solid #ddd; 
text-align: center; transition-duration: 1s;
    display: flex;
    justify-content: center;
    align-items: center}
.management_flex .right .box p{font-size: 20px; line-height: 1.4; word-break: keep-all; 
color: #1A1A1A; font-weight: bold; transition-duration: 1s}

.management_flex .right .box:hover{scale:1.05; background: #153985; 
border-color: #153985; border-radius: 20px 0 20px 0; box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);}
.management_flex .right .box:hover p{color: #fff}



.history{display: flex; align-items: flex-start;
    justify-content: flex-start;}
.history *{transition-duration: 1s}

.history .left{width: 300px;position: sticky;
    top: 120px;
    left: 0;}
.history .left a{display: block; font-size: 20px; font-weight: 600; color: #999}
.history .left a + a{margin-top: 15px;}

.history .right{flex:1; }
.history .right .box{display: flex; gap:60px}
.history .right .box + .box{padding-top: 60px; margin-top: 60px; border-top: 1px solid #ddd}
.history .right .box h2{font-size: 44px; font-weight: bold; color: #ddd; width: 270px}
.history .right .box .list{flex:1}
.history .right .box p{display: flex; font-size: 18px; color: #ddd; line-height: 1.5; word-break: keep-all; gap: 30px;}
.history .right .box p i{font-weight: bold; text-decoration: none; font-style: normal; width: 80px; color: #ddd}

.history .right p + p{margin-top: 20px;}

.history .right p + .thum{margin-top: 20px;}
.history .right .thum + p{margin-top: 20px;}

.history .right .thum {border: 1px solid #ddd; border-radius: 20px 0 20px 0; overflow: hidden; display: inline-block}
.history .right .thum img{max-width: 100%; }

.history .left a.on_h{color: #1A1A1A}
.history .left a.on_h b{color: #153985}

.history .right .box.show h2{color: #153985}
.history .right .box.show p{color: #1A1A1A}
.history .right .box.show p i{color: #999999}



.location{}
.location .map{overflow: hidden; border-radius: 20px 0 20px 0; border: 1px solid #ddd}
.location .map iframe{width: 100%; display: block}

.location .txt{margin-top: 50px; position: relative}
.location .txt h3{color: #1a1a1a; font-size: 30px; font-weight: bold}
.location .txt ul{display: flex; margin-top: 30px; gap:10px 50px;    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;}
.location .txt ul li{display: flex; gap:20px;     justify-content: flex-start;
    align-items: center; color: #1a1a1a; font-size: 18px; line-height: 1.5; word-break: keep-all}
.location .txt ul li.w100{width: 100%}

.location .txt .kakao{padding: 18px 30px; border-radius: 20px 0px;
background: #1a1a1a;
box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15); display: flex; gap:15px; position: absolute; right: 0; top: 0;
justify-content: center;
    align-items: center;}


.location .txt .kakao a{color: #fff; font-size: 16px; word-break: keep-all}
.location .txt .kakao i{height: 10px; width: 1px ; background: #fff; opacity: .2}



.ci_are{display: flex; gap:80px; margin-bottom: 100px;}
.ci_are .thum{border: 1px solid #ddd; border-radius: 20px 0 20px 0; width: 500px; height: 330px;     display: flex;
    justify-content: center;
    align-items: center;}

.ci_are .txt{flex:1}
.ci_are .txt h3{font-size: 30px; font-weight: bold; color: #1a1a1a; line-height: 1.5; word-break: keep-all}
.ci_are .txt p{font-size: 18px; line-height: 1.5; word-break: keep-all; margin: 30px 0 50px}
.ci_are .txt a.down_btn{display: inline-flex; font-size: 18px; color: #999; 
border: 1px solid #ddd; padding: 15px 25px; gap:50px; justify-content: flex-start;
    align-items: center; transition-duration: .5s}


.ci_are .txt a.down_btn:hover{border-color: #153985; color: #153985;
box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);}

.ci_flex{display: flex; gap: 30px;}
.ci_flex .box{height: 350px; flex:1; padding: 60px;    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;}

.ci_flex .box h3{color: #fff; font-size: 24px}
.ci_flex .box p{font-size: 18px; line-height: 1.5; word-break: keep-all; color: #fff; display: flex; gap:10px;justify-content: flex-end;
    align-items: center;}
.ci_flex .box p + p{margin-top: 5px;}

.ci_flex .box .txt{text-align: right; width: 100%}



.bu_flex{display: flex; gap:40px;}
.bu_flex .box{flex:1; border: 1px solid #ddd; border-radius: 20px 0 20px 0;
 padding: 50px; text-align: center}
.bu_flex .box p{font-size: 18px; line-height: 1.5; word-break: keep-all; margin-top: 50px;}
.bu_flex .box img{max-width: 100%; display: block; margin: 0 auto}


.notice_p{border: 1px solid #ddd; border-radius: 20px 0 20px 0; padding: 50px;background: #f9f9f9; margin-top: 50px; }

.notice_p h3{display: flex; gap:10px; color: #153985; font-size: 18px;     justify-content: flex-start;
    align-items: center;}
.notice_p p{font-size: 18px; line-height: 1.5; word-break: keep-all; margin-top: 10px;}



.sub_title_small{margin: 60px 0 50px;}
.sub_title_small h2{font-size: 30px; font-weight: bold; line-height: 1.5; word-break: keep-all}
.sub_title_small.top100{margin-top: 100px}

.ink_flex{display: flex; gap:40px;}
.ink_flex{flex:1;  text-align: center}
.ink_flex .thum{border: 1px solid #ddd; border-radius: 20px 0 20px 0; overflow: hidden}
.ink_flex .thum img{max-width: 100%; }
.ink_flex p{font-size: 18px; line-height: 1.5; word-break: keep-all; margin-top: 20px;}

.bu_slide{margin: 0 -20px;}
.bu_slide img{display: block; width: 100%; height: 100%; object-fit: cover;}
.bu_slide .box{position: relative; border: 1px solid #ddd; border-radius: 20px 0 20px 0; padding: 50px; z-index: 2;
height: 450px; overflow: hidden;
display: flex;
    justify-content: flex-start;
    align-items: flex-end;}
.bu_slide .box p{font-size: 18px; line-height: 1.5; word-break: keep-all; color: #fff}
.bu_slide .box .bg{position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1}


.bu_slide .slick-slide{padding: 0 20px;}


.sub_title .cont_slide{position: absolute; right: 0; bottom: 0}


.partner_flex{}
.partner_flex ul{display: flex;gap:40px; flex-wrap: wrap;}
.partner_flex ul li{width: calc(25% - 30px); text-align: center}
.partner_flex ul li .thum{height: 200px; border: 1px solid #ddd; 
border-radius: 20px 0 20px 0; transition-duration: 1s;
    display: flex;
    justify-content: center;
    align-items: center;}
.partner_flex ul li .thum:hover{border: 2px solid #153985; box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);}
.partner_flex ul li p{font-size: 18px; line-height: 1.5; word-break: keep-all; color: #1a1a1a; margin-top: 20px; font-weight: bold}






.sub_are .product_nav{display: flex; gap:20px; margin-bottom: 100px}
.sub_are .product_nav a{height: 55px; text-align: center; 
border: 1px solid #ddd; font-size: 16px; line-height: 53px; word-break: keep-all; font-size: 16px;  padding: 0 50px; transition-duration: 1s}

.sub_are .product_nav a.on_nav, 
.sub_are .product_nav a:hover{background: #153985; box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15); 
border-radius: 20px 0 20px 0; border-color: #153985; color: #fff}

.product_are{display: flex; gap:150px; }
.product_are .p_slide_are{width: 700px; }

.big_slide{}
.big_slide .box{overflow: hidden; border-radius: 20px 0 20px 0; border: 1px solid #ddd}
.big_slide .box img{width: 100%}

.small_slide{margin: 10px -10px 0}
.small_slide .box{border-radius: 10px; overflow: hidden; transition-duration: .5s; border: 1px solid #ddd; }
.small_slide .box img{width: 100%}

.small_slide .slick-slide{padding: 10px; cursor: pointer}



.small_slide .slick-slide.slick-current .box{border: 2px solid var(--Main, #153985);
/* drop */
box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);}


.p_info{padding-top: 60px}

.p_info_title h3{font-size: 16px; margin-bottom: 5px; color: #153985}
.p_info_title h2{font-size: 42px; line-height: 1.5; word-break: keep-all; color: #1A1A1A}

.p_info_box{display: flex;
padding: 50px;
align-items: flex-start;
gap: 10px;
align-self: stretch;
border-radius: 10px;
border: 1px solid #DDD;
background: #F9F9F9; margin: 30px 0 50px}

.p_info_box p{
	color: #222;
font-size: 18px;
line-height: 1.6; word-break: keep-all
}

.pr_btn{border-radius: 20px 0px;
background:  #153985;
/* drop */
box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15); padding: 0 50px; height: 70px; line-height: 70px; text-align: center;
color: #fff; font-size: 18px; display: inline-block;
min-width: 350px; border: 0}

.tlb{}
.tlb table{width: 100%; border-spacing: 0; border-top: 1px solid #ddd}
.tlb table th{background: #f9f9f9; border-bottom: 1px solid #f5f5f5; border-right: 1px solid #f5f5f5;
font-size: 18px; line-height: 1.5; word-break: keep-all; color: #222; padding: 25px 40px}
.tlb table th:last-child{border-right: 0}


.tlb table td{background: #fff; border-bottom: 1px solid #f5f5f5; border-right: 1px solid #f5f5f5;
font-size: 18px; line-height: 1.5; word-break: keep-all; color: #222; padding: 25px 40px}
.tlb table td:last-child{border-right: 0}



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



.form_in ul{display: flex; gap:40px 20px;flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;}
.form_in ul li{width: calc(50% - 10px)}
.form_in ul li.w100{width: 100%}

.form_in input, .form_in select{background: #fff; height: 60px; line-height: 60px;
 border-radius: 5px; padding: 0 20px; font-size: 16px; color: #1D1D1B; border: 0; width: 100%; border: 1px solid #ddd}

.form_in ul li label{color: #1D1D1B; font-size: 18px; margin-bottom: 10px; display: block; font-weight: bold}
.form_in ul li label span{color: red}

.form_in ul li .file_are{display: flex; gap:20px; justify-content: flex-start;
    align-items: center;}
.form_in ul li .file_are button{font-size: 16px; height: 60px; 
line-height: 60px; background: #1D1D1B; color: #fff; border-radius: 8px; width: 160px; font-weight: 600; border: 0;transition-duration: .5s;}
.form_in ul li .file_are input{background: #f5f5f5}

.form_in ul li .file_are button:hover{box-shadow: 4px 4px 25px 0px rgba(0, 0, 0, 0.20);}

.form_in textarea{background: #fff; height: 200px; line-height: 22px;
 border-radius: 5px; padding: 15px 20px; font-size: 16px; border: 0; width: 100%; border: 1px solid #ddd}



.ck_agree{display: flex; margin-top: 40px; gap:10px; justify-content: flex-start;
    align-items: center;}
.ck_agree input{display: none}
.ck_agree input + label{width: 20px; height: 20px; background: #fff; border: 1px solid #ddd; display: block; cursor: pointer; border-radius: 5px}

.ck_agree p{color: #1D1D1B; font-size: 16px;}
.ck_agree p a{font-weight: bold}
.ck_agree input:checked + label{background: #1B97D3}











.gall_list_style{display: flex; gap:20px; justify-content: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;}
.gall_list_style li{width: calc(33.33% - 13.339px)}
.gall_list_style li.empty_list{width: 100%}
.gall_list_style li .gall_img{overflow: hidden; border-radius: 0px; transition-duration: .5s}

.gall_list_style li .gall_img img{width: 100%;
    aspect-ratio: 16 / 9;
    height: 100%;
    object-fit: cover;}

.gall_list_style li:hover .gall_img{box-shadow: 4px 4px 25px 0px rgba(0, 0, 0, 0.20); border-radius: 20px 0 20px 0}


.board_list_txt{margin-top: 25px}
.board_list_txt h3{font-size: 20px; white-space: nowrap; /* 텍스트가 한 줄에 나타나도록 설정 */
  overflow: hidden; /* 넘치는 텍스트 숨기기 */
  text-overflow: ellipsis; /* 넘치는 부분을 생략 부호로 표시 */ transition-duration: .5s}
.board_list_txt p{font-size: 18px; margin-top: 10px; opacity: .7}


.gall_list_style li:hover .board_list_txt h3{color: #153985}

.board_common_btn_list{margin-top: 60px}
.board_common_btn_list ul{display: flex; gap:20px}
.board_common_btn_list ul a, .board_common_btn_list ul button{padding: 0 35px; display: flex; gap:30px; 
height: 58px; line-height: 58px; color: #fff; font-size: 18px; font-weight: 600; transition-duration: .5s; 
border: 0; border-radius: 58px; background: #153985; text-align: center;align-items: center;
    justify-content: center;}
.board_common_btn_list ul a:hover, .board_common_btn_list ul button:hover    {box-shadow: 4px 4px 25px 0px rgba(0, 0, 0, 0.20);}
    

.inquiry_btn + .admin_only{margin-top: 30px}


.down_flex{display: flex; gap:10px; width: max-content}
.down_flex span:first-child{width: calc(100% - 35px)}

.down_load{width: 25px; height: 25px; background:#1B97D3 ; border-radius: 25px; display: flex;
    justify-content: center;
    align-items: center;}
.down_load img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-width: 12px;
}



.board_detail_title{text-align: center}
.board_detail_title h2{ font-size: 40px}
.board_detail_title p{margin-top: 10px; font-size: 16px; color: #CBCBCB}

.board_detail_content{margin-top: 60px; border-top: 1px solid #ddd; 
border-bottom: 1px solid #ddd; padding: 50px }


.board_detail_content p{font-size: 22px; line-height: 32px; word-break: keep-all}


.board_video{max-width: 1200px; margin: 0 auto 50px}

.video-container {
  position:relative;
  height:0;
  padding-bottom:56.25%;
  overflow: hidden; border-radius: 20px 0 20px 0
}

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


.total_board{margin-bottom: 30px;}
.total_board p{font-size: 18px; color: #1A1A1A}

.board_list_box{padding: 50px; border: 2px solid #ddd; border-radius: 20px 0 20px 0; display: flex; gap:50px; transition-duration: 1s;
justify-content: flex-start;
    align-items: center;}

.board_list_box + .board_list_box{margin-top: 20px;}

.board_list_box .date{text-align: center}
.board_list_box .date h3{color: #999; font-size: 30px; font-weight: bold; transition-duration: 1s}
.board_list_box .date p{font-size: 14px; color: #999}

.board_list_box:hover{
	border-color: #153985;
	box-shadow: 2px 2px 25px 0px rgba(0, 0, 0, 0.15);
}


.board_list_box .txt{}
.board_list_box .txt h3{font-size: 20px; color: #1a1a1a; transition-duration: 1s;
white-space: nowrap; /* 텍스트가 한 줄에 나타나도록 설정 */
  overflow: hidden; /* 넘치는 텍스트 숨기기 */
  text-overflow: ellipsis; /* 넘치는 부분을 생략 부호로 표시 */ }
.board_list_box .txt p{color: #999; font-size: 16px; margin-top: 10px;
white-space: nowrap; /* 텍스트가 한 줄에 나타나도록 설정 */
  overflow: hidden; /* 넘치는 텍스트 숨기기 */
  text-overflow: ellipsis; /* 넘치는 부분을 생략 부호로 표시 */ }

.board_list_box:hover .date h3{color: #1a1a1a}
.board_list_box:hover .txt h3{color: #153985}


.product_flex3{display: flex; gap:20px; margin-top: 50px}
.product_flex3 .box{flex:1; padding: 50px; border: 1px solid #ddd; border-radius: 10px; background: #f9f9f9}
.product_flex3 .box h3{font-size: 24px; display: flex; 
    justify-content: flex-start;
    align-items: center; gap:10px;  }


.product_flex3 .box p{font-size: 18px; line-height: 1.5; word-break: keep-all; margin-top: 15px;
}
.product_flex3 .box p + p{margin-top: 5px}