@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	" board｜errors｜goods｜service｜layout/board｜layout/display｜layout/goods "
	" layout/popup.html "

	위 폴더 및 페이지 커스텀 및 layout, navigation, button, company 관련 편집 css 파일 입니다.

	** header, footer, main 관련은 /css/skin.css 에 있습니다.

───────────────────────────────────────────────────────────*/



/*───────────────────────────────────────────────────────────
	
	common.css 커스텀 css 아래에 작성

───────────────────────────────────────────────────────────*/

.sub_visual{position: relative;height: 430px;background: no-repeat top;box-sizing: border-box;padding: 0; z-index: 5; background-size: cover; }
.sub_visual .main_title{display: flex; align-items: center; height: 100%; font-size: var(--title-20); color: var(--point-white);}
.sub_visual .main_title h2 {text-align: center; font-size: 300%; font-weight: 600; line-height: 1; letter-spacing: -0.03em; font-family: var(--font-type01); }

.sub_visual .sub_nav{position: absolute;left:0;bottom:0;width: 100%;box-sizing: border-box;z-index: 5;}
.sub_visual .sub_nav .w_custom{width: 100%; max-width: 1280px;}

.sub_nav{background: var(--point-white); border-bottom: 1px solid var(--border-color01); }
.sub_nav .desc{display: flex; height: 59px; border-left: 1px solid var(--border-color01); font-size: var(--title-18); font-family: var(--font-type01); font-weight: 500; }

.sub_nav .desc :where(dt, dd){position: relative; height: 100%; border-right: 1px solid var(--border-color01); box-sizing: border-box; }

.sub_nav .desc dt a{display: flex;width: 60px;height: 100%; align-items: center;justify-content: center;font-size: 0;padding: 17px 18px 16px 16px;box-sizing: border-box;}
.sub_nav .desc dt a img { width: 18px; height: 17px; }
.sub_nav .desc dd span{position: relative;display: flex;align-items: center;height: 100%;padding:3px 60px 0 19px;box-sizing: border-box;font-weight: 400;color: var(--black-color01);min-width: 298px;border-right: 1px solid rgba(221, 221, 221, 0.2);line-height: 1.4;cursor: pointer; letter-spacing: 0;}

.sub_nav .desc dd span:before{position: absolute;content:'';width: 8px;height: 8px;border:solid var(--black-color03);border-width: 0 0 1px 1px;top: 46.8%;right: 19px;transform: translateY(-50%) rotate(-45deg);border-radius: 1px; transition: all 0.4s;}

.sub_nav .desc dd.on span:before{transform: translateY(-50%) rotate(-45deg) scale(-1,-1);top: 55%;}

.sub_nav .desc dd ul{position: absolute;top: calc(100% - 1px);left:0;width: 100%;padding: 20px 0;background: var(--point-white);border:1px solid var(--point-color01);border-radius: 0 0 10px 10px;box-sizing: border-box;opacity: 0;pointer-events: none;transition: all 0.4s; z-index: 10; }
.sub_nav .desc dd.on ul{opacity: 1; pointer-events: all;}

.sub_nav .desc dd ul li a{display: block;font-weight: 400;color: var(--black-color02);padding: 11px 24px;box-sizing: border-box;line-height: 1.4;}
.sub_nav .desc dd ul li.on a{color: var(--point-color01);text-decoration: underline;text-underline-offset: 3px;text-decoration-thickness: 1px;font-weight: 500;}


.sub_nav .desc dd + dd span { color: var(--point-color01); font-weight: 600; min-width: 299px; }
.sub_nav .desc dd + dd span::before { border-color: var(--point-color01); }

.sub_title { text-align: center; font-size: var(--title-20); margin: 0 0 80px; }
.sub_title h3 { position: relative; font-size: 250%; font-weight: 600; font-family: var(--font-type01); letter-spacing: -0.03em; }
.sub_title h3::after { content: ''; display: block; width: 44px; height: 1px; background: var(--black-color03); margin: 30px auto 0;  }





/*───────────────────────────────────────────────────────────
	
	게시판

───────────────────────────────────────────────────────────*/

/* 갤러리 리스트 */
#wrap .sub_board ul.bbs_gallery {margin-left:0px;padding: 50px 0 40px; display: flex; flex-wrap: wrap; gap: 52px; font-size: var(--title-20); border-top: 2px solid var(--black-color00); border-bottom: 1px solid var(--border-color01); }
#wrap ul.bbs_gallery li {width: calc(100% / 3 - 34.6667px); position:relative;  }
#wrap ul.bbs_gallery li a {position:absolute;left:0;top:0;right:0;bottom:0;z-index:5;}
#wrap ul.bbs_gallery_top {padding:0 0 0 0;}
#wrap ul.bbs_gallery li .thumb {text-align:center;width:100%;padding:0 0 66.5%;height:0;position: relative; box-sizing:border-box;overflow:hidden;vertical-align:top;font-size:0; transition: all 0.4s;}
#wrap ul.bbs_gallery li .thumb a {vertical-align:top;}

#wrap ul.bbs_gallery li .thumb img {width: 100%;height: 100%;vertical-align:top;box-sizing:border-box;position: absolute;left:50%;top:50%;transform:translate(-50%, -50%); object-fit: cover; }

#wrap ul.bbs_gallery li .txt_info { margin: 20px 0 0; }
#wrap ul.bbs_gallery li dt { color: var(--black-color00); font-weight: 500; font-size: 120%; letter-spacing: -0.03em; font-family: var(--font-type01); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

#wrap ul.bbs_gallery li .desc { display: flex; margin: 17px 0 0; }
#wrap ul.bbs_gallery li .desc p { color: var(--black-color08); font-weight: 400; font-size: var(--title-16); letter-spacing: -0.03em; }
#wrap ul.bbs_gallery li .desc p:nth-child(1) { display: flex; align-items: center; }
#wrap ul.bbs_gallery li .desc p:nth-child(1):has(+ *)::after { content: ''; display: inline-block;  width: 1px; height: 12px; background: var(--black-color12); margin: 0 16px; }

#wrap ul.bbs_gallery li.no_data {line-height:20px;padding:122px 0;}

#wrap .bbs_no_data {padding:1.2%;font-size:13px;line-height:20px;border-top:1px #ddd solid;border-bottom:1px #ddd solid;text-align:center;box-sizing:border-box;}


#wrap ul.bbs_gallery li:hover .thumb { box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.15); }


/* 일반 리스트 */

#wrap table.bbs_list {border-top:2px solid var(--black-color03);border-bottom:0;width:100%;text-align:center;table-layout:fixed;box-sizing:border-box; font-family: var(--font-type01); font-size: var(--title-18);}
#wrap table.bbs_list thead tr {border-bottom: 1px solid var(--black-color01);  }
#wrap table.bbs_list tbody tr {border-bottom: 1px solid var(--border-color01); transition: all 0.4s; }

#wrap table.bbs_list tr :where(th, td){border:0;font-size: 100%;line-height: 1.4;letter-spacing: -0.03em;}

#wrap table.bbs_list th {font-weight: 500; color: var(--black-color01); padding: 28px 5px;}
#wrap table.bbs_list td {font-weight: 400; color: var(--black-color05); padding: 28px 5px 27px;}

#wrap table.bbs_list td.left{padding-left: 5px;padding-right: 10px; text-align: left; color: var(--black-color03); font-weight: 400; letter-spacing: -0.05em; }
#wrap table.bbs_list td.left h3 { font-weight: inherit; }
#wrap table.bbs_list td.left strong { font-weight: inherit; }

#wrap table.bbs_list td a{white-space:normal; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
#wrap table.bbs_list td a img{margin-left: 8px; vertical-align: baseline; }

#wrap table.bbs_list td h3 { display: flex; align-items: center; }
#wrap table.bbs_list td strong{font-weight: inherit; display: inline-block; max-width: calc(100% - 40px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

#wrap table.bbs_list td .board_ico { display: inline-block; }

#wrap table.bbs_list td.td_num { font-family: var(--font-type02); }

#wrap table.bbs_list td.td_date,
#wrap table.bbs_list td.td_hit { font-family: var(--font-type02); font-size: var(--title-17); }

#wrap table.bbs_list td.td_name { font-size: var(--title-17); }

#wrap table.bbs_list .board_notice td.left { color: var(--black-color01); font-weight: 500; }

#wrap table.bbs_list .board_notice .td_notice span { display: flex; justify-content: center; align-items: center; width: fit-content; padding: 2px 11px 3px; margin: 0 auto; border: 1px solid var(--point-color01); color: var(--point-color01); border-radius: 50px; font-weight: 600; font-size: var(--title-15); letter-spacing: -0.03em; box-sizing: border-box; }


@media (hover: hover) and (pointer: fine){
    #wrap table.bbs_list tbody tr:not(.no_data):hover { background: var(--gray-bg03); }
}


/* pagaing wrap */
.paging {text-align:center; font-size:0; margin:0 auto; margin-top: 50px; vertical-align:top; box-sizing:border-box;}
.paging span {display:inline-block;vertical-align:top;}
.paging a {display:inline-block; font-size: var(--title-16); color: var(--black-color01); padding:0; border: 1px solid var(--border-color01); box-sizing:border-box;width:40px;height:40px;line-height:38px;text-align:center; vertical-align:top;}
.paging a img {height:33px;width:33px;vertical-align:top;}

.paging span.page_num + span.page_num a,
.paging a + a,
.paging a + span.page_num a,
.paging span.arrow + span.arrow a{border-left:0;}



.paging .on a,
.paging a.on {color:var(--point-white); background: var(--black-color01); border-color: transparent; }



.paging .arrow a {font-size:0; width:40px; }
.paging .arrow a img {display:none;}

.paging .arrow.first a {background:#fff url("../images/da_image/ico_pagi_first.svg") no-repeat center 50%;background-size: 10px 10px;}
.paging .arrow.prev a {background:#fff url("../images/da_image/ico_pagi_prev.svg") no-repeat center 50%;background-size: 6px 10px; margin-right: 10px; }

.paging .arrow.next a {background:#fff url("../images/da_image/ico_pagi_next.svg") no-repeat center 50%;background-size: 6px 10px; margin-left: 10px; }
.paging .arrow.last a {background:#fff url("../images/da_image/ico_pagi_last.svg") no-repeat center 50%;background-size: 10px 10px;}
.view_btn {text-align:center; position:relative; }
.view_btn .paging {display:inline-block;}


#wrap select, 
#wrap input[type="text"], 
#wrap input[type="password"], 
#wrap input[type="number"], 
#wrap input[type="date"] { height: 56px; background: var(--point-white); color: var(--black-color04); font-size: var(--title-17); font-family: var(--font-type01); font-weight: 400; border: 1px solid var(--border-color01); padding: 0 20px; letter-spacing: -0.03em; overflow: hidden; box-sizing: border-box; border-radius: 4px; outline: 0; text-overflow: ellipsis; overflow: hidden !important; white-space: nowrap; }



#wrap select { width: 100%; padding-right: 30px; background: var(--point-white) url('../images/da_image/ico_select_arw.svg') no-repeat center right 18px; appearance: none; border-radius: 4px; cursor: pointer; }

#wrap input[type="text"]::placeholder, 
#wrap input[type="password"]::placeholder, 
#wrap input[type="number"]::placeholder,
#wrap input[type="date"]::placeholder { font-size: 100%; font-weight: 400; color: var(--black-color05); }


#wrap select:focus, 
#wrap input[type="text"]:focus, 
#wrap input[type="password"]:focus, 
#wrap input[type="number"]:focus, 
#wrap input[type="date"]:focus { outline: 0; }

#wrap .board_search { width: 100%; margin-bottom: 30px; box-sizing: border-box; padding: 0; line-height: inherit; text-align: left; overflow: hidden; }

#wrap .board_search .search_wrap { display: flex; justify-content: flex-end; gap: 10px; }
#wrap .board_search .board_search_sel { width: 160px; }

#wrap .board_search .inp_custom { position: relative; width: 100%; max-width: 460px; }
#wrap .board_search .inp_custom input[type="submit"] { position: absolute; right: 0; width: 56px; height: 56px; appearance: none; border: none; font-size: 0; background: url('../images/da_image/ico_search.svg') no-repeat center; background-size: 22px 22px; }

#wrap .board_search .inp_custom input[type="text"] { padding: 0 60px 0 20px; box-sizing: border-box; width: 100%; margin: 0; }



/* 뷰페이지 */

#wrap .bbs_view { border-bottom: 1px solid var(--black-color00); }
#wrap .bbs_view div.view_tit {width:100%; box-sizing:border-box; padding: 0 0 26px; border-bottom: 2px solid var(--black-color00); background: #fff; font-size: var(--title-20); text-align: left;}
#wrap .bbs_view div.view_tit:after {clear:both;content:"";display:block;}

#wrap .bbs_view div.view_tit > h3 {font-size: 150%; width: 100%; color: var(--black-color03); font-weight: 500; line-height: 1.5; letter-spacing: -0.04em; font-family: var(--font-type01); }

#wrap .bbs_view div.view_tit > p {display: flex; align-items: center; width: 100%; padding-top: 14px; text-align: left;}
#wrap .bbs_view div.view_tit > p span {font-size: var(--title-16); font-weight: 400; color:var(--black-color08); font-family: var(--font-type02);}
#wrap .bbs_view div.view_tit > p span + span { display: flex; align-items: center; }
#wrap .bbs_view div.view_tit > p span + span:before {content:'';display:inline-block;width:1px;height:12px;background:var(--border-color01);margin:0 14px;}
#wrap .bbs_view div.view_tit > p span em { font-weight: 400; margin-right: 4px;}

#wrap .bbs_view div.view_cont {padding: 40px 30px 60px; border: 0; font-size:var(--title-18); color: var(--black-color04); font-weight: 400; font-family: var(--font-type01); }


#wrap .sub_board .bbs_view .extra_editor_wrap {display:table;table-layout:fixed;border-collapse:collapse;width:100%;border:0; background: var(--gray-bg01); margin-bottom: 30px; border-radius: 4px; }
#wrap .sub_board .bbs_view .extra_editor_wrap > h4, 
#wrap .sub_board .bbs_view .extra_editor_wrap > div.extra_cont {padding: 32px 0;display:table-cell;box-sizing:border-box;border-collapse:collapse;vertical-align:middle;text-align:left;border: 0;}

#wrap .sub_board .bbs_view .extra_editor_wrap > h4 {width:166px;background:none;color: var(--black-color02);font-size: var(--title-18);font-weight: 500;text-align: center;position:relative;z-index:1;}
#wrap .sub_board .bbs_view .extra_editor_wrap > h4:after {content:''; position:absolute;width:1px;height:calc(100% - 64px);background:var(--border-color01);top:50%;right:0;transform:translateY(-50%);}

#wrap .sub_board .bbs_view .extra_editor_wrap div.extra_cont {width: calc(100% - 166px);padding-left: 40px;padding-right:40px;}

#wrap .sub_board .bbs_view .extra_editor_wrap div.img_cont {}

#wrap .sub_board .bbs_view .extra_editor_wrap div.extra_cont > span {font-size: var(--title-17);font-weight:400;color: var(--black-color06) !important;vertical-align:middle;display:block;}
#wrap .sub_board .bbs_view .extra_editor_wrap div.extra_cont > span a {font-size:inherit;color:inherit !important;font-weight:inherit;}
#wrap .sub_board .bbs_view .extra_editor_wrap div.extra_cont > span + span {margin-top:12px;}


#wrap .sub_board .view_btn.btns { display: flex; justify-content: center; align-items: center; gap: 10px; }
#wrap .sub_board .view_btn .btn { display: flex; justify-content: center; align-items: center; margin-top: 40px; width: 160px; height: 64px; border: 1px solid var(--black-color12); background: var(--point-white); color: var(--black-color03); font-weight: 400; font-size: 18px; font-family: var(--font-type01); letter-spacing: -0.03em; box-sizing: border-box;}

#wrap .sub_board .view_btn .btn_center .btn { margin-inline: auto; }
#wrap .sub_board .view_btn .btn_right .btn { margin-left: auto; }





/* 쓰기 페이지 */

#wrap .bbs_write_box{box-sizing:border-box;padding:30px 20px;gap:20px;display: flex;flex-direction: column;flex-wrap:wrap;border-top:1px solid var(--black-color03);border-bottom:1px solid var(--border-color01);}
#wrap .bbs_write_box .line2{display: flex;flex-wrap:wrap;gap:80px;}
#wrap .bbs_write_box .line2 dl{width:calc(50% - 40px);max-width:590px;}
#wrap .bbs_write_box dl{display: flex;flex-wrap:wrap;width:100%;align-items: flex-start;}
#wrap .bbs_write_box dl dt{width:150px;font-size:var(--title-20);color:var(--black-color03);font-weight:500;display: flex;align-items: center;min-height:60px;text-align:left;}
#wrap .bbs_write_box dl dt .require_dot{font-size:inherit;color:var(--point-color01);font-weight:inherit;display: inline-block;margin-left:3px;}
#wrap .bbs_write_box dl dd{box-sizing:border-box;width:calc(100% - 150px);min-height:60px;display: flex;align-items: center;}
#wrap .bbs_write_box dl dd ul{display: flex;gap:20px;align-items: center;height:100%;flex-wrap:wrap;}
#wrap .bbs_write_box dl dd input[type="text"]{width:100%;height:60px;box-sizing:border-box;border-radius:4px;border:1px solid var(--border-color01);padding:0 20px;font-size:var(--title-18);color:var(--black-color03);font-weight:400;}
#wrap .bbs_write_box dl dd input[type="text"]:focus, #wrap .bbs_write_box textarea:focus{border-color:var(--black-color01);}
#wrap .bbs_write_box dl dd input[type="text"]::place-holder, #wrap .bbs_write_box textarea::placeholder{color:var(--black-color08);}
#wrap .bbs_write_box dl dd select{width:240px;height:60px;}

#wrap .bbs_write_box textarea{resize:none;width:100%;height:200px;box-sizing:border-box;border-radius:4px;border:1px solid var(--border-color01);padding:20px 20px;font-size:var(--title-18);color:var(--black-color03);font-weight:400;letter-spacing:-0.03em;}

#wrap .bbs_write_box dl.captcha_dl dd{gap:10px;}
#wrap .bbs_write_box .captcha_wrap{border:1px solid var(--border-color01);padding:10px;box-sizing: border-box; display: flex; gap:10px;border-radius:4px;}
#wrap .bbs_write_box #captcha_box{margin:0;}
#wrap .bbs_write_box #captcha_box img{width:155px !important;height:40px !important;box-sizing:border-box;border-radius:4px;border:1px solid var(--border-color01);}
#wrap .bbs_write_box #refreshCode{display: inline-flex; background: url('../images/da_image/icon_reset.svg') no-repeat center; font-size: 0; cursor: pointer; min-width: 40px; width: 40px; height: 40px; border:1px solid var(--border-color01); box-sizing: border-box;border-radius:4px;}
#wrap .bbs_write_box input#captcha{max-width: 300px; margin:0;}

#wrap .policy_wrap{box-sizing: border-box; margin-top: 40px;}
#wrap .policy_wrap .area_box{margin-top: 20px;}
#wrap .area_box{width: 100%; padding:10px;box-sizing: border-box;border-radius:4px;border:1px solid var(--border-color01);}
#wrap .area_box textarea{width: 100%; padding:5px 7px; border:0; background: none; box-sizing: border-box; font-size: var(--title-14); font-weight: 400; color: var(--black-color08); line-height: 1.6; font-family: var(--font-type01);height:137px;}
#wrap .area_box textarea::-webkit-scrollbar { width: 4px;}
#wrap .area_box textarea::-webkit-scrollbar-thumb {background: var(--black-color10); border-radius: 10px;}
#wrap .area_box textarea::-webkit-scrollbar-track {border-radius: 10px;background:var(--border-color01);}



#wrap input[type="checkbox"] { display:none; }
#wrap input[type="checkbox"] + label {min-height: 25px; font-size:var(--title-18); color: var(--black-color03); cursor:pointer;}

#wrap input[type="checkbox"] + label::before, 
#wrap input[type="checkbox"] + label::before { display:inline-block; content:""; vertical-align:middle; width: 25px; height: 25px; margin: -3px 12px 0 0; background: url("../images/da_image/ico_chk.png") no-repeat center; background-size: cover;}

#wrap input[type="checkbox"]:checked + label::before, 
#wrap input[type="checkbox"]:checked + label::before {background: url("../images/da_image/ico_chk_on.png") no-repeat center; background-size: cover;}




.faq_box{width:100%;margin-top:42px;}
.faq_box .faq_list{width:100%;box-sizing:border-box;border-top:2px solid var(--black-color03);}
.faq_box .faq_list > li{box-sizing:border-box;border-bottom:1px solid var(--border-color01);padding:24px 30px;position: relative;}
.faq_box .faq_list > li.faq_q{cursor:pointer;display:flex;align-items:center;flex-wrap:wrap;}
.faq_box .faq_list > li.faq_q:after{width:7px;height:7px;content:"";border:1px solid var(--black-color06);border-width:2px 2px 0 0;transform:rotate(135deg);display: inline-block;}
.faq_box .faq_list > li > span{display: inline-flex;box-sizing:border-box;width:40px;height:40px;border-radius:100%;border:1px solid var(--point-color01);font-size:var(--title-20);color:var(--point-color01);font-weight:500;letter-spacing:-0.02em;text-align: center;align-items: center;justify-content: center;font-family:var(--font-type01);}
.faq_box .faq_list > li .title{font-size:var(--title-20);color:#333;font-weight:500;letter-spacing:-0.02em;display: inline-block;vertical-align: middle;width:calc(100% - 49px);word-break:keep-all;padding-left:20px;box-sizing:border-box;}

.faq_box .faq_list li.faq_q.on:after{border-color:var(--point-color01);transform:rotate(-45deg);top:32px;}
.faq_box .faq_list li.faq_q.on > span{background:var(--point-color01);color:var(--point-white);}
.faq_box .faq_list li.faq_q.on .title{font-weight:600;}

/*답변*/
.faq_box .faq_list li.faq_a{background:var(--gray-bg01);border-bottom:1px solid var(--border-color);padding:30px 30px;display: none;}
.faq_box .faq_list li.faq_a > span{border:none;background:var(--point-white);}
.faq_box .faq_list li.faq_a > div{width:calc(100% - 44px);box-sizing:border-box;padding-left:20px;display: inline-block;vertical-align: top;margin-top:-32px;word-break:break-all;white-space:pre-line;font-size:var(--title-18);color:var(--black-color04);font-weight:400;line-height:1.88;letter-spacing:-0.02em;}
/* .faq_box .faq_list li.faq_a > div{width:calc(100% - 44px);box-sizing:border-box;padding-left:20px;display: inline-block;vertical-align: top;margin-top:4px;font-size:var(--title-18);color:var(--black-color04);font-weight:400;line-height:1.88;letter-spacing:-0.02em;} */



/*───────────────────────────────────────────────────────────
	
	어바웃

───────────────────────────────────────────────────────────*/

/********** 컴퍼니 공통 ***************/
.sub_title.sub_company_title { margin: 0 0 59px; }
.sub_title.sub_company_title h3::after { display: none; }
.sub_title.sub_company_title h3 { font-size: 190%; }

.sub_about { display: flex; gap: 80px; }
.sub_about .img { position: relative; max-width: 410px; max-height: 520px; border-radius: 14px; }
.sub_about .img img { border-radius: inherit; }
.sub_about .img::before { content: ''; position: absolute; left: -60px; bottom: -60px; width: 200px; height: 200px; border-radius: 14px; background: var(--gray-bg01); z-index: -1; }


.sub_about .txt { font-size: var(--title-20); padding-top: 1px; width: calc(100% - 490px); }

.sub_about .txt h4 { color: var(--black-color01); font-weight: 600; font-size: 150%; line-height: 1.53; letter-spacing: -0.03em; margin-bottom: 30px; }
.sub_about .txt h4 span { display: block; font-weight: 400; }
.sub_about .txt h4 strong { color: var(--point-color01); font-weight: 600; }
.sub_about .txt p:not(.name) { color: var(--black-color01); font-weight: 400; font-size: 85%; line-height: 1.76; letter-spacing: -0.03em; }
.sub_about .txt p:not(.name) + p:not(.name) { margin-top: 16px; }

.sub_about .txt .name { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 40px; color: var(--black-color00); font-weight: 400; font-size: 85%; line-height: 1.64; letter-spacing: -0.03em; }
.sub_about .txt .name span { display: block;  }
.sub_about .txt .name strong { font-size: var(--title-30); font-weight: 600; line-height: 1.3; }

@media screen and (max-width: 1220px){
    .sub_about br.del { display: none; }
}

/*───────────────────────────────────────────────────────────
	
	설립 목적

───────────────────────────────────────────────────────────*/

.sub_int_exa { font-size: var(--title-20); }
.sub_int_exa dl:first-child { margin-top: -1px; }
.sub_int_exa dt { position: relative; margin-bottom: 23px; padding-left: 20px; color: var(--black-color00); font-weight: 600; line-height: 1; box-sizing: border-box; letter-spacing: 0; }
.sub_int_exa dt::before { content: ''; position: absolute; left: 0; top: 5px; width: 10px; height: 10px; background: var(--point-white); box-sizing: border-box; border: 3px solid var(--point-color01); border-radius: 100%; }

.sub_int_exa dd p { color: var(--black-color01); font-weight: 400; font-size: 85%; line-height: 1.76; letter-spacing: -0.03em; }
.sub_int_exa dd p + p { margin-top: 16px; }
.sub_int_exa .img { width: 80%; border-radius: 14px; margin-top: 39px; overflow: hidden; margin-inline: auto; }

.sub_int_exa dl + dl { margin-top: 62px; }

.sub_int_exa div:has(.num_list) { box-sizing: border-box; padding: 31px 30px 29px; border-radius: 10px; background: var(--gray-bg01); margin-top: 19px; }
.sub_int_exa div:has(.num_list) + p { margin-top: 41px; }

.sub_int_exa .num_list { counter-reset: num 0;  }
.sub_int_exa .num_list > li { position: relative; padding-left: 40px; color: var(--black-color00); font-weight: 400; font-size: 85%; letter-spacing: -0.05em; line-height: 1.76; box-sizing: border-box; }
.sub_int_exa .num_list > li::before { position: absolute; left: 0; top: -1px; content: counter(num, decimal-leading-zero); counter-increment: num 1; display: flex; justify-content: center; align-items: center; width: 30px; height: 30px; border-radius: 30px; background: var(--point-color02); color: var(--point-white); font-family: var(--font-type02); font-size: var(--title-14); font-weight: 400; letter-spacing: -0.03em; line-height: 1; box-sizing: border-box; padding-top: 2px; }

.sub_int_exa .num_list > li + li { margin-top: 12px; }


@media screen and (max-width: 1337px){
    .sub_int_exa dd p br.del { display: none; }
}

@media screen and (max-width: 1300px){
    .sub_int_exa br.del { display: none; }
}

/*───────────────────────────────────────────────────────────
	
	기구표

───────────────────────────────────────────────────────────*/

.sub_work { font-size: var(--title-20); max-width: 1125px; margin: 0 auto; text-align: center; }
.sub_work em { font-weight: inherit;}
.sub_work h5 { display: flex; justify-content: center; align-items: center; width: 220px; height: 220px; border-radius: 100%; background: rgba(12, 46, 134, 0.05); margin-inline: auto; }
.sub_work h5 span { position: relative; display: inline-flex; justify-content: center; align-items: center; width: 180px; height: 180px; border-radius: 100%; background: var(--point-color01); box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25); color: var(--point-white); font-size: 170%; font-weight: 500; line-height: 1; letter-spacing: -0.03em; box-sizing: border-box; padding: 5px 10px; }
.sub_work h5 span::before { content: ''; position: absolute; left: 50%; top: 100%; transform: translate(-50%, -50%); width: 10px; height: 10px; border-radius: 100%; background: var(--point-white); border: 2px solid var(--point-color01); box-sizing: border-box; }
.sub_work h5 span::after { content: ''; position: absolute; left: calc(50% - 1px); top: calc(100% + 5px); transform: translateX(-50%); width: 0.1px; height: 80px; background: var(--black-color12); }

.sub_work .center_box { display: flex; justify-content: space-between; margin: 69px auto 0; }
.sub_work .center_box p { position: relative; display: flex; justify-content: center; align-items: center; width: calc(100% / 3 - 94px); height: 60px; background: var(--point-color02); color: var(--point-white); font-weight: 400; font-size: 100%; font-family: var(--font-type03); line-height: 1.1; letter-spacing: -0.03em; border-radius: 6px; z-index: 3; box-sizing: border-box; padding: 5px 10px;  }
.sub_work .center_box p::before { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 100%; background: var(--point-white); border: 2px solid var(--point-color02); box-sizing: border-box; }
.sub_work .center_box p::after { content: ''; position: absolute; background: var(--black-color12); box-sizing: border-box; }


.sub_work .center_box p:nth-child(1)::before { left: 100%; top: 50%; transform: translate(-50%, -50%); z-index: 2; }
.sub_work .center_box p:nth-child(1)::after { width: calc(50% + 10px); height: 0.1px; left: calc(100% + 5px); top: calc(50% - 1px); transform: translateY(-50%); }

.sub_work .center_box p:nth-child(2) { z-index: 4; }
.sub_work .center_box p:nth-child(2)::before { left: 50%; top: 0; transform: translate(-50%, -50%); z-index: 2; }
.sub_work .center_box p:nth-child(2)::after { content: ''; position: absolute; left: calc(50% - 1px); top: 0; transform: translateY(100%); width: 1px; height: 60px; background: var(--black-color12); }

.sub_work .center_box p:nth-child(3)::before { left: 0; top: 50%; transform: translate(-50%, -50%); z-index: 2; }
.sub_work .center_box p:nth-child(3)::after { width: calc(50% + 10px); height: 0.1px; left: -5px; top: calc(50% - 1px); transform: translate(-100%, -50%); }

.sub_work .part_box { position: relative; margin-top: 60px; box-sizing: border-box; padding-top: 66px; font-family: var(--font-type03); }

.sub_work .part_box::after { content: ''; position: absolute; left: 50%; top: 0; width: calc(50% - 140px); height: 1px; background: var(--black-color12); }
.sub_work .part_box { display: flex; justify-content: flex-end; }
.sub_work .part_box > ul { display: flex; justify-content: flex-end; width: calc(100% - 422px); gap: 142px }

.sub_work .part_box span { position: relative; width: 100%; height: 60px; display: flex; justify-content: center; align-items: center; border-radius: 6px; box-sizing: border-box; padding: 5px 10px; }

.sub_work .part_box > ul > li { position: relative; width: 39.9%; }
.sub_work .part_box > ul > li::before { content: ''; position: absolute; left: calc(50% - 1px); top: 0; transform: translateY(-100%); width: 1px; height: 66px; background: var(--black-color12); }
.sub_work .part_box > ul > li > span { color: var(--point-white); font-weight: 400; letter-spacing: -0.04em; }
.sub_work .part_box > ul > li > span::before { content: ''; position: absolute; left: 50%; top: 0; width: 10px; height: 10px; border-radius: 100%; background: var(--point-white); border: 2px solid; box-sizing: border-box; transform: translate(-50%, -50%); z-index: 2; }


.sub_work .part_box > ul > li:nth-child(1) > span:nth-child(1) { background: var(--point-color04); }
.sub_work .part_box > ul > li:nth-child(1) > span:nth-child(1)::before { border-color: var(--point-color04); }

.sub_work .part_box > ul > li:nth-child(1) > span:nth-child(2) { background: var(--point-color05); margin-top: 26px; }
.sub_work .part_box > ul > li:nth-child(1) > span:nth-child(2)::before { border-color: var(--point-color05); }
.sub_work .part_box > ul > li:nth-child(1) > span:nth-child(2)::after { content: ''; position: absolute; left: 50%; top: 0; transform: translateY(-100%); width: 1px; height: 26px; background: var(--black-color12); }

.sub_work .part_box > ul > li:nth-child(2) > span { background: var(--point-color06); }
.sub_work .part_box > ul > li:nth-child(2) > span::before { border-color: var(--point-color06); }
.sub_work .part_box > ul > li:nth-child(2) > ul { margin-top: 15px; }
.sub_work .part_box > ul > li:nth-child(2) > ul span { position: relative; border: 1px solid var(--border-color01); background: #F1F3F8; color: var(--black-color03); font-weight: 500; font-size: var(--title-17); letter-spacing: -0.04em; box-sizing: border-box; }
.sub_work .part_box > ul > li:nth-child(2) > ul li + li { margin-top: 10px; }


.sub_work .part_box > ul > li:nth-child(2) > ul span::before { content: ''; width: 1px; height: 12px; position: absolute; left: calc(50% - 1px); top: 0; transform: translateY(-100%); background: var(--black-color12); }
.sub_work .part_box > ul > li:nth-child(2) > ul > li:nth-child(1) span::before { height: 16px; }

/*───────────────────────────────────────────────────────────
	
	찾아오시는 길

───────────────────────────────────────────────────────────*/

.sub_location .map { width: 100%; height: 617px; border-radius: 10px; }
.sub_location .map > * { border-radius: 10px; }

.sub_location .info { margin-top: 41px; }
.sub_location .info dl { display: flex; gap: 20px; font-size: var(--title-20); box-sizing: border-box; }
.sub_location .info dt { position: relative; width: 130px; padding-left: 24px; color: var(--black-color02); font-size: 90%; font-weight: 500; line-height: 1.34; letter-spacing: -0.03em; box-sizing: border-box; }
.sub_location .info dt::before { content: ''; position: absolute; left: 0; top: 8px; display: block; width: 6px; height: 6px; background: var(--point-color01); border-radius: 100%; }

.sub_location .info dt span { display: block; margin-top: -1px; }

.sub_location .info dd { color: var(--black-color05); font-weight: 400; font-size: 90%; letter-spacing: -0.03em; line-height: 1.34; }


.sub_location .info dl:not(:first-child) { padding-top: 25px; }
.sub_location .info dl:not(:last-child) { padding-bottom: 24px; }
.sub_location .info dl + dl { border-top: 1px solid var(--border-color01); }


/*───────────────────────────────────────────────────────────
	
	시험 소개

───────────────────────────────────────────────────────────*/

.sub_exam { font-size: var(--title-20); }
.sub_exam dl:first-child { margin-top: -1px; }
.sub_exam dt { position: relative; margin-bottom: 23px; padding-left: 20px; color: var(--black-color00); font-weight: 600; line-height: 1; box-sizing: border-box; letter-spacing: 0; }
.sub_exam dt::before { content: ''; position: absolute; left: 0; top: 5px; width: 10px; height: 10px; background: var(--point-white); box-sizing: border-box; border: 3px solid var(--point-color01); border-radius: 100%; }

.sub_exam dt span { color: var(--point-color01); }

.sub_exam dd p { color: var(--black-color01); font-weight: 400; font-size: 85%; line-height: 1.76; letter-spacing: -0.03em; }
.sub_exam dd p + p { margin-top: 16px; }


.sub_exam dl + dl { margin-top: 62px; }

.sub_exam table th,
.sub_exam table td { text-align: center; }



.sub_exam table th,
.sub_exam table td { box-sizing: border-box; padding: 20px 10px; border: 1px solid var(--border-color01); }
.sub_exam table td.left { border-right: 0; }