.sub_visual{
	height: 100vh; background-position: center; 
	background-attachment: fixed;
    background-size: cover;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sub_visual.bg01{
	background-image: url(../img/sub/sub01.png)
}
.sub_visual.bg02{
	background-image: url(../img/sub/sub02.png)
}
.sub_visual.bg03{
	background-image: url(../img/sub/sub03.png)
}


.nav_top_sitmap{display: flex; gap:20px; align-items: center; justify-content: center;}
.nav_top_sitmap li{color: #f8f4ee; font-size: 16px; word-break: keep-all;
line-height:1; }


.nav_top_sitmap li img{display: block}
.sub_visual_title{margin-top: 25px;}
.sub_visual_title h2{color: #f8f4ee; word-break: keep-all; font-size: 68px; font-weight: 800; line-height: 140%;
}



.sub_section{padding: 150px 0}
.sub_section + .sub_section{padding-top: 0}



.flex_center{display: flex;     align-items: flex-start;}
.flex_center img{max-width: 100%}
.flex_center .left{width: 30%} 
.flex_center .left img{margin-top: 10rem}
.flex_center .center{width: 40%; text-align: center;
    position: sticky;
    top: 100px;} 
.flex_center .right{width: 30%; text-align: right} 
.flex_center .right img + img{margin-top: 160px; margin-right: 6rem}


.sub_title{margin-bottom: 100px;}
.sub_title.nobottom{margin-bottom: 0}
.sub_title.half{margin-bottom: 80px; margin-top: 120px}
.sub_title.center{text-align: center}
.sub_title h4{font-weight: bold; color: #f26721; margin-bottom: 25px; word-break: keep-all; font-size: 18px;}
.sub_title h2{color: #231503; font-size: 52px; line-height: 150%; word-break: keep-all;}
.sub_title p{font-size: 20px; word-break: keep-all; line-height: 150%; color: #231503; margin-top: 50px}
.sub_title p + p{margin-top: 25px;}



.sub_title h5{margin-top: 50px; font-size: 24px; color: #231503; line-height: 150%; word-break: keep-all}
.sub_title h5 + p{margin-top: 25px}
.sub_title h3{font-size: 36px; color: #231503; font-weight: 500}

.sub_title h2 + h3{margin-top: 50px;}

.flex_center .sub_title{margin: 0}

.imb_only{}
.imb_only img{max-width: 100%}

.imb_only.border{border: 1px solid #e1dbd2; margin-top: 80px;}

.imb_only + .flex_sub_txt{margin-top: 150px}

.flex_sub_txt{display: flex; gap:80px;}



.flex_sub_txt .thum_img{width: 50%}

.flex_sub_txt + .flex_sub_txt{margin-top: 150px}

.flex_sub_txt .box{flex:1}

.flex_sub_txt .box .flex_sub_title{margin-bottom: 40px}
.flex_sub_txt .box .flex_sub_title h3{font-size: 40px; font-weight: bold; color: #231503}
.flex_sub_txt .box p{color: #231503; font-size: 18px; word-break: keep-all; line-height: 150%}
.flex_sub_txt .box h4{color: #231503; font-size: 24px; font-weight: bold; line-height: 150%; word-break: keep-all}
.flex_sub_txt .box .num_list{border-top: 2px solid #231503}
.flex_sub_txt .box .num_list li{position: relative; padding: 20px 20px 20px 50px;
color: #231503; font-size: 18px; word-break: keep-all; line-height: 150%; border-bottom: 1px solid #231503;
font-weight: 500}

.flex_sub_txt .box .num_list li i{position: absolute; left: 10px; top: 21px; position: absolute;
width: 24px; height: 24px; text-align: center; background: #e1dbd2; border-radius: 24px; line-height: 24px;
font-size: 15px; font-style: normal; font-weight: bold}

.flex_sub_txt .box .num_list li .num_list_in{padding-left: 10px; margin-top: 8px}
.flex_sub_txt .box .num_list li .num_list_in p{font-size: 17px; color: #231503; line-height: 150%; margin-top: 5px }

.flex_sub_txt .box .no_line + .txt{margin-top: 40px}
.flex_sub_txt .box .txt + .txt{margin-top: 40px}
.flex_sub_txt .box .no_line + .num_list{margin-top: 20px}
.flex_sub_txt .box .txt + .num_list{margin-top: 40px}
.flex_sub_txt .box .num_list + .txt{margin-top: 40px}
.flex_sub_txt .box .tlb + .txt{margin-top: 40px}
.flex_sub_txt .box h4 + p{margin-top: 25px}

.flex_sub_txt .box .txt + .tlb {margin-top: 25px}

.flex_sub_txt .box .txt h4 + ul.dot{margin-top: 25px}


.flex_sub_txt .box .no_line{}
.flex_sub_txt .box .no_line p{display: flex; gap:25px;}
.flex_sub_txt .box .no_line p b{width: 100px;}
.flex_sub_txt .box .no_line p + p{margin-top: 18px}
.flex_sub_txt .box .no_line p span{flex:1}
.flex_sub_txt .box .no_line p .list_txt{flex:1}
.flex_sub_txt .box .no_line p .list_txt span{display: block}
.flex_sub_txt .box .no_line p .list_txt b{width: auto}

.line_bar{width: 100%; height: 1px; background: #d1cac1; margin: 70px 0}


.tlb{}
.tlb table{width: 100%; border-spacing: 0; border-top: 2px solid #231503}
.tlb table th, 
.tlb table td{padding: 25px; font-size: 18px; color: #231503; line-height: 150%; word-break: keep-all;
border-bottom: 1px solid #231503}


.tlb table td.bg{text-align: center; font-weight: bold; background: #ede8e1; vertical-align: middle}
.tlb table td.center{text-align: center}
.tlb table .highlight{font-weight: bold; color: #f26721;}

.tlb table th{background: #e1dbd2}

.tlb.center table td,
.tlb.center table th{text-align: center; vertical-align: middle}

.flex_img_and_txt{display: flex; gap:24px; flex-wrap: wrap;}
.flex_img_and_txt li{width: calc(25% - 18px); text-align: center}
.flex_img_and_txt li .thum{border: 1px solid #e1dbd2}
.flex_img_and_txt li .thum img{width: 100%}
.flex_img_and_txt li p{margin-top: 20px; font-size: 18px; color: #231503; font-weight: 600}


.vision{ position: relative; width: 760px; margin: 0 auto}
.vision .r_box{width: 760px; height: 760px; border-radius: 760px; position: relative;
 box-shadow: inset 0px 30px 30px rgba(230, 226, 219, 0.5); margin: 0 auto
}
.vision .r_box .in{width: 672px; height: 672px; background: url(../img/sub/sub012bg.png);
background-position: center; background-size: 100% auto; background-repeat: no-repeat;
position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}

.vision .r_box .in .in_in{width: 476px; height: 476px; border-radius: 476px; 
position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
 box-shadow: inset 0px 30px 30px rgba(230, 226, 219, 0.5); background: #f8f4ee}


.vision .r_box .in .in_in .in_logo{width: 280px; height: 280px; background: #dd1636; border-radius: 280px; 
display: flex;  justify-content: center;
    align-items: center; box-shadow: 30px 0 70px rgba(221,22,54,0.3);
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}


.vision .txt_are{position: absolute; width: 100%;   left: 50%; top: 50%; 
transform: translate(-50%, -50%); z-index: 2;
height: 100%}

.vision .txt{position: absolute; display: flex; gap:35px; z-index: 2;
width: max-content; align-items: center; opacity: 0; transition-duration: 1s}
.vision .txt i{width: 220px; height: 220px; box-shadow: 30px 0 70px rgba(212,195,173,0.3);
border-radius: 220px;
display: flex;  justify-content: center;
    align-items: center; background: #fffbf5; gap:10px;
    flex-direction: column; font-style: normal}

.vision .txt i p{font-size: 20px; font-weight: bold; word-break: keep-all; color: #231503}

.vision .txt ul.dot{width: 250px}

ul.dot{}
ul.dot li{position: relative; padding-left: 15px; font-size: 18px; word-break: keep-all; line-height: 150%; color: #231503}
ul.dot li:after{content: ''; width: 4px; height: 4px; background: #c7c1b7; position: absolute; left: 0; top: 12px}

.vision .txt.txt01{left: -300px; top: 20px}
.vision .txt.txt02{right: -300px; top: 20px}
.vision .txt.txt03{left: -300px; bottom: 20px}
.vision .txt.txt04{right: -300px; bottom: 20px}

.vision.show .txt{opacity: 1}

.vision.show .txt.txt01{transition-delay: 1s}
.vision.show .txt.txt02{transition-delay: 1.5s}
.vision.show .txt.txt03{transition-delay: 2s}
.vision.show .txt.txt04{transition-delay: 2.5s}

.step_flex{display: flex; gap:50px; align-items: flex-start;}
.step_flex .box{flex:1; border-radius: 20px; overflow: hidden}
.step_flex .box:nth-child(2n){margin-top: 80px}

.step_flex .box .thum{position: relative}
.step_flex .box .thum img{max-width: 100%}
.step_flex .box .thum:after{content: '';
position: absolute; bottom: 0; left: 0; width: 100%; height: 25%; 
background: linear-gradient(0deg,rgba(255, 255, 252, 1) 0%, rgba(255, 255, 252, 0) 100%);}
.step_flex .box .txt{background: #fffff9; padding: 40px;}
.step_flex .box .txt p{font-size: 22px; color: #231503; line-height: 150%; word-break: keep-all; font-weight: 600}
.step_flex .box .txt p b{color: #c3b29b; font-weight: 700}


.history__box {
    position: relative;
    margin: 0;
    /* 초기값 필수: 가려진 상태에서 시작 (100%) */
    --line-height: 100%;
}

.history__box:before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    background: linear-gradient(180deg, #feb052 0%, #f26721 100%);
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}

.history__box:after {
    content: '';
    position: absolute;
    width: 20px;
    height: var(--line-height); /* 100% → 0% 로 스크럽 */
    background: #f8f4ee;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    z-index: 1;
}





.history__box ul{}


.history__box ul li {
    width: 100%;
    text-align: right;
}

.history__box ul li + li{margin-top: 100px}

.history__box ul li h2{color: #231503; font-size: 40px; font-weight: bold; margin-bottom: 50px; transition-duration: .8s}
.history__box ul li.show h2{color: #f26721}
.history__box ul li .txt{
	display: flex;
justify-content: flex-start;
    align-items: flex-start;
    padding: 35px 0;
    border-bottom: 1px solid #d4cdc4
}

.history__box ul li h2 + .txt{border-top: 2px solid #d4cdc4}

.history__box ul li .txt p{color: #231503; font-size: 18px; font-weight: 500; line-height: 150%; word-break: keep-all}
.history__box ul li .txt p b{font-weight: 700}
.history__box ul li .txt p.year{font-weight: 700; width: 70px;}

.history__box ul li .txt .in_txt{flex:1}
.history__box ul li .txt .in_txt + .in_txt{margin-top: 20px;}
.history__box ul li .txt .in_txt p{
	display: flex;
justify-content: flex-start;
    align-items: flex-start;
    gap:50px
}

.history__box ul li .txt .in_txt p b{width: 30px;}
.history__box ul li .txt .in_txt p span{flex:1}
.history__box ul li>div {
    width: calc(50% - 120px);
    display: inline-block;
    text-align: left;
}

.history__box ul li:nth-child(2n) {
    text-align: left;
}

.history__box ul li:nth-child(2n)>div {
    width: calc(50% - 120px);
    display: inline-block;
    text-align: right;
}

.history__box ul li:nth-child(2n) .txt{
    flex-direction: row-reverse;
}

.history__box ul li:nth-child(2n) .txt .in_txt p{
    flex-direction: row-reverse;
}


.slide_section{
	height: 100vh; position: relative;
	background: url(../img/sub/sub13bg.png);
	background-size: cover
}

.bu_slide .box{height: 100vh; overflow: hidden; 
display: flex;
    justify-content: center;
    align-items: center; padding-bottom: 100px}

.bu_slide .box img{margin: 50px auto 0}

.slide_section .slide-counter {
    position: absolute;
    z-index: 2;
    bottom: 12rem;
    display: flex;
    gap: 15px;
    left: 0;
    width: 100%;
    justify-content: center;
}
.slide_section .slide-counter span{font-size: 24px; color: #231503; opacity: .3; font-weight: bold}
.slide_section .slide-counter span#current{opacity: 1; color: #f26721}


.sub_tab_top{text-align: center; margin-bottom: 80px;}
.sub_tab{display: inline-flex; padding: 6px; border: 3px solid #e1dbd2; border-radius: 100px;}
.sub_tab li{}
.sub_tab li a{display: flex; padding: 15px 20px; font-size: 18px; 
color: #231503; word-break: keep-all; line-height: 140%; border-radius: 80px; transition-duration: .8s; min-width: 160px;
justify-content: center;}
.sub_tab li a:hover,
.sub_tab li a.active{background: #231503; color: #fff}


.sub_tab_are {
  display: none;
}
.sub_tab_are.active {
  display: block;
}



.sub_video_are {
  position:relative;
  height:0;
  padding-bottom:56.25%;
}

.sub_video_are iframe {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}



.sub_tab_flex{display: flex; margin-top: 130px;}

.sub_tab_flex .txt{width: 50%}
.sub_tab_flex .txt h2{font-size: 44px; font-weight: 600; color: #231503; line-height: 150%; word-break: keep-all}
.sub_tab_flex .txt h2 b{color: #f26721}

.sub_tab_flex .txt ul{margin-top: 70px}
.sub_tab_flex .txt ul li{position: relative; display: flex; 
font-size: 18px; color: #231503; line-height: 150%; word-break: keep-all}
.sub_tab_flex .txt ul li b{width: 120px}
.sub_tab_flex .txt ul li span{flex:1}

.sub_tab_flex .txt ul li + li{margin-top: 25px}

.sub_tab_flex .map_are{width: 50%}
.sub_tab_flex .map_are iframe{width: 100%; display: block}


.sub_drag_slide_are{margin-top: 150px;}


.sub_drag_slide{}
.sub_drag_slide img{width: 100%}


.sub_drag_slide .thum{border: 1px solid #e1dbd2; overflow: hidden}

.sub_drag_slide .slick-slide{padding: 0 25px;}
.sub_drag_slide .slick-list{padding: 0 20rem}

.progress {
	margin-top:80px;
  display: block;
  width: 100%;
  height: 3px;
  border-radius: 0px;
  overflow: hidden;
  background-color: #e1dbd2;
  background-image: linear-gradient(to right, #c7c1b7, #c7c1b7);
  background-repeat: no-repeat;
  background-size: 0 100%;
  transition: background-size .4s ease-in-out;
}



.form_in{margin-top: 100px}
.form_in h4{color: #231503;
    font-size: 24px;
    font-weight: bold;
    line-height: 150%;
    word-break: keep-all; margin-bottom: 25px}


.form_in .agreement_txt{height: 200px; overflow-y: auto; border: 1px solid #231503; padding: 25px}
.form_in .agreement_txt p{font-size: 16px; word-break: keep-all; line-height: 150%}

.form_in .agree_ck{margin-top: 15px}
.form_in .agree_ck input{display: none}
.form_in .agree_ck input + label{padding-left: 40px; position: relative; background: url(../img/sub/form_ck.png); background-position: left center;
background-size: 30px auto; background-repeat: no-repeat; color: #231503; font-size: 16px; line-height: 30px; word-break: keep-all; cursor: pointer;
display: block}

.form_in .agree_ck input:checked + label{background-image: url(../img/sub/form_ckon.png);}





.form_are{margin-top: 70px; padding-top: 70px; border-top: 1px solid #d1cac1}

.form_are{display: flex; gap:20px;
    flex-wrap: wrap;}
.form_are li{width: calc(50% - 10px)}
.form_are li.w100{width: 100%}
.form_are input[type="text"],
.form_are input[type="tel"],
.form_are input[type="email"],
.form_are select{width: 100%; font-size: 18px; color: #231503; border:  1px solid #231503;
background: transparent; padding: 15px 25px}

.form_flex{display: flex; gap:20px}
.form_flex .ck_in{display: flex; gap:10px}
.form_flex .ck_in label{ color: #231503; font-weight: 600; line-height: 140%; word-break: keep-all; font-size: 18px; cursor: pointer }

.form_are p{font-size: 18px; margin-bottom: 15px; color: #231503; font-weight: 600; line-height: 140%; word-break: keep-all }
.form_are p.note{margin-bottom: 0; margin-top: 10px; font-size: 16px; color: red}

.form_are li + li{margin-top: 25px}


.form_flex + input{margin-top: 10px}

.file_are{display: flex; gap: 15px;}
.file_are button{
	border-radius: 0px;
border: 1px solid #231503;
background: #231503;
height: 60px; word-break: keep-all; color: #fff; font-size: 18px;
padding: 0 25px;
min-width: 180px; text-align: center
}

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



.submit_btn{border: 2px solid #e1dbd2; background:#f8f4ee ; height: 60px; display: inline-flex; font-size: 18px; color: #231503;
    align-items: center; padding: 0 30px; border-radius: 100px; transition-duration: 1s;
       justify-content: center;
    position: relative;
    width: max-content; font-weight: 600;
    min-width: 170px; text-align: center
        }
.submit_btn:hover{background-color: #f0ece6}



#success_popup {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 10000;
	}



	.popup_content {
		background: #fff;
		padding: 40px;
		border-radius: 0px;
	}


.popup_content h2{text-align: center; font-size: 20px; word-break: keep-all; line-height: 150%; color: #231503}
.popup_content .btn_content{text-align: center; margin-top: 25px}


.success_popup_list{margin-top: 25px; }
.success_popup_list li{position: relative; display: flex; 
font-size: 16px; color: #231503; line-height: 150%; word-break: keep-all}
.success_popup_list li b{width: 80px}
.success_popup_list li span{flex:1}
.success_popup_list li + li{margin-top: 5px}

.success_popup_list.eng li b{width: auto}
.success_popup_list.eng li{gap:10px}

/*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: center; margin-bottom: 30px}

.total_board{}
.total_board p{font-size: 16px; color: #231503}
.total_board p b{font-weight: bold; color: #231503}

.search_board form{display: flex; gap:10px}
.search_board form select{background: #f2ede6 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: #f2ede6; border-radius: 60px; display: flex; overflow: hidden}
.search_board .sch_bar input{font-size: 15px; padding: 0 20px; line-height: 60px; border: 0; background: #f2ede6}
.search_board .sch_bar button{padding: 0 20px; border: 0; background: #f2ede6}


.board_notice{border-top: 2px solid #c7c1b7}
.board_notice_list li{padding: 50px 0; border-bottom: 1px solid #c7c1b7; display: flex; gap:60px;
justify-content: flex-start;
    align-items: center;}
.board_notice_list li .num{text-align: center; font-size: 18px; color: #231503; width: 100px}
.board_notice_list li .txt{flex:1}
.board_notice_list li .txt h3{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; color: #231503}

.board_notice_list li .txt h3 .dday{font-size: 16px; margin-right: 5px}


.flex_event_info{margin-top: 20px; display: flex; gap:30px;  align-items: center;}
.flex_event_info p{font-size: 16px; color: #231503; display: flex; gap:10px;  align-items: center;}
.flex_event_info p i img{display: block}
.board_notice_list li .txt p.date{margin-top: 20px; color: #231503; font-size: 16px; opacity: .5}



.board_title{margin-bottom: 60px; text-align: center}
.board_title h2{font-size: 24px; font-weight: 700; color: #231503}
.board_title p{margin-top: 20px; font-size: 16px; color: #231503; font-weight: 500; opacity: .5}
.board_title p.dday{margin-top: 0; opacity: 1; margin-bottom: 10px}

.board_title .flex_event_info{
	justify-content: center;
}


.event_detail_board{padding: 40px; border-top: 2px solid #d1cac1; border-bottom: 1px solid #d1cac1; max-width: 560px; width: 100%; margin: 0 auto 60px}
.event_detail_board_in{}
.event_detail_board_in p{font-size: 18px; color: #231503; display: flex; word-break: keep-all; line-height: 150%}
.event_detail_board_in p b{width: 100px;}
.event_detail_board_in p span{flex:1}
.event_detail_board_in p + p{margin-top: 15px}


#bo_v_file li{padding: 22px 18px; border: 0;border:0; border-top: 0px solid #ddd; border-top: 1px solid #d1cac1; box-shadow: none;
border-radius: 0; background: #f5f1eb}
#bo_v_file li a{display: flex; gap:20px; font-size: 16px; color: #231503; text-decoration: underline}

#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}




.board_detail_content{border-top: 2px solid #d1cac1; padding-top: 50px; }
.board_view_btn{text-align: center; margin-top: 100px}


.bo_v_nb {margin:100px 0 0;position:relative;clear:both;text-align:left}
.bo_v_nb:after {display:block;visibility:hidden;clear:both;content:""}
.bo_v_nb li {border-top:1px solid #d1cac1;padding:30px 18px; font-size: 16px; transition-duration: .8s}
.bo_v_nb li:last-child {border-bottom:1px solid #d1cac1}
.bo_v_nb li:hover {background:#f0ece6}
.bo_v_nb li i {font-size:13px;color:#b3b3b3; margin-left: 15px}
.bo_v_nb li .nb_tit {display:inline-block;padding-right:50px;color:#777067}
.bo_v_nb li .nb_date {float:right;color:#b3b3b3}

.chk_box{z-index: 2}

.gall_list_style{display: flex; gap:150px 100px;    flex-wrap: wrap;}
.gall_list_style li{width: calc(25% - 75px)}
.gall_list_style li.empty_list{width: 100%}

.gall_list_style .gall_img{overflow: hidden; border-radius: 0px; transition-duration: .8s; border: 1px solid #e1dbd2; position: relative}


.gall_list_style .gall_img img{width: 100%; height: 100%;object-fit: cover;
    aspect-ratio: 1;}
    

    
    
.board_list_txt{margin-top: 25px; text-align: center}

.board_list_txt p.tag{font-size: 16px; color: #231503;
background: #ebe5dd; padding: 8px 12px; border-radius: 80px; display: inline-block; font-weight: 600; margin-bottom: 10px}


.board_list_txt h3{color: #231503; 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; transition-duration: .8s}    



.board_list_txt p.list_date{font-size: 16px; color: #231503; margin-top: 10px; opacity: .5}  




.gall_list_style.certifications .board_list_txt{text-align: center}
    
.if_video_are{max-width: 1024px; margin: 0 auto 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%;
}






.contact_view{}
.contact_view li{font-size: 18px;}
.contact_view li + li{margin-top: 10px}

.contact_content *,
.contact_content{font-size: 18px; line-height: 150%; word-break: keep-all; }

#bo_v_con,
#bo_v_con *{color: #231503; font-size: 16px; line-height: 150%; word-break: keep-all;
    background: transparent !important;}


#bo_cate {margin:0px 0 60px}
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul {zoom:1; display: flex; gap:20px}
#bo_cate ul:after {display:block;visibility:hidden;clear:both;content:""}
#bo_cate li {display:inline-block;padding:2px}
#bo_cate a {display:block;line-height:28px;padding:5px 0px;border-radius:0px;border-bottom:1px solid #fff;color:#231815; 
font-size: 16px; transition-duration: .5s}
#bo_cate a:focus, #bo_cate a:hover, #bo_cate a:active {text-decoration:none;background:#fff;color:#DE9B25}
#bo_cate #bo_cate_on {z-index:2;background:#fff;color:#DE9B25;font-weight:bold;border-bottom:1px solid #DE9B25;}



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









/*sub03*/

.brand_flex{display: flex; gap:30px}
.brand_flex > div{display: flex; overflow: hidden;
justify-content: center;
    align-items: center; height: 40vh}
.brand_flex > div img{max-width: 100%}
.brand_flex .left{border-radius: 20px 0 0 20px; background: #f26721; width: 30%}
.brand_flex .right{border-radius: 0 20px 20px 0; border: 1px solid #ebe5dd; background: #f5f1eb; width: calc(70% - 30px)}

.brand_bg_flex{display: flex; gap:100px;
justify-content: center;
    align-items: center;}

.brand_bg_flex .box{width: 300px; height: 300px; border-radius: 300px; background: #fff; box-shadow: 15px 0 20px rgba(35,21,3,0.01);
text-align: center;display: flex; gap:15px;
justify-content: center;
    align-items: center;     flex-direction: column; position: relative; aspect-ratio: 1;}



.brand_bg_flex .box p{color: #231503; font-weight: bold; font-size: 22px; word-break: keep-all; line-height: 150%}

.brand_bg_flex .box + .box:after{
	content: '';
	position: absolute; left: calc(-100% + 50px);
	background: url(../img/sub/brand_bg_flex.png);
	width: 407px;
	height: 300px;
	background-position: center;
	background-size: 100% auto;
	background-repeat: no-repeat;
	z-index: -1
}


.brand_step_are{max-width: 1300px; margin: 0 auto}

.brand_step{display: flex; gap:30px;
justify-content: center;
    align-items: center;}
    
    
.brand_step + .brand_step{margin-top: 30px}    

.brand_step.mid{justify-content: flex-end; padding: 0 100px}
.brand_step.mid .next img{transform: rotate(90deg);}
.brand_step.end{flex-direction: row-reverse;}
.brand_step.end .next img{transform: rotate(180deg);}



.brand_step .box{width: 250px; height: 250px; border-radius: 300px; background: #fff; box-shadow: 15px 0 20px rgba(35,21,3,0.01);
text-align: center;display: flex; gap:15px;
justify-content: flex-start;
    align-items: center;     flex-direction: column; position: relative; aspect-ratio: 1; transition-duration: .8s; padding-top: 70px}

.brand_step .box.atv{background: #f26721;
box-shadow: 35px 20px 60px rgba(242,103,33,0.3);}

.brand_step .box p{
	width: 44px; height: 44px;
	background: rgba(242,103,33,0.1);
	font-size: 18px; color: #f26721; text-align: center;
	line-height: 44px;
	border-radius: 44px;
	transition-duration: .8s;
	font-weight: 600
}

.brand_step .box.atv p{background: #fff}

.brand_step.eng .box h3{font-size: 16px}
.brand_step .box h3{color: #231503; font-weight: bold; font-size: 22px; word-break: keep-all; line-height: 150%; transition-duration: .8s}
.brand_step .box.atv h3{color: #fff}

.brand_step .next{width: 40px; height: 40px; background: #fff; border-radius: 40px; display: flex;justify-content: center;
    align-items: center; aspect-ratio: 1;}
.brand_step .next img{max-width: 100%; display: block;}


.brand_bg_flex_are{padding: 100px 25px;
border-radius: 40px; background: url(../img/sub/brand_bg_flex_are.png); background-size: cover}

.brand_bg_flex_are .sub_title{margin-bottom: 45px}
.brand_bg_flex_are .sub_title p{margin-top: 25px; color: #fff; opacity: .6}
.brand_bg_flex_are .sub_title h3{color: #f8f4ee}





.brand2_flex{display: flex; gap:30px;
justify-content: center;
    align-items: center;}
.brand2_flex .box{width: 250px; height: 250px; border-radius: 300px; background: #fff; box-shadow: 15px 0 20px rgba(35,21,3,0.01);
text-align: center;display: flex; gap:15px;
justify-content: center;
    align-items: center;     flex-direction: column; position: relative; aspect-ratio: 1; transition-duration: .8s}

.brand2_flex .box.last{background: #f26721;
box-shadow: 35px 20px 60px rgba(242,103,33,0.3);}

.brand2_flex .box p{color: #231503; font-weight: bold; font-size: 22px; word-break: keep-all; line-height: 150%;}
.brand2_flex .box.last p{color: #fff}
.brand2_flex i{}
.brand2_flex i img{display: block; max-width: 100%}


.txt_box_flex{display: flex; gap:20px}
.txt_box_flex .left{width: 30%; border-radius: 20px; background: #f26721; padding: 40px; text-align: center;
display: flex;justify-content: center;
    align-items: center; }
.txt_box_flex .left p{font-weight: bold; color: #fff; font-size: 32px; line-height: 150%; word-break: keep-all}
.txt_box_flex .txt{ border: 1px solid #ebe5dd; background: #fff; width: calc(70% - 20px); padding: 40px; border-radius: 20px}
.txt_box_flex .txt h3{font-size: 24px; color: #231503; font-weight: 600; line-height: 150%; word-break: keep-all; margin-bottom: 20px;}
.txt_box_flex .txt h3 b{font-weight: 600; color: #f26721}
.txt_box_flex + .txt_box_flex{margin-top: 20px}

/*product*/



.product_list{max-width: 1370px; margin: 0 auto}

.product_list_box{display: flex;justify-content: space-between; gap:10rem; align-items: center;}
.product_list_box .thum{overflow: hidden; width: 640px; height: 640px;aspect-ratio: 1;
border-radius: 640px}
.product_list_box .thum img{display: block; width: 100%; height: 100%;
object-fit: cover;
    aspect-ratio: 1;}


.product_list_box .txt{flex:1}
.product_list_box .txt .sub_title{margin-bottom: 30px;}
.product_list_box .txt .author{display: flex; gap:15px;
justify-content: flex-start;
    align-items: center;}
.product_list_box .txt .author .tag{font-size: 16px; color: #fff; word-break: keep-all; background: #231503; padding: 10px 12px; border-radius: 50px;}
.product_list_box .txt .author .name{font-size: 24px; font-weight: bold; color: #231503; word-break: keep-all}



.product_list_box .txt .long_txt{color: #231503; font-size: 18px; word-break: keep-all; line-height: 150%; margin-top: 30px}
.product_list_box .txt .price{padding: 30px 0; border-top: 1px solid #e1dbd2; border-bottom: 1px solid #e1dbd2; margin-top: 30px}
.product_list_box .txt .price p{display: flex; font-size: 18px; font-weight: 700; color: #231503; word-break: keep-all}
.product_list_box .txt .price p b{width: 90px; color: #f26721; font-weight: 700;}

.product_detail{margin-top: 30px}

.product_detail p{display: flex; font-size: 18px; font-weight: 400; color: #231503; word-break: keep-all}
.product_detail p b{width: 90px; color: #231503; font-weight: 700;}
.product_detail p + p{margin-top: 10px}

.product_detail p span{flex:1}
.product_list_btn{display: inline-flex; padding: 20px 30px; border: 2px solid #e1dbd2; border-radius: 8px;
gap:40px; margin-top: 50px;     align-items: center;
}
.product_list_btn span.bt_line{width: 2px; height: 18px; background: #e1dbd2}

.product_list_btn a{display: flex; gap:10px; word-break: keep-all; font-size: 18px; color: #231503; align-items: center;}
.product_list_btn a i img{display: block}




.product_list_box + .product_list_box{margin-top: 180px}

.product_list_box:nth-child(2n){flex-direction: row-reverse;}






@media (max-width: 1660px) {

.brand_step .box{width: 230px; height: 230px}
.brand_step .box h3{font-size: 18px}
.brand_step.mid{padding: 0 130px}
}






@media (max-width: 1460px) {

.product_list_box{gap:6rem}
.brand_step .box{width: 200px; height: 200px; padding-top: 50px}
.brand_step.mid{padding: 0 180px}

.gall_list_style{gap:100px 30px}
.gall_list_style li {
    width: calc(25% - 22.5px);
}

.flex_center .center{width: 60%}
.flex_center .left,
.flex_center .right{width: 20%}

.flex_center .right img + img{margin-right: 0; position: relative; left: -3rem}

.step_flex{gap:20px}

.step_flex .box .txt p{font-size: 18px}

.sub_tab_flex,
.flex_sub_txt,
.product_list_box{gap:3rem}
.sub_tab_flex .map_are{width: calc(50% - 3rem)}

}


@media (max-width: 1370px) {

.vision{width: 600px}
.vision .r_box{width: 600px; height: 600px}
.vision .txt i{width: 150px; height: 150px}
.vision .txt i img{max-width: 30px}

.sub_title h2{font-size: 40px}
.sub_title h3,
.history__box ul li h2{font-size: 30px}
.sub_title p{font-size: 18px}

.bu_slide .box .sub_title{margin: 0}
.slide_section .slide-counter{bottom: 3rem}

.brand_step{gap:10px}

.brand_step.mid {
        padding: 0 220px;
    }




}


@media (max-width: 1280px) {

.custom-cursor{display: none !important}

.product_list_box .thum{width: 40%; height: auto}

.sub_title h4,
.sub_title p,
.product_list_box .txt .long_txt,
.product_list_box .txt .price p,
.product_detail p,
.product_list_btn a,
ul.dot li,
.tlb table th, .tlb table td,
.sub_tab li a,
.submit_btn,
.event_detail_board_in p,
.flex_sub_txt .box p,
.flex_sub_txt .box .num_list li,
.history__box ul li .txt p,
.form_flex .ck_in label,
.form_are input[type="text"], .form_are input[type="tel"], .form_are input[type="email"], .form_are select,
.file_are button{font-size: 16px}

.sub_title h2,
.sub_visual_title h2,
.flex_sub_txt .box .flex_sub_title h3{font-size: 30px}
.sub_title h3{font-size: 24px}

.product_list_box .txt .author .name,
.brand_bg_flex .box p,
.brand2_flex .box p,
.txt_box_flex .left p,
.txt_box_flex .txt h3,
.flex_sub_txt .box h4{font-size: 18px}

.brand2_flex .box{width: 220px; height: 220px}

.nav_top_sitmap li,
.product_list_box .txt .author .tag,
.flex_sub_txt .box .num_list li .num_list_in p,
.form_are p,
.form_are p.note{font-size: 14px}

.sub_title p{margin-top: 30px}

.brand_step.mid{display: none}
.brand_step.end {
    flex-direction: row;
}

.brand_step.end .next img {
    transform: rotate(0deg);
}

.brand_step .next img {
    max-width: 8px
}

.flex_sub_txt .thum_img{width: 30%}
.flex_sub_txt .thum_img img{max-width: 100%}

.form_flex {
    flex-wrap: wrap;
}

}


@media (max-width: 1024px) {
.form_flex {
    gap: 10px;
}	
	
.flex_sub_txt {
    flex-wrap: wrap;
}

.flex_sub_txt .box{width: 100%; flex:none}

.vision .r_box{display: none}
.vision{width: 100%}
.vision .txt_are{position: relative}
    .vision .txt_are {
        position: relative;
        top: 0;
        left: 0;
        transform: none;
                display: flex;
        flex-wrap: wrap;
        gap:30px 10px
    }

.vision .txt{position: relative; width: 100%;     flex-direction: row ; }
.vision .txt.txt01,
.vision .txt.txt03{flex-direction: row-reverse}

.vision .txt.txt01,
.vision .txt.txt02,
.vision .txt.txt03,
.vision .txt.txt04{top: 0; left: 0; bottom: auto; right: auto}

.step_flex{
 	  flex-wrap: wrap;
 	  gap:40px 20px
 }  
.step_flex .box{flex:none; width: calc(50% - 10px)} 

.step_flex .box .thum img{width: 100%}


.step_flex .box:nth-child(2n) {
    margin-top: 0;
}
.history__box:before,
.history__box:after{display: none}
     
.history__box ul li>div,
.history__box ul li:nth-child(2n)>div{width: 100%; text-align: left}     
  .history__box ul li:nth-child(2n) .txt .in_txt p,
  .history__box ul li:nth-child(2n) .txt {
    flex-direction: row;
}   
    
    
.flex_img_and_txt{gap:20px} 
.flex_img_and_txt li,
.gall_list_style li{width: calc(50% - 10px)}  
    
 .flex_sub_txt .thum_img{width: 100%}
 .flex_sub_txt .thum_img img{width: 100%}   
    
 .sub_tab_flex {
    flex-direction: column-reverse;
}   
 .sub_tab_flex .txt,
 .sub_tab_flex .map_are{width: 100%} 
    
 
.sub_drag_slide .slick-list{padding: 0 3rem} 
  
.gall_list_style{gap:80px 20px}   
 
.board_notice_list li{gap:20px} 
 
 .brand_flex {
    display: flex;
    gap: 20px;
    flex-direction: column;
} 
 
 .brand_flex .left,
 .brand_flex .right{width: 100%; border-radius: 5px; }
    
.brand_bg_flex{gap:20px}    
.brand_bg_flex .box + .box:after{display: none} 

.brand_step{
	flex-wrap: wrap;
}
   
   
.product_list_box,
.product_list_box:nth-child(2n) {
    flex-direction: column-reverse;
}
   
 .product_list_box .thum{width: 100%; max-width: 600px}  
   
 .sub_tab li a{min-width: auto; }  
   
       
}


@media (max-width: 860px) {

.brand2_flex,
.brand_bg_flex {
    flex-direction: column;
}

.brand_step .next{display: none}

.brand_step .box {
        width: calc(50% - 5px);
        height: auto;
        justify-content: center;
    align-items: center;
    padding: 0
        
    }

.tlb{overflow-x: auto}

.flex_center {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap:50px
}
.flex_center .left, .flex_center .right,
.flex_center .center{width: 100%}


.flex_center .left img{margin: 0; width: 100%}

.flex_center .center{position: relative; top: 0}

.flex_center .right{display: flex; }
.flex_center .right img{flex:1; max-width: 100%; width: 50%}
.flex_center .right img + img{margin: 0; left: 0}
.vision .txt{
	justify-content: center; 
}
}


@media (max-width: 600px) {

.popup_content{max-width: 96%}
.popup_content h2{font-size: 18px}

.nav_top_sitmap{gap:5px}

.form_in .agreement_txt p{font-size: 14px}


.flex_sub_txt .box .no_line p {
    display: flex;
    gap: 10px;
    flex-direction: column;
}
.flex_sub_txt .box .no_line p b{width: 100%}
.sub_title h2, .sub_visual_title h2, .flex_sub_txt .box .flex_sub_title h3,
.sub_tab_flex .txt h2{font-size: 24px}
.sub_title h3, .history__box ul li h2{font-size: 20px}


.sub_title h4, .sub_title p, .product_list_box .txt .long_txt, 
.product_list_box .txt .price p, .product_detail p, .product_list_btn a, 
ul.dot li, .tlb table th, .tlb table td, .sub_tab li a, .submit_btn, 
.event_detail_board_in p, .flex_sub_txt .box p, .flex_sub_txt .box .num_list li, 
.history__box ul li .txt p, .form_flex .ck_in label, .form_are input[type="text"], 
.form_are input[type="tel"], .form_are input[type="email"], .form_are select, .file_are button,
.sub_tab_flex .txt ul li{font-size: 14px}

.tlb.center table td, .tlb.center table th{padding: 10px}
.vision .txt i p{font-size: 16px}

    .vision .txt i {
        width: 150px;
        height: auto;
        aspect-ratio: 1;
    }


.sub_title h3{word-break: keep-all}

.step_flex .box{width: 100%}


    .step_flex .box .thum img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        aspect-ratio: 3 / 2;
    }



    .history__box ul li:nth-child(2n) .txt .in_txt p, .history__box ul li:nth-child(2n) .txt {
        flex-direction: column;
        gap: 10px;
    }
.sub_tab_flex .txt ul li{flex-direction: column; gap:10px}
.sub_tab_flex .txt ul li b{width: 100%}


.sub_tab {
    display: inline-flex;
    padding: 6px;
    border: 0px solid #e1dbd2;
    border-radius: 0;
    flex-wrap: wrap;
    gap:10px
}

.sub_tab li a{padding: 10px; border-radius: 0}  
  
.sub_drag_slide .slick-slide,
.sub_drag_slide .slick-list{padding: 0 10px}  
 
.board_notice_list li{padding: 25px 0} 

.board_title h2{font-size: 18px} 
.board_title p,
#bo_v_file li a,
.board_list_txt p.tag,
.board_list_txt p.list_date,
.flex_event_info p{font-size: 14px}

.board_top_flex{display: none} 
.board_notice_list li .num{width: 30px; font-size: 14px} 
.board_notice_list li .txt h3,
.board_list_txt h3{font-size: 16px}
.board_notice_list li .txt p.date{font-size: 12px; margin-top: 10px}
.board_notice_list li .txt h3 .dday{font-size: 14px} 
 
.bo_v_nb li .nb_date{display: none}  
.bo_v_nb li{display: flex; font-size: 14px; gap:10px}    
.bo_v_nb li .nb_tit{margin:0; display: none}    
.bo_v_nb li .nb_tit i{display: none}
    
.sub_section{padding: 100px 0}    

.flex_event_info{gap:10px;
flex-direction: column;
align-items: flex-start;}    
.event_detail_board_in p   ,
.txt_box_flex{flex-direction: column;}
.event_detail_board_in p b{width: 100%}   
  
.event_detail_board{padding: 25px}  

.brand_step .box h3,
.product_list_box .txt .author .name, .brand_bg_flex .box p, .brand2_flex .box p, .txt_box_flex .left p, .txt_box_flex .txt h3, 
.flex_sub_txt .box h4{font-size: 16px}
  
.txt_box_flex .left,
.txt_box_flex .txt{width: 100%}
  
.product_list_btn {
    display: flex;
    padding: 20px 30px;
    border: 2px solid #e1dbd2;
    border-radius: 8px;
    gap: 20px;
    margin-top: 50px;
    align-items: flex-start;
    flex-direction: column;
}
.product_list_btn span.bt_line{width: 100%; height: 1px}  
    
}





@media (max-width: 360px) {

 
 
 
 
}











