@charset "utf-8";




/*───────────────────────────────────────────────────────────
	
	서브페이지 공통

───────────────────────────────────────────────────────────*/
#wrap:has(#container) #header .logo a { filter: var(--filter-point); }



.sub_nav { border-bottom: 1px solid var(--border-color03); font-size: var(--title-20); font-family: var(--font-type02); }
.sub_nav ul { display: flex; gap: 20px 51px; flex-wrap: nowrap; overflow: hidden; overflow-x: auto; width: calc(100% + 30px); margin-left: -15px; }
.sub_nav li { position: relative; color: var(--black-color06); font-weight: 500; font-size: 80%; line-height: 1.37; letter-spacing: -0.04em; flex-shrink: 0; }
.sub_nav li a { display: block; width: 100%; height: 100%; font-weight: inherit; font-size: inherit; color: inherit; box-sizing: border-box; padding: 19px 0 17px; transition: all 0.4s; }
.sub_nav li::before { content: ''; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: var(--point-color01); transition: width 0.4s; }
.sub_nav li.on { color: var(--black-color00); }
.sub_nav li.on::before { width: 100%; }
.sub_nav li:first-child { margin-left: 15px; }
.sub_nav li:last-child { margin-right: 15px; }

.bullet_title { font-size: var(--title-20); font-family: var(--font-type02); margin-bottom: 20px; }
.bullet_title h2 { box-sizing: border-box; padding-left: 27px; position: relative; color: var(--black-color03); font-weight: 700; font-size: 130%; line-height: 1.31; letter-spacing: -0.03em; }
.bullet_title h2::before { content: ''; position: absolute; left: 0; top: 12px; width: 10px; height: 10px; background: var(--point-color01); border-radius: 100%; }

.sub_title { font-size: var(--title-20); margin-bottom: 20px; }
.sub_title h3 { color: var(--black-color01); font-weight: 500; font-size: 120%; letter-spacing: -0.03em; line-height: 1.34; }

.bullet_list > li { position: relative;  box-sizing: border-box; padding-left: 13px; font-weight: 400; font-size: var(--title-16); letter-spacing: -0.03em; line-height: 1.5; }
.bullet_list > li + li { margin-top: 9px; }
.bullet_list > li::before { content: ''; position: absolute; left: 0; top: 12px; width: 3px; height: 3px; background: var(--black-color07); }
.bullet_list > li strong { font-weight: 500; }


#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: center; gap: 10px; box-sizing: border-box; padding: 37px 30px; background: rgba(245, 245, 245, 0.96);  }
#wrap .board_search .board_search_sel { width: 160px; max-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/sub/ico_search.svg') no-repeat center; background-size: 22px 22px; }
#wrap .board_search .inp_custom input[type="text"] { width: 100%; margin: 0; padding-right: 56px; }

#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-color05); font-size: var(--title-16); font-weight: 400; border: 1px solid var(--border-color01); padding: 0 20px 0 19px; letter-spacing: -0.04em; overflow: hidden; box-sizing: border-box; outline: 0; text-overflow: ellipsis; overflow: hidden !important; white-space: nowrap; line-height: 1.57; }

#wrap select { margin: 0; width: 100%; padding-right: 36px; color: var(--black-color04); background: var(--point-white) url('../images/sub/ico_sel_arw.svg') no-repeat center right 18px; appearance: none; 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); letter-spacing: -0.045em; }

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


.sub_content .table_title { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 19px; margin-bottom: 40px; font-size: var(--title-20); box-sizing: border-box; border-bottom: 3px solid var(--black-color03); }
.sub_content .table_title h2 { color: var(--black-color00); font-weight: 500; font-size: 150%; line-height: 1.26; letter-spacing: -0.04em; }
.sub_content .table_title span { color: var(--black-color06); font-weight: 400; font-size: 85%; line-height: 1.17; letter-spacing: -0.04em; text-align: right; }

.sub_content .table_sub_title { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; margin-bottom: 19px; font-size: var(--title-20); flex-wrap: wrap; gap: 10px; }
.sub_content .table_sub_title h3 { color: var(--black-color00); font-weight: 500; font-size: 150%; line-height: 1.26; letter-spacing: -0.04em; padding-right: 10px; box-sizing: border-box; word-break:break-all; }
.sub_content .table_sub_title h3:has(small) { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 15px 22px; line-height: 1;  }
.sub_content .table_sub_title h3 small { color: var(--black-color03); font-weight: 500; font-size: var(--title-20); line-height: 1; letter-spacing: -0.04em;  }
.sub_content .table_sub_title h3:has(small) + span { color: var(--black-color07); font-size: var(--title-18); font-weight: 400; line-height: 1.12; letter-spacing: -0.025em; font-family: var(--font-type02); }
.sub_content .table_sub_title span { color: var(--black-color06); font-weight: 400; font-size: 85%; font-weight: 400; line-height: 1.17; letter-spacing: -0.04em; text-align: right; flex-shrink: 0; }



@media (hover: hover) and (pointer: fine){
    .sub_nav li:hover::before { width: 100%; }
    .sub_nav li:hover a { color: var(--black-color00); }
}


@media screen and (max-width: 1023px){
    .sub_content .table_title { margin-bottom: clamp(20px, 4vw, 40px); padding-bottom: clamp(15px, 1.9vw, 19px); }
    .sub_content .table_sub_title { margin-bottom: clamp(15px, 1.9vw, 19px); }
    #wrap .board_search { margin-bottom: clamp(15px, 3vw, 30px); }
    #wrap .board_search .search_wrap { padding: clamp(17px, 3.7vw, 37px) clamp(15px, 3vw, 30px); }
    #wrap .board_search .board_search_sel { width: 25%; }
    #wrap .board_search .inp_custom { width: calc(100% - (25% + 10px)); }
    
    .sub_title { margin-bottom: clamp(10px, 2vw, 20px); }

    .bullet_list > li + li { margin-top: clamp(7px, 0.9vw, 9px); }

    .bullet_title { margin-bottom: clamp(10px, 2vw, 20px); }
    .bullet_title h2 { padding-left: 24px; }
    .bullet_title h2::before { top: 11px; }

    .sub_nav ul { gap: clamp(15px, 2vw, 20px) clamp(15px, 5vw, 51px); }
    .sub_nav li a { padding: clamp(13px, 1.9vw, 19px) 0 clamp(13px, 1.7vw, 17px); }
    
}

@media screen and (max-width: 860px){
    #wrap select, 
    #wrap input[type="text"], 
    #wrap input[type="password"], 
    #wrap input[type="number"], 
    #wrap input[type="date"] { height: 49px; padding: 0 49px 0 15px; }
    #wrap .board_search .inp_custom input[type="submit"] { width: 49px; height: 49px; background-size: 20px 20px; }
    #wrap .board_search .inp_custom input[type="text"] { padding-right: 49px; }

    
    #wrap select { background-size: 13px 6px; padding-right: 30px; background-position: center right 15px; }

    .sub_content .table_title h2 { font-size: 140%; }
    .sub_content .table_sub_title h3 { font-size: 140%; }

    .bullet_list > li { padding-left: 10px; }
    .bullet_list > li::before { top: 10px; }

    .bullet_title h2 { padding-left: 18px; }
    .bullet_title h2::before { width: 8px; height: 8px; top: 10px; }
}

@media screen and (max-width: 640px){
    #wrap select, 
    #wrap input[type="text"], 
    #wrap input[type="password"], 
    #wrap input[type="number"], 
    #wrap input[type="date"] { height: 44px; padding: 0 44px 0 15px; }
    #wrap .board_search .inp_custom input[type="submit"] { width: 44px; height: 44px; background-size: 18px 18px; }
    #wrap .board_search .inp_custom input[type="text"] { padding-right: 44px; }

    #wrap select { background-size: 13px 6px; padding-right: 30px; background-position: center right 15px; }

    .sub_content .table_title h2 { font-size: 130%; }
    .sub_content .table_sub_title h3 { font-size: 130%; }

    .bullet_list > li { padding-left: 9px; }
    .bullet_list > li::before { top: 9px; }

    .bullet_title h2 { padding-left: 14px; }
    .bullet_title h2::before { width: 6px; height: 6px; top: 12px; }
}

@media screen and (max-width: 479px){
    #wrap select, 
    #wrap input[type="text"], 
    #wrap input[type="password"], 
    #wrap input[type="number"], 
    #wrap input[type="date"] { height: 40px; padding: 0 40px 0 10px; }
    #wrap .board_search .inp_custom input[type="submit"] { width: 40px; height: 40px; background-size: 16px 16px; }
    #wrap .board_search .inp_custom input[type="text"] { padding-right: 40px; }

    #wrap select { background-size: 12px 5px; padding-right: 25px; background-position: center right 10px; }

    .sub_content .table_title { border-bottom: 2px solid var(--black-color03); }
    .sub_content .table_title h2 { font-size: 120%; }
    .sub_content .table_sub_title h3 { font-size: 120%; }

    .bullet_list > li { padding-left: 8px; }
    .bullet_list > li::before { top: 8px; }

    .bullet_title h2 { padding-left: 12px; }
    .bullet_title h2::before { width: 5px; height: 5px; top: 12px; }
}

@media screen and (max-width: 350px){
    #wrap .board_search .search_wrap { flex-direction: column; }
    #wrap .board_search .board_search_sel { width: 100%; max-width: revert; }
    #wrap .board_search .inp_custom { width: 100%; }
}

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

───────────────────────────────────────────────────────────*/
#container:has(.sub_about) { padding-block: 82px 128px; }

.sub_about { font-size: var(--title-20); }
.sub_about h2 { color: var(--black-color03); font-weight: 400; font-size: 90%; text-align: center; line-height: 1.78; letter-spacing: -0.05em; }
.sub_about h2 strong { color: var(--point-color01); font-weight: 600; }

.sub_about .circle_box { display: flex; justify-content: center; width: 100%; flex-shrink: 0; }
.sub_about .circle_wrap { margin-top: 60px; display: flex; justify-content: center; gap: 0 138px; margin-left: 20px; }
.sub_about .circle_wrap li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 30px; width: 241px; }
.sub_about .circle { width: 160px; height: 160px; border: 1px dashed var(--point-color01); border-radius: 100%; box-sizing: border-box; padding: 9px; flex-shrink: 0; }
.sub_about .circle strong { position: relative; box-sizing: border-box; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; border-radius: inherit; background: var(--gray-bg01); border: 1px solid var(--point-white); color: var(--point-color01); font-weight: 600; font-family: var(--font-type02); font-size: 120%; line-height: 1.17; letter-spacing: -0.02em; box-shadow: 15px 15px 20px rgba(0, 0, 0, 0.15); text-align: center;  }

.sub_about li .circle_box { position: relative; }
.sub_about li .circle_box::before,
.sub_about li .circle_box::after { content: ''; position: absolute; top: 50%; transform: translateY(-50%); width: 5px; height: 5px; background: var(--gray-bg04); border-radius: 100%; }

.sub_about li:first-child .circle_box::before { display: none; }
.sub_about li:last-child .circle_box::after { display: none; }
.sub_about li .circle_box::before { left: -14px; }
.sub_about li .circle_box::after { right: -15px; }
.sub_about li:not(:last-child) .circle::after { content: ''; position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); width: calc(50% - 5px); height: 1px; background: var(--gray-bg04); }


.sub_about .desc { color: var(--black-color05); font-size: 80%; font-weight: 350; text-align: center; line-height: 1.63; letter-spacing: -0.04em; }



@media screen and (max-width: 1080px){
    .sub_about .circle_wrap { margin-left: 0; gap: 0 10vw; }
    .sub_about .circle_wrap li { min-width: initial; width: calc(100% / 3); }
    .sub_about li .circle_box::before { left: 0; }
    .sub_about li .circle_box::after { right: 0; }
    .sub_about li:not(:last-child) .circle::after { left: 100%; width: 10vw; }
}

@media screen and (max-width: 1023px){

    #container:has(.sub_about) { padding-block: clamp(50px, 8.2vw, 82px) clamp(100px, 12.8vw, 128px); }
    .sub_about h2 { text-wrap: balance; }

    .sub_about br.del { display: none; }
    .sub_about .circle_wrap { margin-top: clamp(30px, 6vw, 60px); }
    .sub_about .circle_wrap li { min-width: initial; gap: clamp(15px, 3vw, 30px) 0; }
    .sub_about li:not(:first-child) .circle::before { left: -40%; }

    .sub_about .circle { width: 150px; height: 150px; }
    

}

@media screen and (max-width: 860px){
    .sub_about .circle { width: 140px; height: 140px; }
    .sub_about .circle strong { font-size: 110%; }
}

@media screen and (max-width: 640px){
    .sub_about .circle { width: 130px; height: 130px; }
    .sub_about .circle_wrap { flex-direction: column; gap: 80px 0; }
    .sub_about .circle_wrap li { width: 100%; }
    .sub_about .desc { text-wrap: balance; }

    .sub_about li .circle_box::after { display: none; }
    .sub_about li .circle_box:not(:last-child) .circle::after { display: none; }

    .sub_about li{ position: relative; }
    .sub_about li::before,
    .sub_about li::after { content: ''; position: absolute; left: 50%; transform: translateX(-50%); width: 5px; height: 5px; background: var(--gray-bg04); border-radius: 100%; }

    .sub_about li::after { bottom: -22px; }
    .sub_about li::before { top: -22px; }

    .sub_about li:first-child::before { display: none; }
    .sub_about li:last-child::after { display: none; }
    .sub_about li:not(:first-child) .circle_box::before { content: ''; position: absolute; top: -40px; left: calc(50% - 0.5px); height: 42px; width: 1px; background: var(--border-color01); }
}

@media screen and (max-width: 479px){
    .sub_about .circle { width: 120px; height: 120px; }
    .sub_about .circle strong { font-size: 100%; }
}

/*───────────────────────────────────────────────────────────
	
	컨택트

───────────────────────────────────────────────────────────*/
#container:has(.sub_location) { padding-block: 63px 128px; }
.sub_location .loca_con + .loca_con { margin-top: 83px; }

.sub_location .map { width: 100%; height: 600px; position: relative; z-index: 2; }
.sub_location .map iframe{width: 100%; height: 100%;}
.sub_location .info_wrap { position: relative; }
.sub_location .info_wrap::before { content: ''; position: absolute; width: 100%; height: 100%; box-sizing: border-box; border: 1px solid var(--border-color01); }
.sub_location .info { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; box-sizing: border-box; gap: 20px 0; padding: 40px 50px 42px 40px; }
.sub_location .info dl { position: relative; display: flex; align-items: flex-start; box-sizing: border-box; font-size: var(--title-20); font-family: var(--font-type02); }
.sub_location .info dl:has(+ dl){ margin-right: 41px; padding-right: 41px;  }
.sub_location .info dl:has(+ dl)::after { content: ''; position: absolute; right: 0; width: 1px; height: 30px; top: -1px; background: var(--border-color03); }
.sub_location .info dt { flex-shrink: 0; box-sizing: border-box; padding-left: 44px; padding-top: 2px; margin-right: 22px; position: relative; color: var(--black-color02); font-weight: 500; font-size: 90%; line-height: 1.34; letter-spacing: -0.03em }
.sub_location .info dt::before { content: ''; position: absolute; left: 0; top: 0; width: 30px; height: 30px; }
.sub_location .info dd { color: var(--black-color05);  font-weight: 400; font-size: 90%; line-height: 1.34; letter-spacing: -0.04em; }
.sub_location .info dl:nth-child(1) dt::before { background: url('../images/sub/ico_mark.svg') no-repeat center; background-size: 100% auto; }
.sub_location .info dl:nth-child(1) dd { font-family: var(--font-type01); }
.sub_location .info dl:nth-child(2) dt::before { background: url('../images/sub/ico_tel.svg') no-repeat center; background-size: 100% auto; }
.sub_location .info dl:nth-child(3) dt::before { background: url('../images/sub/ico_fax.svg') no-repeat center; background-size: 100% auto; }

.sub_location .loca_logi .info { margin-right: 10px; }

.sub_location .loca_trans { margin-top: 50px; }
.sub_location .loca_trans dl { display: flex; border: 1px solid var(--border-color01); box-sizing: border-box; }
.sub_location .loca_trans dt { width: 14.52%; flex-shrink: 0; aspect-ratio: 1/1; box-sizing: border-box; padding: 28px 10px; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 24px 0; color: var(--black-color01); font-weight: 500; font-size: var(--title-20); line-height: 1.2; font-family: var(--font-type04); }
.sub_location .loca_trans dd { display: flex; align-items: center; box-sizing: border-box; padding: 28px 29px; border-left: 1px solid var(--border-color01);  }
.sub_location .loca_trans dd p { color: var(--black-color05); }
.sub_location .loca_trans dd strong { color: var(--black-color03); font-weight: 500; }

.sub_location .loca_trans dl.sub_tran { margin-top: 20px; }
.sub_location .loca_trans dl.sub_tran dd p { color: var(--black-color01); }
.sub_location .loca_trans dl.sub_tran dd strong { display: inline-block; margin-left: 10px; color: var(--black-color01); }
.sub_location .loca_trans dl.sub_tran dd span { display: inline-block; color: var(--point-white); font-weight: 400; font-size: var(--title-14); line-height: 1.15; letter-spacing: -0.03em; box-sizing: border-box; padding: 4px 9px; border-radius: 20px; }
.sub_location .loca_trans dl.sub_tran dd span:has(+ span) { margin-right: 6px; }
.sub_location .loca_trans dl.sub_tran dd .line7 { background: #697215; }
.sub_location .loca_trans dl.sub_tran dd .bundang { background: #f6c014; }
.sub_location .loca_trans dl.sub_tran dd .line3 { background: #ff7300; }

.sub_location .loca_cs .cs_list { display: flex; gap: 20px; }
.sub_location .loca_cs .cs_list > li { display: flex; flex-direction: column; justify-content: flex-end; width: calc(100% / 2 - 10px); border: 1px solid var(--border-color01); box-sizing: border-box; padding: 28px 30px 38px; font-size: var(--title-20); }
.sub_location .loca_cs .cs_list > li strong { position: relative; display: block; width: fit-content; margin-inline: auto; color: var(--black-color03); font-weight: 600; font-size: 120%; line-height: 1; letter-spacing: 0; font-family: var(--font-type02); box-sizing: border-box; padding-left: 54px; }
.sub_location .loca_cs .cs_list > li strong::before { content: ''; position: absolute; left: 0; top: -9px; width: 40px; height: 40px; background: url('../images/sub/ico_tel02.svg') no-repeat center; background-size: 100% auto; }
.sub_location .loca_cs .cs_call_list { display: flex; justify-content: center; text-align: center; box-sizing: border-box; margin-bottom: 34px; padding-bottom: 30px; border-bottom: 1px solid var(--border-color03); }
.sub_location .loca_cs .cs_call_list li { position: relative; color: var(--black-color02); font-family: var(--font-type02); font-weight: 500; font-size: 90%; line-height: 1.34; letter-spacing: -0.03em; }
.sub_location .loca_cs .cs_call_list li:has(+ li) { margin-right: 27px; padding-right: 28px; }
.sub_location .loca_cs .cs_call_list li:has(+ li)::before { content: ''; position: absolute; right: 0; top: 5px; width: 1px; height: 16px; background: var(--border-color01); }

@media screen and (max-width: 1240px){
    .sub_location .info { padding-inline: 15px; }
    .sub_location .info dt { margin-right: 15px; padding-left: 36px; }
    .sub_location .info dl:has(+ dl) { padding-right: 15px; margin-right: 15px; }

    .sub_location .loca_cs .cs_call_list li:has(+ li) { margin-right: 15px; padding-right: 15px; }
}

@media screen and (max-width: 1023px){
    .sub_location .info { padding: clamp(20px, 5vw, 50px) clamp(20px, 2vw, 20px) clamp(20px, 4vw, 40px); flex-direction: column; align-items: flex-start; gap: clamp(15px, 2vw, 20px) 0; margin-right: 0; }
    .sub_location .map { height: clamp(300px, 60vw, 600px); }
    .sub_location .info dl:has(+ dl) { padding-right: 0; margin-right: 0; }
    .sub_location .info dl:has(+ dl)::after { display: none; }
    .sub_location .info dt { margin-right: clamp(15px, 2vw, 22px); padding-left: 32px; }
    .sub_location .info dt::before { width: 26px; height: 26px; }

    .sub_location .loca_trans { margin-top: clamp(25px, 5vw, 50px); }
    .sub_location .loca_trans dl.sub_tran { margin-top: clamp(15px, 2vw, 20px); }
    .sub_location .loca_trans dl:nth-child(2) dt .ico { width: 41px; }
    .sub_location .loca_trans dl:nth-child(3) dt .ico { width: 38px; }
    .sub_location .loca_trans dt { padding: clamp(15px, 2.8vw, 28px); gap: clamp(12px, 2.4vw, 24px) 0; }
    .sub_location .loca_trans dd { padding: clamp(15px, 2.8vw, 28px) clamp(15px, 2.9vw, 29px); }
    .sub_location .loca_trans dl.sub_tran dd strong { margin-left: clamp(5px, 1vw, 10px); }
    .sub_location .loca_trans dl.sub_tran dd span { padding: 4px clamp(7px, 0.9vw, 9px); }
    .sub_location .loca_trans dl.sub_tran dd span:has(+ span) { margin-right: clamp(3px, 0.6px, 6px); }

    .sub_location .loca_con + .loca_con { margin-top: clamp(40px, 8.3vw, 80px); }

    .sub_location .loca_cs .cs_list > li { padding: clamp(14px, 2.8vw, 28px) clamp(15px, 3vw, 30px) clamp(19px, 3.8vw, 38px); }
    .sub_location .loca_cs .cs_list > li strong { padding-left: 48px; }
    .sub_location .loca_cs .cs_list > li strong::before { width: 36px; height: 36px; top: -7px; }

    .sub_location .loca_cs .cs_call_list { margin-bottom: clamp(15px, 3.4vw, 34px); padding-bottom: clamp(15px, 3vw, 30px); flex-wrap: wrap; gap: 10px 0; min-height: 2em; }
    .sub_location .loca_cs .cs_call_list li { width: calc(100% / 2); }
    .sub_location .loca_cs .cs_call_list li:has(+ li) { padding-right: 0; margin-right: 0; }
    .sub_location .loca_cs .cs_call_list li:has(+ li)::before { top: 5px; height: 14px; }
    .sub_location .loca_cs .cs_call_list li:nth-child(2n)::before { display: none; }
}

@media screen and (max-width: 860px){

    .sub_location .info dt { padding-left: 30px; }
    .sub_location .info dt::before { width: 23px; height: 23px; }

    .sub_location .loca_trans dl:nth-child(2) dt .ico { width: 37px; }
    .sub_location .loca_trans dl:nth-child(3) dt .ico { width: 34px; }

    .sub_location .loca_trans dl.sub_tran dd p em { display: block; margin-bottom: 5px; }
    .sub_location .loca_trans dl.sub_tran dd strong { margin-left: 0; }

    .sub_location .loca_cs .cs_call_list li:has(+ li)::before { top: 4px; height: 12px; }
    .sub_location .loca_cs .cs_list > li strong { padding-left: 44px; }
    .sub_location .loca_cs .cs_list > li strong::before { width: 32px; height: 32px; }
}

@media screen and (max-width: 640px){

    .sub_location .loca_trans dl { flex-direction: column; padding: clamp(25px, 2.8vw, 28px) clamp(23px, 2.9vw, 29px); gap: 20px; }
    .sub_location .loca_trans dt { width: 100%; aspect-ratio: initial; padding: 0; }
    .sub_location .loca_trans dd { border-left: 0; padding: 0; }

    .sub_location .loca_cs .cs_list { flex-direction: column; }
    .sub_location .loca_cs .cs_list > li { width: 100%; }

    .sub_location .loca_cs .cs_list > li strong { padding-left: 40px; }
    .sub_location .loca_cs .cs_list > li strong::before { width: 28px; height: 28px; top: -5px; }
}

@media screen and (max-width: 479px){
    .sub_location .loca_cs .cs_list > li strong { padding-left: 34px; }
    .sub_location .loca_cs .cs_list > li strong::before { width: 24px; height: 24px; top: -3px; }
    
}

/*───────────────────────────────────────────────────────────
	
    히스토리

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

.sub_history { position: relative; }
.sub_history .stick_bg { position: sticky; top: 377px; width: 1185px; margin-inline: auto; aspect-ratio: 1/0.49; background: url('../images/sub/img_history_bg.png') no-repeat center; background-size: cover; }

.sub_history .history_con { position: absolute; z-index: 2; width: 100%; top: 0; }
.sub_history .history_con::before { content: ''; position: absolute; top: 15px; left: 0; right: 0; width: 1px; height: 100%; background: var(--border-color01); margin-inline: auto; }
.sub_history .history_con .history_line { position: absolute; left: 0; right: 0; top: 15px; margin-inline: auto; width: 1px; height: 0; padding-bottom: 0; box-sizing: border-box; background: var(--point-color01);  }

.sub_history .history_wrap { font-size: var(--title-20); }
.sub_history .history_wrap > li { position: relative; list-style: none; }
.sub_history .history_wrap > li .history_box { box-sizing: border-box; font-size:var(--title-20);}
.sub_history .history_wrap > li .history_box::before { content: ''; position: absolute; top: 13px; width: 7px; height: 7px; border-radius: 100%; box-shadow: 0 0 0 6px rgba(136, 136, 136, 0.20); box-sizing: border-box; background: var(--black-color08); transition: all 0.4s; z-index: 1; }
.sub_history .history_wrap > li .history_box::after { content: ''; position: absolute; top: 14px; width: 63px; height: 1px; border-bottom: 1px dashed var(--border-color02); }
.sub_history .history_wrap > li .year { position: relative; display: block; color: var(--black-color02); font-family: var(--font-type02); font-weight: 500; font-size:16px; line-height: 1; letter-spacing: 0; transition: all 0.4s; }
.sub_history .history_wrap > li .year span{font-size:inherit;}
.sub_history .history_wrap > li .detail { display: block; margin-top: 12px; color: var(--black-color03); font-family: var(--font-type01); font-weight: 400; font-size:16px; line-height: 1.53; letter-spacing: -0.03em; }
.sub_history .history_wrap > li .detail li + li { margin-top: 6px; }
.sub_history .history_wrap > li .detail .acc { color: var(--point-color01); }
.sub_history .history_wrap > li:nth-child(odd) { margin-left: 50%; text-align: left; }
.sub_history .history_wrap > li:nth-child(odd) .history_box { padding-left: 80px; }
.sub_history .history_wrap > li:nth-child(odd) .history_box::before { left: 0; transform: translateX(-50%); }
.sub_history .history_wrap > li:nth-child(odd) .history_box::after { left: 0; }
.sub_history .history_wrap > li:nth-child(even) { margin-right: 50%; text-align: right; }
.sub_history .history_wrap > li:nth-child(even) .history_box { padding-right: 80px; }
.sub_history .history_wrap > li:nth-child(even) .history_box::before { right: 0; transform: translateX(50%); }
.sub_history .history_wrap > li:nth-child(even) .history_box::after { right: 0; }
.sub_history .history_wrap > li + li { margin-top: 24px; }
.sub_history .history_wrap > li:last-child::before { content: ''; position: absolute; right: -1px; top: 15px; width: 2px; height: 250%; background: var(--point-white); z-index: 1; }



/* on */
.sub_history .history_wrap > li.on .year { color: var(--point-color01); }
.sub_history .history_wrap > li.on .history_box::before { background: var(--point-color01); box-shadow: 0 0 0 6px rgba(185, 0, 4, 0.20); }

@media screen and (max-width: 1185px){
    .sub_history .stick_bg { width: 90%; }
}

@media screen and (max-width: 1023px){

    .sub_history .history_wrap > li + li { margin-top: clamp(20px, 2.4vw, 24px); }
    .sub_history .history_wrap > li .detail { margin-top: clamp(5px, 1.3vw, 13px); }
    .sub_history .history_wrap > li .detail li + li { margin-top: clamp(3px, 0.6vw, 6px); }

    .sub_history .history_wrap > li .history_box::after { width: 57px; }
    .sub_history .history_wrap > li:nth-child(odd) .history_box { padding-left: 75px; }
    .sub_history .history_wrap > li:nth-child(even) .history_box { padding-right: 75px; }


    
}

@media screen and (max-width: 860px){
    .sub_history .history_wrap > li .history_box::before { width: 6px; height: 6px; top: 11px; box-shadow: 0 0 0 4px rgba(136, 136, 136, 0.20); }
    .sub_history .history_wrap > li.on .history_box::before { box-shadow: 0 0 0 4px rgba(185, 0, 4, 0.20); }
    .sub_history .history_wrap > li .history_box::after { top: 13px; }

    .sub_history .history_wrap > li .history_box::after { width: 52px; }
    .sub_history .history_wrap > li:nth-child(odd) .history_box { padding-left: 70px; }
    .sub_history .history_wrap > li:nth-child(even) .history_box { padding-right: 70px; }

    
}

@media screen and (max-width: 640px){
    .sub_history .stick_bg { width: 150%; }
    .sub_history .history_wrap > li .history_box::after { width: 47px; }
    .sub_history .history_wrap > li:nth-child(odd) .history_box { padding-left: 60px; }
    .sub_history .history_wrap > li:nth-child(even) .history_box { padding-right: 60px; }    
}

@media screen and (max-width: 479px){
    .sub_history .history_wrap { padding-left: 8px; }
    .sub_history .history_wrap > li:nth-child(odd) { margin-left: 0; }
    .sub_history .history_wrap > li:nth-child(even) { text-align: left; margin-right: initial; margin-left: 50%; }

    .sub_history .history_wrap > li:nth-child(odd) .history_box { padding-left: 50px; }
    .sub_history .history_wrap > li .history_box::after { width: 30px; top: 11px; }
    .sub_history .history_wrap > li .history_box::before { width: 5px; height: 5px; top: 10px; }
    .sub_history .history_wrap > li:nth-child(even) { margin-left: 0; }
    .sub_history .history_wrap > li:nth-child(even) .history_box { padding-right: 0; padding-left: 50px; }
    .sub_history .history_wrap > li:nth-child(even) .history_box::before { right: initial; left: 0; transform: translateX(-50%); }
    .sub_history .history_wrap > li:nth-child(even) .history_box::after { right:initial; left: 0; }
    .sub_history .history_con .history_line { left: 7px; right: initial; margin-right: auto; height: 30px; padding-bottom: 30px; }
    .sub_history .history_con::before { left: 7px; right: initial; margin-right: auto; }
    .sub_history .history_wrap > li:last-child::before { right:initial; left: -1px; }
.sub_history .history_wrap > li + li
    .sub_history .history_wrap > li + li { margin-top: 30px; }


}

/*───────────────────────────────────────────────────────────
	
    브랜드

───────────────────────────────────────────────────────────*/
.sub_brand .brand_list { display: flex; flex-wrap: wrap; gap: 20px; font-size: var(--title-20); }
.sub_brand .brand_list > li { width: calc(100% / 2 - 10px); position: relative; }
.sub_brand .brand_list > li .ov { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(6.1px); opacity: 0; transition: all 0.5s; }
.sub_brand .brand_list dl { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 60px 0; }
.sub_brand .brand_list dt { color: var(--point-white); font-weight: 500; font-family: var(--font-type01); font-size: 200%; line-height: 1; letter-spacing: -0.04em; text-align: center; box-sizing: border-box; padding-inline: 10px; }
.sub_brand .brand_list dl ul { display: flex; justify-content: center; align-items: center; gap: 20px; }
.sub_brand .brand_list dl ul a { display: block; width: 100%; height: 100%; }

.sub_brand .brand_list > li.on .ov { opacity: 1; }

.sub_brand > span { display: block; margin-bottom: 20px; font-size: var(--title-18); color: var(--black-color03); font-weight: 400; display: none; }

@media (hover: hover) and (pointer: fine){
    .sub_brand .brand_list > li:hover .ov { opacity: 1; }
}

@media screen and (max-width: 1023px){
    .sub_brand .brand_list dl { gap: clamp(20px, 4vw, 60px) 0; }
    .sub_brand .brand_list dl ul { gap: clamp(10px, 2vw, 20px); }
    .sub_brand .brand_list dl ul > li { width: clamp(35px, 5vw, 51px); aspect-ratio: 1/1; }

    .sub_brand > span { margin-bottom: clamp(15px, 2vw, 20px); display: block; }
}

@media screen and (max-width: 860px){
    .sub_brand .brand_list dt { font-size: 190%; }
}

@media screen and (max-width: 640px){
    .sub_brand .brand_list dt { font-size: 170%; }
    .sub_brand .brand_list > li { width: 100%; }
}

@media screen and (max-width: 479px){
    .sub_brand .brand_list { gap: 15px; }
    .sub_brand .brand_list > li { width: 100%; }
    .sub_brand .brand_list dt { font-size: 140%; }

}


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

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

/* 일반 리스트 */

#wrap table.bbs_list {border-top:3px 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-16);}
#wrap table.bbs_list thead tr {border-bottom: 1px solid var(--border-color01);  }
#wrap table.bbs_list tbody tr {transition: all 0.4s;}

#wrap table.bbs_list tr :where(th, td){border:0; border-bottom: 1px solid var(--border-color01); font-size: 100%;line-height: 1.4;letter-spacing: -0.03em; box-sizing: border-box;}
#wrap table.bbs_list th {font-weight: 500; color: var(--black-color01); padding: 18px 5px 18px; font-size: var(--title-17); }
#wrap table.bbs_list td {font-weight: 400; color: var(--black-color05); padding: 23px 5px 23px;}
#wrap table.bbs_list td.td_num { font-family: var(--font-type02); font-size: var(--title-17); }
#wrap table.bbs_list td.td_date { font-family: var(--font-type02); }
#wrap table.bbs_list td.left{ padding-left: 0; padding-right: 10px; text-align: left; color: var(--black-color03); font-weight: 400; letter-spacing: -0.04em; }
#wrap table.bbs_list td.left h3 { font-weight: inherit; font-size: 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; max-width: 100%; } */
#wrap table.bbs_list td h3 { display: flex; align-items: center; gap: 0 40px; width: 100%; max-width: initial; }
#wrap table.bbs_list td strong{font-weight: inherit; white-space: normal; overflow: hidden; text-overflow: ellipsis; display: -webkit-inline-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; max-width: 100%; word-break: break-all; }
#wrap table.bbs_list td .board_ico { display: inline-block; box-sizing: border-box; flex-shrink: 0; width: 16px; height: 18px; }
#wrap table.bbs_list td .board_ico img { display: block; width: 100%; height: 100%; }
#wrap table.bbs_list .board_notice td.left { color: var(--black-color01); font-weight: 500; padding-left: 0; }
#wrap table.bbs_list .board_notice .td_notice span { display: flex; justify-content: center; align-items: center; width: fit-content; padding: 2px 10px 3px; margin: 0 auto 3px; border: 1px solid var(--point-color01); color: var(--point-color01); border-radius: 50px; font-weight: 600; font-size: var(--title-16); letter-spacing: -0.03em; box-sizing: border-box; }
#wrap table.bbs_list .board_notice td { padding: 18px 5px 18px;  }



@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: 70px; vertical-align:top; box-sizing:border-box;}
.paging span {display:inline-block;vertical-align:top;}
.paging a {display:inline-flex; justify-content: center; align-items: center; font-size: var(--title-17); color: var(--black-color06); padding:0; box-sizing:border-box;width:36px;height:36px; text-align:center; vertical-align:top; margin: 0; border: 0; border-radius: 100%; }
.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; margin-left: 10px; }

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

.paging .arrow a {font-size:0; width:40px; margin-left: 0 !important; }
.paging .arrow a img {display:none;}
.paging .arrow.first a {background:#fff url("../images/sub/ico_first.svg") no-repeat center 50%;background-size: 10px 10px;}
.paging .arrow.prev a {background:#fff url("../images/sub/ico_prev.svg") no-repeat center 50%;background-size: 6px 10px; margin-right: 10px; }
.paging .arrow.next a {background:#fff url("../images/sub/ico_next.svg") no-repeat center 50%;background-size: 6px 10px; margin-left: 10px; }
.paging .arrow.last a {background:#fff url("../images/sub/ico_last.svg") no-repeat center 50%;background-size: 10px 10px;}
.view_btn {text-align:center; position:relative; }
.view_btn .paging {display:inline-block;}




/* 뷰페이지 */

#wrap .bbs_view { border-bottom: 1px solid var(--border-color01); }
#wrap .bbs_view div.view_tit {width:100%; box-sizing:border-box; padding: 16px 20px 20px; border-top: 3px solid var(--black-color00); border-bottom: 1px solid var(--border-color01); background: #fff; font-size: var(--title-20); text-align: left;}
#wrap .bbs_view div.view_tit > h3 {font-size: 90%; width: 100%; color: var(--black-color03); font-weight: 500; line-height: 1.5; letter-spacing: -0.04em; font-family: var(--font-type02); }
#wrap .bbs_view div.view_tit > p {display: flex; align-items: center; width: 100%; margin-top: 11px; text-align: left; font-size: var(--title-15); color: var(--black-color05); letter-spacing: -0.03em; }
#wrap .bbs_view div.view_tit > p span {font-size: inherit; font-weight: 400; color:inherit; 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-color02);margin:1px 16px 0 17px;}
#wrap .bbs_view div.view_tit > p span em { font-weight: 400; margin-right: 4px;}

#wrap .bbs_view div.view_cont { min-height: 225px; padding: 30px 20px 30px; border: 0; font-size: var(--title-16); color: var(--black-color04); font-weight: 400; font-family: var(--font-type02); line-height: 2; letter-spacing: -0.04em; }
#wrap .bbs_view div.view_cont img { display: block; margin-bottom: 40px; }

#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; box-sizing: border-box; }
#wrap .sub_board .bbs_view .extra_editor_wrap > h4, 
#wrap .sub_board .bbs_view .extra_editor_wrap > div.extra_cont {padding: 20px 0 23px;display:table-cell;box-sizing:border-box;vertical-align:middle;text-align:left;border: 0;}
#wrap .sub_board .bbs_view .extra_editor_wrap > h4 {width:162px;background:none;color: var(--black-color03); font-family: var(--font-type04); font-size: var(--title-17);font-weight: 500;text-align: center;position:relative;z-index:1; letter-spacing: -0.03em;}
#wrap .sub_board .bbs_view .extra_editor_wrap > h4::after {content:''; position:absolute;width:1px;height:calc(100% - 40px);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% - 162px);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-15);font-weight:400;color: var(--black-color06) !important; vertical-align:middle;display:block; letter-spacing: -0.03em; font-family: var(--font-type02); }
#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:10px;}
#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: 50px; width: 150px; height: 60px; border: 1px solid var(--black-color03); background: var(--point-white); color: var(--black-color02); font-weight: 400; font-size: var(--title-18); font-family: var(--font-type01); letter-spacing: -0.03em; box-sizing: border-box; border-radius: 800px;}
#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/sub/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);}


@media screen and (max-width: 1023px){
    
    #wrap table.bbs_list th { padding: clamp(15px, 1.8vw, 18px) 5px clamp(15px, 1.8vw, 18px); }
    #wrap table.bbs_list .board_notice td { padding: clamp(12px, 1.8vw, 18px) 5px clamp(12px, 1.8vw, 18px); }
    #wrap table.bbs_list td { padding: clamp(15px, 2.3vw, 23px) 5px clamp(15px, 2.3vw, 23px);  }
    #wrap table.bbs_list .board_notice .td_notice span { padding: 2px clamp(5px, 1vw, 10px); }
    #wrap table.bbs_list td h3 { gap: clamp(15px, 4vw, 40px); }

    #wrap .bbs_view div.view_tit { padding: clamp(10px, 1.6vw, 16px) clamp(15px, 2vw, 20px); }
    #wrap .bbs_view div.view_tit > p { margin-top: clamp(5px, 1.1vw, 11px); }
    #wrap .bbs_view div.view_tit > p span + span:before { margin: 0 clamp(10px, 1.6vw, 16px); height: 10px;  }
    
    #wrap .bbs_view div.view_cont { padding: clamp(15px, 3vw, 30px) clamp(10px, 2vw, 20px); min-height: clamp(150px, 22.5vw, 225px); overflow-x: auto; }
    #wrap .sub_board .bbs_view .extra_editor_wrap { margin-bottom: clamp(15px, 3vw, 30px); }
    #wrap .sub_board .bbs_view .extra_editor_wrap > h4, 
    #wrap .sub_board .bbs_view .extra_editor_wrap > div.extra_cont { padding-block: clamp(15px, 2vw, 20px); }
    #wrap .sub_board .bbs_view .extra_editor_wrap div.extra_cont { padding-inline: clamp(20px, 4vw, 40px); }
    #wrap .sub_board .bbs_view .extra_editor_wrap div.extra_cont > span + span { margin-top: clamp(5px, 1vw, 10px); }

    #wrap .sub_board .view_btn .btn { margin-top: clamp(20px, 5vw, 50px); width: 135px; height: 54px; }

    .paging { margin-top: clamp(35px, 7vw, 70px); }
    
}

@media screen and (max-width: 860px){
    
    
    #wrap table.bbs_list td .board_ico { width: 13px; height: 14px; }
    #wrap .bbs_view div.view_tit > p span + span:before { height: 10px; margin-bottom: 2px; }
    #wrap .sub_board .bbs_view .extra_editor_wrap > h4 { width: 130px; }

    #wrap .sub_board .view_btn .btn { width: 122px; height: 49px; }

    .paging a { width: 32px; height: 32px; }
    .paging .arrow a { width: 32px; }
}

@media screen and (max-width: 640px){
    #wrap table.bbs_list td .board_ico { width: 10px; height: 11px; }
    #wrap .sub_board .bbs_view .extra_editor_wrap > h4 { width: 110px; }

    #wrap .sub_board .view_btn .btn { width: 110px; height: 44px; }

    .paging a { width: 28px; height: 28px; }
    .paging .arrow a { width: 28px; }

    .paging .arrow.first a {background-size: 8px 8px;}
    .paging .arrow.prev a {background-size: 4px 8px; }
    .paging .arrow.next a {background-size: 4px 8px;}
    .paging .arrow.last a {background-size: 8px 8px;}
    
}

@media screen and (max-width: 479px){
    #wrap table.bbs_list { border-top: 2px solid var(--black-color03); }
    #wrap table.bbs_list col:nth-child(1) { display: none; }
    #wrap table.bbs_list col:nth-child(3) { display: none; }
    #wrap table.bbs_list th:nth-child(1),
    #wrap table.bbs_list td:nth-child(1) { display: none; }
    #wrap table.bbs_list th:nth-child(3),
    #wrap table.bbs_list td:nth-child(3) { display: none; }
    #wrap table.bbs_list .board_notice td.left { padding-left: 5px; }
    #wrap table.bbs_list td.left { padding-left: 5px; }


    

    #wrap .bbs_view div.view_tit > p span + span:before { margin-bottom: 1px; height: 8px; }
    #wrap .sub_board .view_btn .btn { width: 99px; height: 40px; }

    .paging a { width: 26px; height: 26px; }
    .paging .arrow a { width: 26px; }
}

@media screen and (max-width: 320px){
    #wrap table.bbs_list .board_notice td { padding-inline: 2px; }
    #wrap table.bbs_list td { padding-inline: 2px; }
}

/*───────────────────────────────────────────────────────────
	
	재무제표

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

.sub_finance { font-size: var(--title-20); font-family: var(--font-type01);  }


.sub_finance .finance_table_wrap + .finance_table_wrap { margin-top: 120px; }
.sub_finance .finance_table + .finance_table { margin-top: 80px; }
.sub_finance .finance_table table { box-sizing: border-box; border-top: 3px solid var(--black-color03); text-align: center; }
.sub_finance .finance_table table .th_left { text-align: left; }
.sub_finance .finance_table table tr { box-sizing: border-box; }
.sub_finance .finance_table thead th { font-weight: 500; color: var(--black-color01); padding: 19px 5px 19px; font-size: var(--title-17); border-bottom: 1px solid var(--border-color01); }
.sub_finance .finance_table tbody :where(th, td) { box-sizing: border-box; padding: 15px 5px 15px; border-bottom: 1px solid var(--border-color01); }
.sub_finance .finance_table tbody th { color: var(--black-color03); font-family: var(--font-type02); font-size: var(--title-16); font-weight: 500; line-height: 1.75; letter-spacing: -0.04em; padding-left: 20px; }
.sub_finance .finance_table tbody td { color: var(--black-color05); font-weight: 400; font-size: var(--title-16); line-height: normal; letter-spacing: -0.04em; font-family: var(--font-type02);  }

.sub_finance .finance_table .acc { background: #FFF8F8; }
.sub_finance .finance_table .acc th{ color: var(--black-color03); font-weight: 700; }
.sub_finance .finance_table .acc td{ color: var(--black-color03); font-weight: 600; }
.sub_finance .finance_table .red_td td { color: var(--point-color01); }

.sub_finance .table_title h2 { font-size: 20px; }
.sub_finance .table_sub_title h3 { font-size: 20px; }

@media screen and (max-width: 1023px){
    .sub_finance .finance_table_wrap + .finance_table_wrap { margin-top: clamp(60px, 12vw, 120px); }
    .sub_finance .finance_table + .finance_table { margin-top: clamp(40px, 8vw, 80px); }
    .sub_finance .finance_title { margin-bottom: clamp(10px, 1.9vw, 19px); }
    .sub_finance .finance_table thead th { padding: clamp(12px, 1.9vw, 19px) 5px; }
    .sub_finance .finance_table tbody :where(th, td) { padding: clamp(10px, 1.5vw, 15px) 5px; }
    .sub_finance .finance_table tbody th { padding-left: clamp(10px, 2vw, 20px); }
}

@media screen and (max-width: 860px){
    .sub_finance .finance_title h2 { font-size: 140%; }
}

@media screen and (max-width: 640px){
    .sub_finance .finance_title h2 { font-size: 130%; }
}

@media screen and (max-width: 479px){
    
    .sub_finance .table_title h2 { font-size: 85%; }
    .sub_finance .table_sub_title h3 { font-size: 85%; }

    .sub_finance .finance_table table { border-top: 2px solid var(--black-color03); }
    .sub_finance .finance_table table col:nth-child(1) { width: 40%; }
    .sub_finance .finance_table table col:nth-child(n+2) { width: 20%; }
}

/*───────────────────────────────────────────────────────────
	
	주가정보

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

.sub_stock .table_sub_title { margin-bottom: 30px; font-family: var(--font-type02); }

.sub_stock .cur_price { display: flex; align-items: center; width: 100%; border: 1px solid var(--black-color00); padding: 51px 0 48px; box-sizing: border-box; }
.sub_stock .cur_price .cur_day_wrap,
.sub_stock .cur_price .prev_day_wrap { width: 50%; }
.sub_stock .cur_price .cur_day_wrap { display: flex; justify-content: center; box-sizing: border-box; padding-inline: 15px; font-size: var(--title-20); font-family: var(--font-type02); vertical-align: middle; }
.sub_stock .cur_price .cur_day_wrap h4 { display: flex; gap: 44px; align-items: center; color: var(--black-color00); font-weight: 600; font-size: 350%; letter-spacing: 0; line-height: 1.12; }
.sub_stock .cur_price .cur_day_wrap h4 small { display: inline-block; color: var(--point-color01); font-size: var(--title-18); font-weight: 500; line-height: 2.12; letter-spacing: -0.04em; vertical-align: middle; box-sizing: border-box; padding-top: 4px; flex-shrink: 0; }
.sub_stock .cur_price .prev_day_wrap { box-sizing: border-box; padding-inline: 100px; font-size: var(--title-20); font-family: var(--font-type02); border-left: 1px solid var(--border-color01); vertical-align: middle; }
.sub_stock .cur_price .prev_day_wrap li { display: flex; justify-content: space-between; box-sizing: border-box; flex-wrap: wrap; gap: 10px 0; }
.sub_stock .cur_price .prev_day_wrap li + li { margin-top: 28px; padding-top: 32px; border-top: 1px solid var(--border-color01); }
.sub_stock .cur_price .prev_day_wrap span { font-weight: 500; font-size: var(--title-18); line-height: 1.12; letter-spacing: -0.04em; }
.sub_stock .cur_price .prev_day_wrap span:nth-child(1) { color: var(--black-color05); padding-right: 10px; }
.sub_stock .cur_price .prev_day_wrap span:nth-child(2) { position: relative; color: var(--black-color00); }


.sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2) { box-sizing: border-box; padding-left: 31px; }
.sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2)::before { content: ''; position: absolute; left: 0; top: 4px; width: 12px; height: 9px; background: url('../images/sub/ico_price_down.svg') no-repeat center; background-size: 100% auto; }

.sub_stock .table_flex { display: flex; gap: 20px 40px; margin-top: 40px; }
.sub_stock .table_flex table { border-top: 3px solid var(--black-color03); box-sizing: border-box; font-size: var(--title-20); font-family: var(--font-type02); }
.sub_stock .table_flex table tr { box-sizing: border-box; }
.sub_stock .table_flex table th { color: var(--black-color01); font-weight: 500; font-size: var(--title-17); line-height: normal; letter-spacing: -0.04em; border-bottom: 1px solid var(--border-color01); }
.sub_stock .table_flex table td { color: var(--black-color05); font-weight: 400; font-size: var(--title-17); line-height: normal; border-bottom: 1px solid var(--border-color01); }
.sub_stock .table_flex table :where(th, td) { text-align: center; box-sizing: border-box; }
.sub_stock .table_flex table .left { text-align: left; }
.sub_stock .table_flex table .red_td { color: #E31B23; }
.sub_stock .table_flex table .blue_td { color: #0042FF; }

.sub_stock .table_flex .table_left { width: 53.23% }
.sub_stock .table_flex .table_right { width: calc(100% - (53.23% + 40px)); }

.sub_stock .stock_chart th { padding: 17px 5px 18px; }
.sub_stock .stock_chart td { padding: 21px 5px 18px; }

.sub_stock .stock_chart02 { margin-top: 20px; }
.sub_stock .stock_chart02 th { background: var(--gray-bg01); padding-left: 20px; padding-block: 18px 16px; }
.sub_stock .stock_chart02 td { color: var(--black-color03) !important; padding-left: 20px; padding-block: 18px 16px; letter-spacing: -0.04em; }

.sub_stock .table_right table th { padding: 17px 5px 18px; }
.sub_stock .table_right table td { padding: 21px 5px 18px; letter-spacing: -0.04em; }
.sub_stock .table_right table tbody td.blue_td { background: #F0F6FF; }
.sub_stock .table_right table tbody td.red_td { background: #FAEDED; }

.sub_stock .table_right table tfoot tr { background: var(--gray-bg01); }
.sub_stock .table_right table tfoot td { color: var(--black-color00); font-family: var(--font-type02); font-size: var(--title-17); font-weight: 600; line-height: normal; letter-spacing: -0.04em; }

@media screen and (max-width: 1023px){
    .sub_stock .table_sub_title { margin-bottom: clamp(20px, 3vw, 30px); }
    .sub_stock .cur_price { padding: clamp(20px, 5vw, 50px) 0; }
    .sub_stock .cur_price .prev_day_wrap { padding-inline: clamp(20px, 8vw, 100px); }
    .sub_stock .cur_price .cur_day_wrap h4 { gap: clamp(20px, 4.4vw, 44px); font-size: 330%; }
    .sub_stock .cur_price .prev_day_wrap li + li { margin-top: clamp(15px, 3vw, 30px); padding-top: clamp(15px, 3vw, 30px); }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2) { padding-left: 28px; }

    .sub_stock .table_flex { margin-top: clamp(20px, 4vw, 40px); }
    .sub_stock .stock_chart02 { margin-top: clamp(15px, 2vw, 20px); }
    
    .sub_stock .stock_chart th { padding: clamp(15px, 1.8vw, 18px) 5px; }
    .sub_stock .stock_chart td { padding: clamp(15px, 1.8vw, 18px) 5px; }

    .sub_stock .stock_chart02 th { padding-left: clamp(15px, 2vw, 20px); padding-block: clamp(15px, 1.8vw, 18px); }
    .sub_stock .stock_chart02 td { padding-left: clamp(15px, 2vw, 20px); padding-block: clamp(15px, 1.8vw, 18px); }

    .sub_stock .table_right table th { padding: clamp(15px, 1.8vw, 18px) 5px; }
    .sub_stock .table_right table td { padding: clamp(15px, 1.8vw, 18px) 5px; }
}

@media screen and (max-width: 860px){
    .sub_stock .cur_price .cur_day_wrap h4 { font-size: 310% }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2) { padding-left: 26px; }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2)::before { width: 10px; height: 8px; top: 3px; }

    .sub_stock .table_flex { gap: 20px; }
    .sub_stock .table_flex .table_right { width: calc(100% - (53.23% + 20px));}
}

@media screen and (max-width: 640px){
    .sub_stock .cur_price .cur_day_wrap h4 { font-size: 290%; }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2) { padding-left: 20px; }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2)::before { width: 8px; height: 6px; top: 3px; top: 4px; }

    .sub_stock .table_flex { flex-direction: column; }
    .sub_stock .table_flex .table_left { width: 100%; }
    .sub_stock .table_flex .table_right { width: 100%; }
}

@media screen and (max-width: 479px){
    .sub_stock .cur_price { flex-direction: column; justify-content: flex-start; align-items: flex-start; row-gap: 20px; }
    .sub_stock .cur_price .cur_day_wrap { padding-inline: max(20px, 8vw); }
    .sub_stock .cur_price .cur_day_wrap h4 { width: 100%; }
    .sub_stock .cur_price .prev_day_wrap { border-left: 0; }
    .sub_stock .cur_price .prev_day_wrap ul { border-top: 1px solid var(--border-color01); padding-top: clamp(15px, 3vw, 30px); }

    .sub_stock .cur_price .cur_day_wrap, 
    .sub_stock .cur_price .prev_day_wrap { width: 100%; }
    .sub_stock .cur_price .cur_day_wrap h4 { font-size: 270%; }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2) { padding-left: 16px; }
    .sub_stock .cur_price .prev_day_wrap .prev_day span:nth-child(2)::before { width: 7px; height: 5px; top: 3px; top: 5px; }
    
}

/*───────────────────────────────────────────────────────────
	
	공시, 공고

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

@media screen and (max-width: 640px){
    #wrap .sub_ir table.bbs_list col:nth-child(1) { display: none; }
    #wrap .sub_ir table.bbs_list th:nth-child(1),
    #wrap .sub_ir table.bbs_list td:nth-child(1) { display: none; }

    #wrap .sub_ir table.bbs_list col:nth-child(3) { width: 20%; }
    #wrap .sub_ir table.bbs_list col:nth-child(4) { width: 20%; }
}

@media screen and (max-width: 479px){
    #wrap .sub_ir table.bbs_list col:nth-child(3) { display: none; }
    #wrap .sub_ir table.bbs_list th:nth-child(3),
    #wrap .sub_ir table.bbs_list td:nth-child(3) { display: none; }
    #wrap .sub_ir table.bbs_list col:nth-child(4) { display: none; }
    #wrap .sub_ir table.bbs_list th:nth-child(4),
    #wrap .sub_ir table.bbs_list td:nth-child(4) { display: none; }
}
