@charset "utf-8";

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

    서브 공통

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

body::-webkit-scrollbar { display: none; }

#container:has(.full_sec) { max-width: 100%; width: 100%; }
#container:has(.sub_about, .sub_rd) { padding-bottom: 0; }

.sub_visual { position: relative; box-sizing: border-box; height: 560px; }
.sub_visual .thumb { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('../images/sub/sv_company.jpg') no-repeat center / cover; }
.sub_visual .cont { display: flex; flex-direction: column; justify-content: center; padding-block: 115px 86px; height: 100%; }
.sub_visual .text_wrap { font-size: var(--title-20); }
.sub_visual .text_wrap h2 { filter: var(--filter-white); font-weight: 600; font-size: 400%; letter-spacing: 0; font-family: var(--font-type03); }
.sub_visual nav { margin-top: 28px; }
.sub_visual .nav_desc { display: inline-flex; align-items: center; }
.sub_visual .nav_desc dt { opacity: 0.6; flex-shrink: 0; width: 18px; aspect-ratio: auto 1.12;}
.sub_visual .nav_desc dt a { display: block; width: auto; height: auto; }
.sub_visual .depth01_dd { position: relative; font-size: var(--title-20); box-sizing: border-box; margin-left: 32px; padding-left: 32px; }
.sub_visual .depth01_dd::before { content: ''; position: absolute; left: 0; top: 11px; width: 24px; height: 1px; background: rgba(255, 255, 255, 0.2); translate: -50% 0;  }
.sub_visual .depth01_dd > span { position: relative; display: block; min-width: 120px; filter: var(--filter-white); font-size: 90%; font-weight: 500; letter-spacing: -0.03em; width: 100%; box-sizing: border-box; padding-right: 35px; cursor: pointer; }
.sub_visual .depth01_dd > span::before { content: ''; position: absolute; right: 1px; top: calc(50% + 1px); translate: 0 -50%; width: 0; height: 0; border-style: solid; border-width: 5px 4px 0px 4px; border-color: #ffffff transparent transparent transparent; scale: 1; transition: all 0.4s; }
.sub_visual .depth01_dd ul { position: absolute; top: calc(100% + 10px); left: 0; width: 100%; min-width: 180px; background: var(--point-white); border: 1px solid var(--point-color01); z-index: 10; box-sizing: border-box; padding-block: 15px; opacity: 0; pointer-events: none; transition: all 0.4s; }
.sub_visual .depth01_dd ul li a { display: block; font-weight: 400; color: var(--black-color02); padding-inline: 32px; padding-block: 8px; box-sizing: border-box; transition: all 0.4s; font-size: 90%; }

.sub_visual .depth01_dd.on ul { opacity: 1; pointer-events: all; }
.sub_visual .depth01_dd ul li.on a { font-weight: 500; color: var(--point-color01); }

.sub_visual .depth01_dd.on > span::before { scale: -1 -1; }

#wrap:has(.sub_rd) .sub_visual .thumb { background-image: url('../images/sub/sv_rd.jpg'); } 
#wrap:has(.sub_prd) .sub_visual .thumb { background-image: url('../images/sub/sv_prd.jpg'); }
#wrap:has(.sub_inq) .sub_visual .thumb { background-image: url('../images/sub/sv_contact.jpg'); }
#wrap.sub_notice .sub_visual .thumb { background-image: url('../images/sub/sv_notice.jpg'); }

.page_title { text-align: center; font-size: var(--title-20); box-sizing: border-box; padding-block: 111px 71px; }
.page_title h3 { color: var(--black-color01); font-weight: 600; font-size: 300%; font-family: var(--font-type03); letter-spacing: 0; }

.sub_title { font-size: var(--title-20); margin-bottom: 33px; }
.sub_title h3 { color: var(--black-color00); font-weight: 700; font-size: 300%; letter-spacing: 0; font-family: var(--font-type03); }
.sub_title h4 { color: var(--black-color01); font-weight: 700; font-size: 240%; letter-spacing: -0.03em; font-family: var(--font-type03); }
.sub_title h4 em { font-weight: inherit; background: var(--point-gradi01); background-clip: text; -webkit-text-fill-color: transparent; }
.sub_title h5 { color: var(--black-color03); font-weight: 500; font-size: 150%; line-height: 1.46; letter-spacing: -0.03em; margin-top: 41px; }
.sub_title p { color: var(--black-color06); font-weight: 400; font-size: 100%; line-height: 1.6; letter-spacing: -0.03em; margin-top: 31px; }
.sub_title p em { color: var(--black-color03); font-weight: 500; }

.bullet_list { font-size: var(--title-20); }
.bullet_list > li { display: flex; align-items: baseline; color: var(--black-color06); font-size: 85%; font-weight: 400; line-height: 1.64; letter-spacing: -0.03em; gap: 8px; font-family: var(--font-type03); }
.bullet_list > li em { color: var(--point-color01); font-weight: 500; }
.bullet_list > li.acc { color: var(--point-color01); font-weight: 500; }
.bullet_list > li.acc::before { background: var(--point-color01); }
.bullet_list > li + li { margin-top: 6px; }
.bullet_list > li::before { content: ''; display: inline-block; width: 4px; aspect-ratio: auto 1; background: var(--black-color08); border-radius: 100%; flex-shrink: 0; translate: 0 -4px; }

.flex_des { display: flex;  }
.flex_rev { display: flex; flex-direction: row-reverse; }
.flex_col { display: flex; flex-direction: column; }
.g100 { gap: 20px clamp(50px, 5.2vw, 100px); }
.g60 { gap: 20px clamp(30px, 3.2vw, 60px); }
.g30 { gap: 30px; }
.g20 { gap: 20px; }
.g15 { gap: 15px; }
.g40 { gap: 40px; }

.pg_ban { position: relative; text-align: center; font-size: var(--title-20); box-sizing: border-box; padding-block: 161px 162px; margin-bottom: 161px; }
.pg_ban .w_custom { filter: var(--filter-white); }
.pg_ban .thumb { position: absolute; width: 100%; height: 100%; left: 50%; top: 0; translate: -50% 0; margin-inline: auto; max-width: 1500px; border-radius: var(--radius-60); overflow: clip; transition: all 0.8s; }
.pg_ban .thumb img { width: 100%; height: 100%; object-fit: cover; }
.pg_ban h4 { font-weight: 500; font-size: 120%; letter-spacing: -0.03em; font-family: var(--font-type03); opacity: 0.7; }
.pg_ban h3 { font-weight: 600; font-size: 270%; letter-spacing: -0.03em; margin-top: 26px; }
.pg_ban p { font-weight: 400; font-size: 95%; letter-spacing: -0.03em; line-height: 1.69; margin-top: 38px; }

.pg_ban.aos-animate .thumb { max-width: 100%; border-radius: 0; }

.flex_cont { align-items: center; box-sizing: border-box; }
.flex_cont .img_wrap { width: 46.67%; background: var(--gray-bg01); border-radius: var(--radius-30); overflow: clip; max-width: 700px; }
.flex_cont .img_wrap img { width: 100%; height: 100%; object-fit: cover; }
.flex_cont .txt_wrap { width: 53.33%; box-sizing: border-box; padding-left: clamp(50px, 5.4vw, 100px); }

.flex_cont.flex_rev .txt_wrap { padding-left: 0; padding-right: clamp(50px, 5.4vw, 100px); }
.flex_cont + .flex_cont { padding-top: 100px; }

.gray_bg { background: var(--gray-bg01); position: relative; z-index: 10; }



.sticky_wrap { align-items: flex-start; }
.sticky_wrap > .sub_title { width: 40%; position: sticky; top: 140px; margin: 0; }
.sticky_wrap > .sub_title h3 { font-size: 800%; font-family: var(--font-type03); font-weight: 500; }
.sticky_wrap .img_wrap { width: 40%; position: sticky; top: 140px; border-radius: var(--radius-30); overflow: clip; height: 80.5vh; }
.sticky_wrap .img_wrap img { width: 100%; height: 100%; object-fit: cover; }
.sticky_wrap .txt_wrap { width: 60%; padding-left: clamp(50px, 5.5vw, 100px); box-sizing: border-box; margin-top: -1px; }
.sticky_wrap .txt_wrap > ul { counter-reset: num 0; }
.sticky_wrap .txt_wrap > ul > li { font-size: var(--title-20); box-sizing: border-box; }
.sticky_wrap .txt_wrap > ul > li .sub_title { margin: 0; }
.sticky_wrap .txt_wrap > ul > li + li { margin-top: 80px; padding-top: 79px; border-top: 1px solid var(--border-color01); }
.sticky_wrap h5 { color: var(--black-color01); font-weight: 500; font-family: var(--font-type03); margin-top: 41px; }
.sticky_wrap p { margin-top: 21px; font-size: 95%; line-height: 1.68; }
.sticky_wrap .sub_title ul { margin-top: 30px; }
.sticky_wrap .sub_title ul li { display: flex; align-items: baseline; font-size: var(--title-20); position: relative; gap: 12px; }
/* .sticky_wrap .sub_title ul li::before { content: ''; display: block; width: 14px; aspect-ratio: auto 1.27; background: url('../images/sub/ico_list_chk.svg') no-repeat center / 100% auto; flex-shrink: 0; translate: 0 -1px; } */
.sticky_wrap .sub_title ul li span { color: var(--black-color03); font-weight: 400; font-size: 95%; line-height: 1.63; letter-spacing: -0.03em; }
.sticky_wrap .sub_title ul li span em { color: var(--point-color01); font-weight: 500; }
.sticky_wrap .sub_title ul li + li { margin-top: 12px; }
.sticky_wrap .sub_title ul + p { margin-top: 30px; }


.bk { color: var(--black-color01) !important; }

@media (hover: hover) and (pointer: fine) {
    .sub_visual .depth01_dd ul li a:hover { color: var(--point-color01); }
}

@media (max-width: 1023px) {
    .sub_visual { height: clamp(420px, 56vw, 560px); }
    .sub_visual nav { margin-top: clamp(15px, 3vw, 2.8vw); }
    .sub_visual .nav_desc dt { width: clamp(14px, 1.8vw, 18px);}
    .sub_visual .cont { padding-block: clamp(65px, 11.5vw, 115px) clamp(45px, 9vw, 86px); }
    .sub_visual .depth01_dd { padding-left: clamp(15px, 3.2vw, 32px); margin-left: clamp(15px, 3.2vw, 32px); }
    .sub_visual .depth01_dd > span { min-width: clamp(100px, 12vw, 120px); }
    .sub_visual .depth01_dd::before { width: clamp(12px, 2.4vw, 24px); }
    .sub_visual .text_wrap h2 { font-size: clamp(280%, 8vw, 400%); }

    .page_title { padding-block: clamp(60px, 11vw, 111px) clamp(40px, 7vw, 71px); }
    .page_title h3 { font-size: clamp(220%, 6vw, 300%); }

    .sub_title { margin-bottom: clamp(20px, 4vw, 33px); }
    .sub_title h3 { font-size: clamp(220%, 6vw, 300%); }
    .sub_title h4 { font-size: clamp(180%, 4.8vw, 240%); }
    .sub_title h5 { margin-top: clamp(20px, 4vw, 41px); font-size: 150%; }
    .sub_title p { margin-top: clamp(15px, 3vw, 31px); }

    .sub_visual .depth01_dd ul { padding-block: clamp(10px, 2vw, 20px); min-width: clamp(150px, 18vw, 180px); }
    .sub_visual .depth01_dd ul li a { padding-inline: clamp(15px, 3.2vw, 32px); padding-block: clamp(5px, 0.8vw, 8px); }

    .pg_ban { padding-block: clamp(80px, 16vw, 161px) clamp(80px, 16vw, 162px); margin-bottom: clamp(80px, 16vw, 161px); }
    .pg_ban h3 { margin-top: clamp(15px, 3vw, 26px); font-size: clamp(200%, 5.4vw, 270%) }
    .pg_ban p { margin-top: clamp(20px, 4vw, 38px); }
    .pg_ban .thumb { border-radius: 0; left: 0; translate: 0; }

    .flex_cont { flex-direction: column; align-items: flex-start; gap: clamp(30px, 6vw, 60px); }
    .flex_cont .img_wrap { width: 100%; }
    .flex_cont .txt_wrap { width: 100%; padding-left: 0; }
    .flex_cont.flex_rev .txt_wrap { padding-right: 0; }
    .flex_cont + .flex_cont { padding-top: clamp(50px, 10vw, 100px); }
    
    .sticky_wrap h5 { margin-top: clamp(15px, 4vw, 40px); }
    .sticky_wrap p { margin-top: clamp(15px, 2vw, 21px); }
    .sticky_wrap .sub_title ul { margin-top: clamp(15px, 3vw, 30px); }
    .sticky_wrap .sub_title ul li + li { margin-top: clamp(6px, 1.2vw, 12px); }
    .sticky_wrap .sub_title ul + p { margin-top: clamp(15px, 3vw, 30px); }
    .sticky_wrap .txt_wrap > ul > li + li { margin-top: clamp(30px, 8vw, 80px); padding-top: clamp(30px, 8vw, 79px); }

    .bullet_list > li { gap: clamp(7px, 0.8vw, 8px); }
    .bullet_list > li + li { margin-top: clamp(5px, 0.6vw, 6px); }
    .bullet_list > li::before { width: clamp(3px, 0.5vw, 4px); }

}

@media (max-width: 860px) {
    .sticky_wrap { flex-direction: column; gap: clamp(30px, 8vw, 80px); }
    .sticky_wrap > .sub_title { position: static; width: 100%; }
    .sticky_wrap .txt_wrap { width: 100%; padding-left: 0; margin: 0; }
    .sticky_wrap .img_wrap { width: 80%; position: static; height: auto; }
}

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

    회사소개 페이지

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

.sub_about .pg_ban { padding-block: 106px 107px; }
.sub_about .pg_ban .thumb::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; transition: all 0.8s; background: linear-gradient(90deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.25) 25%, rgba(0, 0, 0, 0.50) 50%, rgba(0, 0, 0, 0.25) 75%, rgba(0, 0, 0, 0.08) 100%);  }
.sub_about .pg_ban.aos-animate .thumb::before { opacity: 1; }
.sub_about .pg_ban p + p { margin-top: 13px; }
.sub_about .flex_cont .sub_title { margin: 0; }
.sub_about .flex_cont .sub_title p { color: var(--black-color03); margin-top: 38px; }
.sub_about .flex_cont .sub_title p em { color: var(--black-color01); }
.sub_about .flex_cont.flex_des { padding-bottom: 100px; }
.sub_about .flex_cont.sticky_box { position: sticky; top: 115px; padding-bottom: 160px; z-index: 1; padding-top: 0; }
.sub_about .greeting_wrap { position: relative; background: var(--point-color03); box-sizing: border-box; padding-block: 224px 431px; border-radius: clamp(40px, 8.4vw, 160px) clamp(40px, 8.4vw, 160px) 0 0; font-size: var(--title-20); z-index: 5; }
.sub_about .greeting_wrap .flex_des { justify-content: flex-start; }
.sub_about .greeting_wrap .sub_title { margin: 0; }
.sub_about .greeting_wrap .title_wrap { width: 43.53%; }
.sub_about .greeting_wrap .title_wrap h4 { font-weight: 600; }
.sub_about .greeting_wrap .desc_wrap { width: 56.47%; padding-left: 47px; box-sizing: border-box; }
.sub_about .greeting_wrap .desc_wrap p:first-child { margin-top: 0; }
.sub_about .greeting_wrap .desc_wrap p { font-size: 95%; line-height: 1.69; opacity: 0.8; }
.sub_about .greeting_wrap .desc_wrap p + p { margin-top: 14px; }
.sub_about .greeting_wrap .desc_wrap h5 { display: flex; justify-content: flex-end; align-items: center; text-align: right; margin-top: 35px; gap: 25px; box-sizing: border-box; padding-right: 16px; }
.sub_about .greeting_wrap .desc_wrap h5 small { font-size: 80%; box-sizing: border-box; padding-bottom: 2px; }
.sub_about .greeting_wrap .desc_wrap h5 span { font-weight: 700; letter-spacing: 0.1em; }
.sub_about .greeting_wrap .sub_title { filter: var(--filter-white); }
.sub_about .greeting_wrap::after { content: 'EZMEDIBOT'; color: rgba(255, 255, 255, 0.1); font-family: var(--font-type03); font-size: min(18.7vw, 1800%); font-weight: 700; position: absolute; left: 50%; bottom: -5vw; translate: -50% 0; text-wrap: nowrap; line-height: 1; letter-spacing: 0; text-align: center; }


.sub_about .info_wrap { box-sizing: border-box; padding-block: 160px 205px; }
.sub_about .info_wrap .sticky_wrap .txt_wrap { margin-top: -4px; }
.sub_about .info_wrap .sticky_wrap h5 { margin-top: 26px; }
.sub_about .info_wrap .sticky_wrap p { margin-top: 20px; }
.sub_about .info_wrap .flex_des { align-items: flex-start; }
.sub_about .info_wrap .info_list h4 { display: flex; align-items: baseline; gap: 14px; font-size: 100px; font-weight: 600; font-family: var(--font-type03); line-height: 1; letter-spacing: 0; }
.sub_about .info_wrap .info_list h4 small { font-size: 34%; translate: 0 -3px; }

.sub_about .info_wrap .info_list .ani_wrap { display: inline-flex; flex-wrap: wrap; line-height: 1; }
.sub_about .info_wrap .info_list .aos-animate h4 .count_list { translate: 0; transition: all 4s; }
.sub_about .info_wrap .info_list h4 .count_box:nth-child(2n) .count_list { translate: 0; }
.sub_about .info_wrap .info_list h4 .count_box { height: 100px; overflow: hidden; display: inline-block; }
.sub_about .info_wrap .info_list h4 .count_list { display: flex; flex-direction: column; translate: 0 calc(-100% + 100px); }
.sub_about .info_wrap .info_list .aos-animate h4 .count_box:nth-child(2n) .count_list { translate: 0 calc(-100% + 100px); }


.sub_about .info_wrap .info_list .patent { display: inline-block; box-sizing: border-box; padding-block: 27px 22px; padding-inline: 30px; background: var(--point-white); font-size: var(--title-20); display: inline-flex; flex-direction: column; gap: 21px; justify-content: space-between; border-radius: var(--radius-15); margin-top: 39px; }
.sub_about .info_wrap .info_list .patent dt { color: var(--black-color03); font-weight: 500; font-size: 100%; letter-spacing: -0.03em; }
.sub_about .info_wrap .info_list .patent dd { display: flex; align-items: baseline; gap: 6px; color: var(--black-color03); font-weight: 500; font-size: 50px; letter-spacing: 0; font-family: var(--font-type03); margin-left: 114px; }
.sub_about .info_wrap .info_list .patent dd small { font-size: var(--title-18); translate: 0 -3px; }

.sub_about .info_wrap .info_list .aos-animate dd .count_list { translate: 0; transition: all 4s; }
.sub_about .info_wrap .info_list dd .count_box:nth-child(2n) .count_list { translate: 0; }
.sub_about .info_wrap .info_list dd .count_box { height: 50px; overflow: hidden; display: inline-block; }
.sub_about .info_wrap .info_list dd .count_list { display: flex; flex-direction: column; translate: 0 calc(-100% + 50px); }
.sub_about .info_wrap .info_list .aos-animate dd .count_box:nth-child(2n) .count_list { translate: 0 calc(-100% + 50px); }


.sub_about .info_wrap .info_list > li + li { padding-top: 66px; }
.sub_about .info_wrap .info_list > li:nth-child(2) h4 small { font-size: 30%; }

.sub_about .history_wrap { position: relative; background: var(--point-white); box-sizing: border-box; padding-block: 160px 249px; z-index: 10; }
.sub_about .history_wrap .sub_title { margin-bottom: 80px; }
.sub_about .history_wrap .history_title { font-size: var(--title-20); width: 40%; position: sticky; top: 140px; box-sizing: border-box; padding-right: 40px; }
.sub_about .history_wrap .history_title h3 { font-size: 800%; font-weight: 500; font-family: var(--font-type03); letter-spacing: -0.03em; }
.sub_about .history_wrap .history_title h3 span { display: inline-block; }
.sub_about .history_wrap .history_title h3 span:nth-child(2) { transition-delay: 0.2s; }
.sub_about .history_wrap .history_title h3 span:nth-child(3) { transition-delay: 0.4s; }
.sub_about .history_wrap .history_title h3 span:nth-child(4) { transition-delay: 0.6s; }
.sub_about .history_wrap .history_cont { font-size: var(--title-20); width: 60%; box-sizing: border-box; padding-left: clamp(50px, 5.5vw, 100px); padding-top: 63px; }
.sub_about .history_wrap .history_cont li { box-sizing: border-box; border-bottom: 1px solid var(--border-color01); padding-bottom: 30px; }
.sub_about .history_wrap .history_cont li:not(:last-child) { margin-bottom: 30px;   }
.sub_about .history_wrap .history_box { box-sizing: border-box; }
.sub_about .history_wrap .history_box .for_m { display: none; }
.sub_about .history_wrap .history_box + .history_box { padding-top: 80px; }

.sub_about .bullet_list > li { font-size: 100%; gap: 10px; font-family: var(--font-type01); line-height: 1.5; }
.sub_about .bullet_list > li::before { width: 5px; }


.sub_about .model_cont {  position: relative; isolation: isolate; }
.sub_about .model_cont > div { box-sizing: border-box; padding-block: 140px 180px; }
.sub_about .model_cont .sub_title { text-align: center; margin-bottom: 60px; }

.sub_about .model_cont .model_list { position: relative; background: var(--trans-color); }
.sub_about .model_cont .model_list .logo_cen { position: absolute; left: 50%; top: 40%; translate: -50% -50%; z-index: 2; width: clamp(300px, 19.8vw, 380px); height: clamp(300px, 19.8vw, 380px); border-radius: 100%; display: flex; align-items: center; justify-content: center; background: var(--point-gradi01); padding: 20px; box-sizing: border-box; box-shadow: var(--shadow-03); }
.sub_about .model_cont .model_list .logo_cen span { display: flex; align-items: inherit; justify-content: inherit; background: var(--point-white); width: 100%; height: 100%; border-radius: inherit; padding: 40px; box-sizing: border-box; }
.sub_about .model_cont .model_list .logo_cen span img { width:100%; max-width: 156px; }
.sub_about .model_cont .model_list ul { position: relative; display: flex; flex-wrap: wrap; }
.sub_about .model_cont .model_list ul::before { content: ''; position: absolute; left: 50%; top: 0; width: 1px; height: 50%; background: var(--border-color01); }
.sub_about .model_cont .model_list li { position: relative; width: 50%; padding-block: 0 31px; padding-inline: clamp(30px, 3.2vw, 60px) clamp(160px, 12.5vw, 232px); box-sizing: border-box; font-size: var(--title-20);}
.sub_about .model_cont .model_list li:nth-child(2n) { padding-inline: clamp(160px, 12.5vw, 232px) clamp(30px, 3.2vw, 60px); }
.sub_about .model_cont .model_list li:nth-child(3){width:100%;padding:190px 0 0 0;}
.sub_about .model_cont .model_list li .line{width:90%;height:1px;background:var(--border-color01);position: absolute;bottom:-50%;}
.sub_about .model_cont .model_list li:nth-child(1) .line{transform:rotate(-25deg);right:0;}
.sub_about .model_cont .model_list li:nth-child(2) .line{transform:rotate(25deg);left:0;}
.sub_about .model_cont .model_list li .line:before{position: absolute; content: ''; width: 13px; aspect-ratio: auto 1; border: 3px solid var(--point-color01); background: var(--point-white); border-radius: 100%; box-sizing: border-box;bottom:-5px;}
.sub_about .model_cont .model_list li:nth-child(1) .line:before{left:0;}
.sub_about .model_cont .model_list li:nth-child(2) .line:before{right:0;}

.sub_about .model_cont .model_list li .img_wrap { text-align: center; margin-bottom: 9px; }
.sub_about .model_cont .model_list li:nth-child(3) .img_wrap img { mix-blend-mode: darken; }
.sub_about .model_cont .model_list li dl { font-size: var(--title-20); text-align: center; }
.sub_about .model_cont .model_list li dt { color: var(--black-color01); font-weight: 600; font-size: 100%; letter-spacing: -0.03em; }
.sub_about .model_cont .model_list li dd { color: var(--black-color06); font-weight: 400; font-size: 90%; letter-spacing: -0.03em; margin-top: 4px; }

.sub_about .model_cont .model_list li:nth-child(1)::after {position: absolute; content: ''; width: 13px; aspect-ratio: auto 1; border: 3px solid var(--point-color01); background: var(--point-white); border-radius: 100%; box-sizing: border-box;  top: 0; right: 0; translate: 50% 0; }
.sub_about .rel_cont { position: relative; z-index: 10; }

@media (max-width: 1023px) {

    .sub_about .pg_ban { padding-block: clamp(50px, 10vw, 106px) clamp(50px, 10vw, 107px); }
    .sub_about .flex_cont .sub_title p { margin-top: clamp(15px, 3vw, 38px); }

    .sub_about .flex_cont.sticky_box { top: calc(15px + clamp(65px, 11.5vw, 115px)); }

    .sub_about .greeting_wrap { padding-block: clamp(110px, 22vw, 224px) clamp(130px, 25vw, 431px); }
    .sub_about .greeting_wrap .flex_des { flex-direction: column; gap: clamp(30px, 6vw, 60px); }

    .sub_about .greeting_wrap .title_wrap { width: 100%; }
    .sub_about .greeting_wrap .desc_wrap { padding-left: 0; width: 100%; }
    .sub_about .greeting_wrap .desc_wrap h5 { margin-top: clamp(17px, 3.5vw, 35px); padding-right: 0; gap: clamp(15px, 2.5vw, 25px); }

    .sub_about .info_wrap { padding-block: clamp(80px, 16vw, 160px) clamp(80px, 16vw, 205px); }
    .sub_about .info_wrap .sticky_wrap h5 { margin-top: clamp(20px, 2.6vw, 26px); }
    .sub_about .info_wrap .sticky_wrap p { margin-top: clamp(15px, 2vw, 20px); }
    .sub_about .info_wrap .info_list .patent { padding-block: clamp(15px, 2.6vw, 26px) 15px; padding-inline: clamp(15px, 3vw, 30px); margin-top: clamp(20px, 4vw, 40px); gap: clamp(7px, 1.3vw, 13px); }


    .sub_about .info_wrap .info_list li + li { padding-top: clamp(30px, 7vw, 66px); }


    .sub_about .history_wrap { padding-block: clamp(80px, 16vw, 160px) clamp(80px, 20vw, 249px); }
    .sub_about .history_wrap .sub_title { margin-bottom: clamp(40px, 8vw, 80px); }
    .sub_about .history_wrap .history_title h3 { font-size: clamp(400%, 14vw, 800%); }
    .sub_about .history_wrap .history_cont li { padding-bottom: clamp(15px, 3vw, 30px); }
    .sub_about .history_wrap .history_cont li:not(:last-child) { margin-bottom: clamp(15px, 3vw, 30px); }
    .sub_about .history_wrap .history_box + .history_box { padding-top: clamp(40px, 8vw, 80px); }


    .sub_about .model_cont > div { padding-block: clamp(70px, 14vw, 140px) clamp(90px, 18vw, 180px); }
    .sub_about .model_cont .sub_title { margin-bottom: clamp(30px, 6vw, 60px); }
    .sub_about .model_cont .model_list ul::before { display: none; }
    .sub_about .model_cont .model_list .logo_cen { position: relative; inset: 0; translate: 0; margin: 0 auto clamp(40px, 6vw, 60px); width: clamp(230px, 40vw, 300px); height: clamp(230px, 40vw, 300px); padding: clamp(15px, 2vw, 20px); }
    .sub_about .model_cont .model_list li { width: 100%; padding-inline: 0 !important; padding-block: clamp(50px, 6vw, 60px) 0 !important; }
    .sub_about .model_cont .model_list li:nth-child(1) { border-top: 1px solid var(--border-color01); }
    .sub_about .model_cont .model_list li:nth-child(1)::before { display: none; }
    .sub_about .model_cont .model_list li::after { display: none; }
    .sub_about .model_cont .model_list li:nth-child(1) .img_wrap::before { content: ''; position: absolute; left: 0; top: 0; width: clamp(10px, 1.3vw, 13px); translate: 0 -50%; aspect-ratio: auto 1; background: var(--point-white); border: 3px solid var(--point-color01); box-sizing: border-box; border-radius: 100%; }
    .sub_about .model_cont .model_list li:nth-child(1) .img_wrap::after { content: ''; position: absolute; right: 0; top: 0; width: clamp(10px, 1.3vw, 13px); translate: 0 -50%; aspect-ratio: auto 1; background: var(--point-white); border: 3px solid var(--point-color01); box-sizing: border-box; border-radius: 100%; }
    
    .sub_about .model_cont .model_list li:nth-child(n + 2) { padding-block: clamp(30px, 4vw, 40px) 0 !important; }

    .sub_about .model_cont .model_list li .img_wrap { margin-bottom: clamp(20px, 4vw, 40px); }
    .sub_about .model_cont .model_list li:last-child { padding-bottom: 0 !important; }
	.sub_about .model_cont .model_list li .line{display: none;}


    .sub_about .info_wrap .info_list h4 { font-size: 84px; gap: clamp(7px, 1.4vw, 14px); }
    .sub_about .info_wrap .info_list h4 .count_box { height: 84px }
    .sub_about .info_wrap .info_list h4 .count_list { display: flex; flex-direction: column; translate: 0 calc(-100% + 84px); }
    .sub_about .info_wrap .info_list .aos-animate h4 .count_box:nth-child(2n) .count_list { translate: 0 calc(-100% + 84px); }

    .sub_about .info_wrap .info_list .patent dd { font-size: 40px; }
    .sub_about .info_wrap .info_list dd .count_box { height: 40px; }
    .sub_about .info_wrap .info_list dd .count_list { display: flex; flex-direction: column; translate: 0 calc(-100% + 40px); }
    .sub_about .info_wrap .info_list .aos-animate dd .count_box:nth-child(2n) .count_list { translate: 0 calc(-100% + 40px); }

    .sub_about .bullet_list > li { gap: clamp(7px, 1vw, 10px); }
    .sub_about .bullet_list > li::before { width: clamp(3px, 0.5vw, 5px); }

    .sub_about .flex_cont.flex_rev { flex-direction: row-reverse; align-items: center; }
    .sub_about .flex_cont.flex_des { flex-direction: row; align-items: center; padding-bottom: clamp(50px, 10vw, 100px); }
    .sub_about .flex_cont .img_wrap img { min-height: 440px; }
}

@media (max-width: 860px) {
    .sub_about .history_wrap .history_title { position: static; width: 100%; padding: 0; }
    .sub_about .history_wrap .history_cont { width: 100%; padding-left: 0; padding-top: 0; }
    .sub_about .info_wrap .flex_des { flex-direction: column; }

    .sub_about .info_wrap .info_list h4 { font-size: 14vw; }
    .sub_about .info_wrap .info_list h4 .count_box { height: 14vw; }
    .sub_about .info_wrap .info_list h4 .count_list { display: flex; flex-direction: column; translate: 0 calc(-100% + 14vw); }
    .sub_about .info_wrap .info_list .aos-animate h4 .count_box:nth-child(2n) .count_list { translate: 0 calc(-100% + 14vw); }

    .sub_about .info_wrap .info_list .patent dd { font-size: 7vw; }
    .sub_about .info_wrap .info_list dd .count_box { height: 7vw; }
    .sub_about .info_wrap .info_list dd .count_list { display: flex; flex-direction: column; translate: 0 calc(-100% + 7vw); }
    .sub_about .info_wrap .info_list .aos-animate dd .count_box:nth-child(2n) .count_list { translate: 0 calc(-100% + 7vw); }

    .sub_about .history_wrap .history_box .for_m { display: block; }
    .sub_about .history_wrap .history_box li.sub_title::before { display: none; }
    .sub_about .history_wrap .history_box li.sub_title { margin-block: 0 clamp(30px, 8vw, 80px);; padding: 0; border-bottom: 0; }
    .sub_about .history_wrap .history_box li.sub_title h3 { font-size: clamp(400%, 14vw, 800%); }
    
}

@media (max-width: 640px) {
    .sub_about .model_cont .model_list li .img_wrap { max-width: 220px; margin-inline: auto; }

    .sub_about .model_cont .model_list li .img_wrap::before { border-width: 2px; }
    .sub_about .model_cont .model_list li .img_wrap::after { border-width: 2px; }

    .sub_about .flex_cont.flex_rev { flex-direction: column; align-items: flex-start; }
    .sub_about .flex_cont.flex_des { flex-direction: column; align-items: flex-start; }
    .sub_about .flex_cont .img_wrap img { min-height: auto; }
}


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

    rd 페이지

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

.sub_rd .pg_ban .thumb::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; transition: all 0.8s; background: linear-gradient(90deg, rgba(0, 0, 0, 0.14) 0%, rgba(0, 0, 0, 0.28) 25%, rgba(0, 0, 0, 0.42) 50%, rgba(0, 0, 0, 0.28) 75%, rgba(0, 0, 0, 0.14) 100%); }
.sub_rd .pg_ban.aos-animate .thumb::before { opacity: 1; }

.sub_rd .rd_cont .rd_desc { margin-bottom: 79px; }
.sub_rd .rd_cont .rd_desc h4 { line-height: 1.29; }
.sub_rd .rd_cont .rd_desc p { font-size: 110%; color: var(--black-color03); font-weight: 400; line-height: 1.63; margin-top: 40px; }
.sub_rd .rd_cont .rd_desc p em { font-weight: 500; color: var(--black-color01); }

.sub_rd .sticky_wrap .txt_wrap > ul > li::before { content: counter(num, decimal-leading-zero); counter-increment: num 1; font-size: 500%; font-weight: 600; display: block; font-family: var(--font-type03); line-height: 1; }

.sub_rd .gray_bg { margin-top: 159px; box-sizing: border-box; padding-block: 160px; background: var(--gray-bg01); }
.sub_rd .gray_bg .sub_title { text-align: center; }
.sub_rd .gray_bg .road_map { margin-top: 60px; position: relative; }
.sub_rd .gray_bg .road_map .history_cont { counter-reset: num 0; box-sizing: border-box; padding-left: 40px; position: relative; display: none; }
.sub_rd .gray_bg .road_map .history_box { position: relative; font-size: var(--title-20); width: 100%; }
.sub_rd .gray_bg .road_map .history_box em { position: relative; display: inline-flex; justify-content: center; align-items: center; box-sizing: border-box; padding-block: 10px 7px; padding-inline: 26px 27px; border-radius: 23px; background: var(--point-color09); color: var(--point-white); font-weight: 400; font-size: 110%; letter-spacing: -0.03em; font-family: var(--font-type03); }
.sub_rd .gray_bg .road_map .history_box em::before { content: ''; position: absolute; left: -35px; top: 50%; translate: 0 0; width: 40px; height: 1px; background: var(--point-color09); }
.sub_rd .gray_bg .road_map .history_box em::after { content: ''; position: absolute; left: -35px; top: 52%; translate: -50% -50%; width: 9px; height: 9px; background: var(--point-color09); border-radius: 100%; }
.sub_rd .gray_bg .road_map .history_box dl { font-size: var(--title-20); }
.sub_rd .gray_bg .road_map .history_box dt { color: var(--point-color09); font-size: 150%; line-height: 1.46; letter-spacing: -0.03em; font-weight: 600; }
.sub_rd .gray_bg .road_map .history_box dd { position: relative;  z-index: 2; color: var(--black-color06); font-size: var(--title-20); line-height: 1.56; letter-spacing: -0.03em; font-weight: 400; margin-top: 11px; width: fit-content; }
.sub_rd .gray_bg .road_map .history_box dd span { position: relative; z-index: 2; font-size: 90%; line-height: inherit; display: block; }
.sub_rd .gray_bg .road_map .history_box dd::after { content: counter(num, decimal-leading-zero); counter-increment: num 1; position: absolute; left: 0; top: 100%; translate: 0 0; font-family: var(--font-type03); font-weight: 600; font-size: 500%; line-height: 1; width: max-content; background: linear-gradient(180deg, var(--gray-bg01) 0%, var(--border-color01) 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; z-index: 1; }

.sub_rd .gray_bg .road_map .history_box:not(:last-child) { padding-bottom: clamp(80px, 10vw, 115px); }

.sub_rd .gray_bg .road_map .desc_wrap { box-sizing: border-box; margin-top: clamp(15px, 3vw, 40px); }

.sub_rd .gray_bg .road_map .history_box:nth-child(3) em { background: var(--point-color10); }
.sub_rd .gray_bg .road_map .history_box:nth-child(3) em::before { background: var(--point-color10); }
.sub_rd .gray_bg .road_map .history_box:nth-child(3) em::after { background: var(--point-color10); }
.sub_rd .gray_bg .road_map .history_box:nth-child(3) dt { color: var(--point-color10); }

.sub_rd .gray_bg .road_map .history_box:nth-child(4) em { background: var(--point-color11); }
.sub_rd .gray_bg .road_map .history_box:nth-child(4) em { background: var(--point-color11); }
.sub_rd .gray_bg .road_map .history_box:nth-child(4) em::before { background: var(--point-color11); }
.sub_rd .gray_bg .road_map .history_box:nth-child(4) em::after { background: var(--point-color11); }
.sub_rd .gray_bg .road_map .history_box:nth-child(4) dt { color: var(--point-color11); }

.sub_rd .gray_bg .road_map .history_box:nth-child(5) em { background: var(--point-color12); }
.sub_rd .gray_bg .road_map .history_box:nth-child(5) em { background: var(--point-color12); }
.sub_rd .gray_bg .road_map .history_box:nth-child(5) em::before { background: var(--point-color12); }
.sub_rd .gray_bg .road_map .history_box:nth-child(5) em::after { background: var(--point-color12); }
.sub_rd .gray_bg .road_map .history_box:nth-child(5) dt { color: var(--point-color12); }

.sub_rd .gray_bg .road_map .history_box:nth-child(6) em { background: var(--point-color13); }
.sub_rd .gray_bg .road_map .history_box:nth-child(6) em { background: var(--point-color13); }
.sub_rd .gray_bg .road_map .history_box:nth-child(6) em::before { background: var(--point-color13); }
.sub_rd .gray_bg .road_map .history_box:nth-child(6) em::after { background: var(--point-color13); }
.sub_rd .gray_bg .road_map .history_box:nth-child(6) dt { color: var(--point-color13); }

.sub_rd .gray_bg .road_map .line { position: absolute; left: 4px; top: 20px; width: 1px; height: calc(100% - 20px); display: block; background: var(--border-color02); }
.sub_rd .gray_bg .road_map .line span { position: absolute; left: 0; top: 0; width: 100%; background: var(--point-gradi03); }


@media (max-width: 1023px) {

    .sub_rd .rd_cont .rd_desc { margin-bottom: clamp(40px, 8vw, 79px); }
    .sub_rd .rd_cont .rd_desc p { margin-top: clamp(20px, 4vw, 40px); }
    
    .sub_rd .gray_bg { margin-top: clamp(80px, 16vw, 159px); padding-block: clamp(80px, 16vw, 160px); }
    .sub_rd .gray_bg .road_map { margin-top: clamp(40px, 6vw, 60px); }
    .sub_rd .gray_bg .road_map > .img_wrap { display: none; }
    .sub_rd .gray_bg .road_map .history_cont { display: block; }
    .sub_rd .gray_bg .road_map .history_box em { padding-inline: clamp(17px, 2.5vw, 26px) clamp(17px, 2.5vw, 27px); padding-block: clamp(7px, 0.8vw, 8px) clamp(6px, 0.8vw, 8px); }
    .sub_rd .gray_bg .road_map .history_box dd { margin-top: clamp(7px, 1vw, 11px); }
    .sub_rd .gray_bg .road_map .history_box dd::after { font-size: clamp(300%, 8vw, 500%); }

    .sub_rd .sticky_wrap .txt_wrap > ul > li::before { font-size: clamp(250%, 8vw, 500%); }
}

@media (max-width: 860px) {
    
}

@media (max-width: 479px) {
    .sub_rd .sticky_wrap .img_wrap { width: 100%; }
}

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

    제품소개 페이지

───────────────────────────────────────────────────────────*/
.sub_prd .prd_cont { box-sizing: border-box; position: relative; }
.sub_prd .prd_cont + .prd_cont { margin-top: 160px; }

.sub_prd .prd_cont a.content_posi { position: absolute; left: 0; top: -130px; }

.sub_prd .ez_cont .sub_title { margin-bottom: 60px; }
.sub_prd .ez_cont .sub_title .ico { display: block; width: auto; height: auto; max-width: 183px; }
.sub_prd .ez_cont .sub_title h3 span { display: block; margin-top: 21px; }
.sub_prd .ez_cont .sub_title p { font-family: var(--font-type03); }
.sub_prd .ez_cont .num_list { counter-reset: num 0; }
.sub_prd .ez_cont .num_list > li { box-sizing: border-box; padding-block: 35px 32px; padding-inline: 33px; border: 1px solid var(--border-color01); border-radius: var(--radius-15); }
.sub_prd .ez_cont .num_list > li + li { margin-top: 30px; }
.sub_prd .ez_cont .num_list dl { font-size: var(--title-20); }
.sub_prd .ez_cont .num_list dt { display: flex; align-items: baseline; gap: 15px; color: var(--black-color03); font-weight: 500; font-size: 140%; line-height: 1.5; letter-spacing: -0.03em; font-family: var(--font-type03); }
.sub_prd .ez_cont .num_list dt::before { content: counter(num, decimal-leading-zero); counter-increment: num 1; width: 40px; height: 40px; display: inline-flex; justify-content: center; align-items: center; color: var(--point-white); font-size:70%; font-weight: 500; border-radius: 100%; flex-shrink: 0; translate: 0 -2px; box-sizing: border-box; padding-top: 2px; letter-spacing: 0; }
.sub_prd .ez_cont .num_list dd { margin-top: 19px; }
.sub_prd .ez_cont .num_list dd .bullet_list > li{font-size:95%;}
.sub_prd .ez_cont .num_list dd .bullet_list > li::before{translate:0 -5px;}
.sub_prd .ez_cont .num_list > li:nth-child(2) ul { column-count: 2; }


.sub_prd .ez_cont .num_list > li:nth-child(odd) dt::before { background: var(--point-color04); }
.sub_prd .ez_cont .num_list > li:nth-child(even) dt::before { background: var(--point-color08); }

.sub_prd .prd_bg01 { background: var(--black-color00) url('../images/sub/img_prd_bg01.jpg') no-repeat 70% bottom / cover; padding-block: 160px; }
.sub_prd .prd_bg01 .prd_title { font-size: var(--title-20); }
.sub_prd .prd_bg01 .prd_title h4 { filter: var(--filter-white); font-weight: 400; font-size: clamp(160%, 2.6vw, 240%); line-height: 1.3; letter-spacing: -0.03em; }
.sub_prd .prd_bg01 .prd_title h4 em { font-weight: 600; }
.sub_prd .prd_bg01 .prd_title h3 { font-size: clamp(480%, 6.4vw, 600%); font-weight: 700; letter-spacing: 0; margin-top: 12px; }
.sub_prd .prd_bg01 .prd_title h3 em { font-weight: inherit; background: var(--point-gradi01); background-clip: text; -webkit-text-fill-color: transparent; }
.sub_prd .prd_bg01 .prd_desc { margin-top: 122px; font-size: var(--title-20); filter: var(--filter-white); }
.sub_prd .prd_bg01 .prd_desc h5 { font-size: clamp(135%, 1.6vw, 150%); font-weight: 600; letter-spacing: -0.03em; line-height: 1.46; }
.sub_prd .prd_bg01 .prd_desc p { opacity: 0.8; font-weight: 400; font-size: 110%; line-height: 1.64; letter-spacing: -0.03em; margin-top: 19px; }
.sub_prd .prd_bg01 .prd_desc p em { font-weight: 600; }

.sub_prd .ub_cont .sub_title { margin: 0; }
.sub_prd .ub_cont .sub_title p { font-size: 95%; line-height: 1.69; margin-top: 20px; }

.sub_prd .prd_bg02 { position: relative; box-sizing: border-box; padding-block: 160px; background: url('../images/sub/img_prd_bg02.jpg') no-repeat center / cover; }
.sub_prd .prd_bg02 .img_wrap { max-width: 600px; margin-inline: auto;}
.sub_prd .prd_bg02 .flex_des { width: 100%; justify-content: space-between; gap: 30px; position: absolute; left: 0; top: 49.2%; translate: 0 -50%; }
.sub_prd .prd_bg02 .flex_des li { display: flex; gap: 24px; font-size: var(--title-20); align-items: center; }
.sub_prd .prd_bg02 .flex_des li + li { margin-top: 40px; }
.sub_prd .prd_bg02 .flex_des li em { display: block; width: 100px; aspect-ratio: auto 1; background: var(--point-gradi01); border-radius: 100%; flex-shrink: 0; }
.sub_prd .prd_bg02 .flex_des li span { filter: var(--filter-white); font-weight: 500; font-size: 100%; letter-spacing: -0.03em; }
.sub_prd .prd_bg02 .flex_des li span small { font-weight: 400; font-size: 90%; }
.sub_prd .prd_bg02 .flex_des .right_box li { flex-direction: row-reverse; }

.sub_prd .utru_cont { margin-top: 150px; }
.sub_prd .utru_cont { flex-direction: row-reverse; }
.sub_prd .utru_cont .txt_wrap dt { max-width: 317px; margin-bottom: 39px; }
.sub_prd .utru_cont .txt_wrap .bullet_list li { color: var(--black-color05); font-size: 100%; font-family: var(--font-type01); gap: 10px; }
.sub_prd .utru_cont .txt_wrap .bullet_list li + li { margin-top: 9px; }
.sub_prd .utru_cont .txt_wrap .bullet_list li::before { width: 5px; }

@media (max-width: 1240px) {
    .sub_prd .prd_bg02 .flex_des { position: static; translate: unset; flex-direction: row; flex-wrap: wrap;  }
    .sub_prd .prd_bg02 .flex_des .right_box li { flex-direction: row; }
}

@media (max-width: 1023px) {
    .sub_prd .prd_cont + .prd_cont { margin-top: clamp(80px, 16vw, 160px); }
    .sub_prd .prd_cont a.content_posi { top: clamp(-130px, -15vw, -110px); }

    .sub_prd .ez_cont .sub_title { margin-bottom: clamp(30px, 6vw, 60px); }
    .sub_prd .ez_cont .sub_title .ico { max-width: clamp(150px, 18vw, 183px); }
    .sub_prd .ez_cont .sub_title h3 span { margin-top: clamp(15px, 2vw, 21px); }

    .sub_prd .ez_cont .num_list > li { padding-block: clamp(20px, 3vw, 35px) clamp(20px, 3vw, 32px); padding-inline: clamp(20px, 3vw, 33px); }
    .sub_prd .ez_cont .num_list > li + li { margin-top: clamp(20px, 3vw, 30px); }
    .sub_prd .ez_cont .num_list dt { gap: clamp(10px, 1.5vw, 15px); }
    .sub_prd .ez_cont .num_list dt::before { width: clamp(28px, 4vw, 40px); height: clamp(28px, 4vw, 40px); }
    .sub_prd .ez_cont .num_list dd { margin-top: clamp(15px, 2vw, 19px); }

    .sub_prd .prd_bg01 { padding-block: clamp(80px, 16vw, 160px) clamp(160px, 50vw, 500px); background: var(--black-color00) url('../images/sub/img_prd_bg01.jpg') no-repeat 70% 100% / 130%; }
    .sub_prd .prd_bg01 .prd_title h3 { font-size: clamp(420%, 9vw, 480%); }
    .sub_prd .prd_bg01 .prd_title h4 { font-size: clamp(140%, 3.2vw, 160%) }
    .sub_prd .prd_bg01 .prd_desc { margin-top: clamp(40px, 8vw, 122px); }
    .sub_prd .prd_bg01 .prd_desc h5 { font-size: clamp(120%, 2.6vw, 135%); }
    .sub_prd .prd_bg01 .prd_desc p { font-size: clamp(100%, 2.2vw, 110%); }

    .sub_prd .ub_cont .sub_title p { margin-top: clamp(15px, 2vw, 20px); }
    
    .sub_prd .prd_bg02 { padding-block: clamp(80px, 16vw, 160px); }
    .sub_prd .prd_bg02 .flex_des { margin-top: clamp(30px, 6vw, 60px); gap: clamp(20px, 4vw, 40px); }
    .sub_prd .prd_bg02 .flex_des li { gap: clamp(20px, 2.4vw, 24px); width: 50%; }
    .sub_prd .prd_bg02 .flex_des li em { width: clamp(60px, 10vw, 100px); }
    .sub_prd .prd_bg02 .flex_des li + li { margin-top: clamp(20px, 4vw, 40px); }

    .sub_prd .utru_cont .flex_des { flex-direction: column; }
    .sub_prd .utru_cont .flex_des .txt_wrap { padding-right: 0; }
    .sub_prd .utru_cont .txt_wrap dt { margin-bottom: clamp(20px, 4vw, 39px); }
    .sub_prd .utru_cont .txt_wrap .bullet_list li { gap: clamp(7px, 1vw, 10px); }
    .sub_prd .utru_cont .txt_wrap .bullet_list li + li { margin-top: clamp(5px, 0.7vw, 9px); }
    .sub_prd .utru_cont .txt_wrap .bullet_list li::before { width: clamp(3px, 0.5vw, 5px); }
}

@media (max-width: 640px) {
    .sub_prd .prd_bg02 .img_wrap { width: 80%; }
    .sub_prd .prd_bg02 .flex_des { flex-direction: column; }
    .sub_prd .utru_cont .txt_wrap dt { max-width: 253px }
}

@media (max-width: 479px) {
    .sub_prd .ez_cont .num_list > li:nth-child(2) ul { column-count: 1; }
    .sub_prd .prd_bg02 .img_wrap { width: 100%; }
}

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

    일반 게시판

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

#wrap :where(select, input:where([type="text"], [type="password"], [type="number"], [type="date"])) { height: 60px; color: var(--black-color02); font-size: var(--title-18); font-weight: 500; outline: none; box-sizing: border-box; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; padding-inline: 20px 23px; letter-spacing: 0; margin: 0; border: 0; }
#wrap input:where([type="text"], [type="password"], [type="number"], [type="date"])::placeholder { color: var(--black-color10); font-weight: 400;  }

#wrap .board_search { line-height: 1.3; margin: 0; text-align: right; font-size: 0; width: 100%; box-sizing: border-box; padding: 0; background: var(--trans-color); }
#wrap .board_search .bbs_search { float: unset; }
#wrap .board_search_wrap { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; margin-bottom: 40px; }
#wrap .board_search .board_search_sel { display: inline-flex; gap: 10px; width: auto; margin-bottom: 0; }
#wrap .board_search select { width: 160px; padding-inline: 24px 40px; border-radius: var(--radius-10); margin: 0; background: var(--gray-bg01) url('../images/sub/ico_sel_arw02.svg') no-repeat center right 24px; appearance: none; cursor: pointer; background-size: 12px 8px;  }
#wrap .board_search .inp_custom { position: relative; width: calc(100% - 170px); max-width: 450px; }
#wrap .board_search .inp_custom input[type="text"] { width: 100%;  box-sizing: border-box; margin: 0; border-radius: var(--radius-10); padding-inline: 24px 65px ; background: var(--gray-bg01); }
#wrap .board_search .btn_search { position: absolute; right: 0; top: 0; width: 60px; height: 60px; appearance: none; border: none; font-size: 0; background: url('../images//sub/ico_search.svg') no-repeat 15px center; background-size: 22px 22px; }

#wrap .bbs_list { font-size: var(--title-20); border-top: 1px solid var(--black-color03); border-bottom: 0; }
#wrap .bbs_list th { color: var(--black-color01); font-size: 100%; font-weight: 500; padding-block: 29px 30px; box-sizing: border-box; border-bottom: 1px solid var(--border-color01); letter-spacing: 0; }
#wrap .bbs_list td { padding-inline: 20px; font-family: var(--font-type03); font-size: var(--title-18); line-height: 1.3; font-weight: 400; color: var(--black-color08); text-align: center; vertical-align: middle; padding-block: 27px 26px; letter-spacing: 0; box-sizing: border-box; border-bottom: 1px solid var(--border-color01); border-top: 0; }
#wrap .bbs_list td.left { text-align: left; color: var(--black-color03); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: var(--title-19); }
#wrap .bbs_list td.left a { display: flex; align-items: center; gap: 11px; }
#wrap .bbs_list td.left a span { display: inline-block; max-width: calc(100% - 30px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
#wrap .bbs_list td:nth-child(3),
#wrap .bbs_list td:nth-child(4) { color: var(--black-color06); }

#wrap .bbs_list tr.board_notice td { background: var(--point-white); }
#wrap .bbs_list tr.board_notice td:nth-child(1) span { font-size: var(--title-16); color: var(--point-color07); font-weight: 600; box-sizing: border-box; padding-block: 7px 6px; padding-inline: 19px; border: 1px solid var(--point-color07); border-radius: 34px; }
#wrap .bbs_list tr.board_notice td.left { font-weight: 500; font-size: var(--title-20); }

#wrap .paging { display: flex; gap: 10px; justify-content: center; align-items: center; margin: 0; margin-top: 80px; min-height: unset; padding-top: 0; }
#wrap .paging a { display: inline-flex; align-items: center; justify-content: center; font-size: var(--title-17); font-weight: 400; color: var(--black-color08); padding: 0; border: 0; box-sizing: border-box; min-width: 40px; min-height: 40px; width: auto; height: auto; line-height: 1; text-align: center; vertical-align: top; font-family: var(--font-type04); margin: 0; padding-right: 1px; padding-top: 1px; }
#wrap .paging :is(.on a, a.on) { border-radius: 100%; background: var(--point-color01); color: var(--point-white); font-weight: 600; }
#wrap .paging .arrow a {font-size:0; min-width:40px; background:no-repeat center; background-color: var(--gray-bg01); border-radius: 100%; }
#wrap .paging .arrow a img { display: none; }
#wrap .paging .arrow.first a {background-image:url("../images/sub/ico_pagi_first.svg");}
#wrap .paging .arrow.prev a {background-image:url("../images/sub/ico_pagi_prev.svg"); margin-right:10px; margin-left: -2px;}
#wrap .paging .arrow.next a {background-image:url("../images/sub/ico_pagi_next.svg"); margin-left:10px; margin-right: -2px;}
#wrap .paging .arrow.last a {background-image:url("../images/sub/ico_pagi_last.svg");}


@media (max-width: 1023px){
    #wrap .board_search_wrap { margin-bottom: clamp(30px, 4vw, 40px); }

    #wrap .board_search select { width: clamp(120px, 16vw, 160px); background-position: center right clamp(15px, 2.4vw, 24px); padding-inline: clamp(15px, 2.4vw, 24px) clamp(30px, 4vw, 40px); }
    #wrap :where(select, input:where([type="text"], [type="password"], [type="number"], [type="date"])) { padding-inline: clamp(15px, 2vw, 20px) clamp(15px, 2vw, 23px); height: clamp(45px, 7vw, 60px); }
    #wrap .board_search .inp_custom { max-width: clamp(300px, 44vw, 440px); width: calc(100% - (clamp(120px, 18vw, 180px) + 10px)); }
    #wrap .board_search .inp_custom input[type="text"] { padding-inline: clamp(15px, 2.4vw, 24px) clamp(35px, 6.5vw, 65px); }
    #wrap .board_search .btn_search { width: clamp(45px, 6vw, 60px); height: clamp(45px, 6vw, 60px); background-size: clamp(16px, 2.2vw, 22px) clamp(16px, 2.2vw, 22px); }

    #wrap .bbs_list th { padding-block: clamp(15px, 3vw, 29px) clamp(15px, 3vw, 30px); }
    #wrap .bbs_list td { padding-block: clamp(15px, 3vw, 27px) clamp(15px, 3vw, 26px); padding-inline: clamp(10px, 2vw, 20px); }
    #wrap .bbs_list td.left a .board_ico img { width: clamp(13px, 1.6vw, 16px); }

    #wrap .bbs_list tr.board_notice td:nth-child(1) span { padding-inline: clamp(8px, 2vw, 19px); padding-block: clamp(3px, 0.6vw, 7px) clamp(3px, 0.6vw, 6px); }

    #wrap .paging { margin-top: clamp(40px, 8vw, 80px); gap: clamp(5px, 1vw, 10px); }
    #wrap .paging a { min-width: clamp(30px, 4vw, 40px); min-height: clamp(30px, 4vw, 40px);  }
    #wrap .paging .arrow a { min-width: clamp(30px, 4vw, 40px); background-size: auto clamp(8px, 1vw, 10px); }
    #wrap .paging .arrow.next a { margin-left: clamp(5px, 1vw, 10px); }
    #wrap .paging .arrow.prev a { margin-right: clamp(5px, 1vw, 10px); }
}

@media (max-width: 860px){
    #wrap .bbs_list colgroup col:nth-child(1) { width: 100px; }
    #wrap .bbs_list colgroup col:nth-child(3) { width: 100px; }
    #wrap .bbs_list colgroup col:nth-child(4) { width: 100px; }
}

@media (max-width: 640px){
    #wrap .bbs_list:not(:has(.no_data)) :where(colgroup col:nth-child(4), table.bbs_list th:nth-child(4), table.bbs_list td:nth-child(4)) { display: none; }

}

@media (max-width: 479px){
    #wrap .bbs_list colgroup col:nth-child(1) { width: 70px; }
    #wrap .bbs_list:not(:has(.no_data)) :where(colgroup col:nth-child(3), table.bbs_list th:nth-child(3), table.bbs_list td:nth-child(3)) { display: none; }
}

@media (max-width: 360px){
    #wrap .board_search_wrap { flex-direction: column; }
    #wrap .board_search select { width: 100%; }
    #wrap .board_search .inp_custom { width: 100%; max-width: 100%; }
}



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

    게시판 읽기

───────────────────────────────────────────────────────────*/
#wrap .bbs_view { margin-top: 0; box-sizing: border-box; padding-bottom: 40px; border-bottom: 1px solid var(--border-color01); }
#wrap .bbs_view .view_tit { padding-block: 35px 38px; padding-inline: 40px; border-bottom: 1px solid var(--border-color01) ; border-top: 1px solid var(--black-color03); margin: 0 auto; width: 100%; box-sizing: border-box; text-align: left; vertical-align: top; font-size: 0; font-size: var(--title-20); background: var(--point-white); }
#wrap .bbs_view .view_tit h4 { display: flex; align-items: center; flex-wrap: wrap; gap: 15px 16px; border-bottom: 0; padding: 0; font-size: 170%; font-weight: 500; color: var(--black-color02); letter-spacing: 0;  }
#wrap .bbs_view .view_tit h4 em { font-size: var(--title-16); color: var(--point-color07); font-weight: 600; box-sizing: border-box; padding-block: 7px 5px; padding-inline: 19px; border: 1px solid var(--point-color07); border-radius: 34px; }
#wrap .bbs_view .view_tit ul { display: flex; margin-top: 22px; gap: 12px 0; flex-wrap: wrap; }
#wrap .bbs_view .view_tit dl { display: flex; flex-wrap: wrap; align-items: baseline; position: relative; font-size: var(--title-20); line-height: inherit; letter-spacing: 0; gap: 14px; }
#wrap .bbs_view .view_tit dt { color: var(--black-color05); font-weight: 500; font-size: 85%; }
#wrap .bbs_view .view_tit dd { color: var(--black-color08); font-weight: 400; font-size: 85%; font-family: var(--font-type03); }
#wrap .bbs_view .view_tit li:has(+ li) span::after { content: ''; display: inline-block; width: 1px; height: 12px; background: var(--border-color01); margin-inline: 22px 19px; }

#wrap .bbs_view .view_cont { position: relative; padding-block: 61px; padding-inline: 40px; color: var(--black-color03); font-size: var(--title-19); min-height: 461px; margin: 0 auto; width: 100%; box-sizing: border-box; text-align: left; vertical-align: top; word-break: keep-all; letter-spacing: 0; z-index: 2; line-height: 1.68; border-bottom: 0; }
#wrap .bbs_view .view_cont .thumb_img_wrap { padding-bottom: 0; text-align: left; margin-top: 29px; border-radius: 10px; overflow: hidden; width: fit-content; }

#wrap .sub_board .bbs_view .extra_editor_wrap { display: table; table-layout: fixed; border-collapse: collapse; width: 100%; border: 0; border-radius: var(--radius-10); box-sizing: border-box; background: var(--gray-bg01); }
#wrap .sub_board .bbs_view .extra_editor_wrap h4, #wrap .sub_board .bbs_view .extra_editor_wrap .extra_cont { padding-block: 24px; 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: 180px; padding-inline: 29px; background: none; color: var(--black-color05); font-size: var(--title-17); font-weight: 500; position: relative; z-index: 1; letter-spacing: 0; box-sizing: border-box; text-align: center; }
#wrap .sub_board .bbs_view .extra_editor_wrap h4::after { content: ''; position: absolute; right: 0; top: 50%; translate: 0 -50%; width: 1px; height: 12px; background: var(--border-color01); }
#wrap .sub_board .bbs_view .extra_editor_wrap .extra_cont { width: calc(100% - 180px); padding-inline: 60px 30px; }
#wrap .sub_board .bbs_view .extra_editor_wrap .extra_cont span { font-size: var(--title-17); font-weight: 400; color: var(--black-color08) !important; vertical-align: middle; display: block; letter-spacing: 0; }
#wrap .sub_board .bbs_view .extra_editor_wrap .extra_cont span a { font-size: inherit; color: inherit !important; font-weight: inherit; }
#wrap .sub_board .bbs_view .extra_editor_wrap .extra_cont span + span { margin-top: 12px; }

#wrap .sub_board .btn_wrap { position: relative; inset: auto; padding: 0; margin: 80px 0 0; display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; }


@media (max-width: 1023px) {
    #wrap .bbs_view { padding-bottom: clamp(30px, 4vw, 40px); }
    #wrap .bbs_view .view_tit { padding-block: clamp(20px, 4vw, 35px) clamp(20px, 4vw, 38px); padding-inline: clamp(20px, 4vw, 40px); }
    #wrap .bbs_view .view_tit h4 { font-size: clamp(140%, 3.4vw, 170%); }
    #wrap .bbs_view .view_tit h4 em { padding-inline: clamp(8px, 2vw, 19px); padding-block: clamp(3px, 0.7vw, 7px) clamp(3px, 0.6vw, 6px); }
    #wrap .bbs_view .view_tit ul { margin-top: clamp(15px, 2vw, 22px); }
    #wrap .bbs_view .view_tit li:has(+ li) span::after { margin-inline: clamp(12px, 2vw, 22px) clamp(12px, 2vw, 19px); height: clamp(10px, 1.2vw, 12px); }
    #wrap .bbs_view .view_tit dl { gap: clamp(7px, 1.4vw, 14px); }
    #wrap .bbs_view .view_cont { padding-block: clamp(30px, 6vw, 61px); padding-inline: clamp(2px, 4vw, 40px); min-height: clamp(200px, 46vw, 461px); }
    #wrap .bbs_view .view_cont .thumb_img_wrap { margin-top: clamp(20px, 3vw, 29px); }

    #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, 24px); }
    #wrap .sub_board .bbs_view .extra_editor_wrap h4 { width: clamp(100px, 18vw, 180px); padding-inline: clamp(20px, 3vw, 29px); }
    #wrap .sub_board .bbs_view .extra_editor_wrap .extra_cont { width: calc(100% - clamp(100px, 18vw, 180px)); padding-inline: clamp(30px, 6vw, 60px) clamp(20px, 3vw, 30px); }
    #wrap .sub_board .btn_wrap { margin-top: clamp(40px, 8vw, 80px); }
}

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

    게시판 쓰기

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

label:has([type="checkbox"]){display: flex;align-items: flex-start;gap: 10px;font-size: var(--title-20);font-weight: 500;color: var(--black-color01);line-height: 24px;transition: all 0.4s;cursor: pointer; letter-spacing: -0.03em;}
label:has([type="checkbox"]) em{font-weight: 600;color: var(--point-color05);display: contents;}
label [type="checkbox"]{position: relative;display: inline-flex;width: 24px;height: 24px;border: 1px solid var(--border-color01);background: var(--point-white);border-radius: var(--radius-05);box-sizing: border-box;transition: inherit;cursor: pointer;flex-shrink: 0; line-height: inherit;}
label [type="checkbox"]:before{position: absolute;content:'';width: 12px;aspect-ratio: auto 1.33;background: url('../images/sub/ico_chk.svg') no-repeat center / 100% auto;transition: inherit;top: 50%;left: 50%;translate: -50% -50%; }
label [type="checkbox"]:checked{border-color: var(--point-color05);background: var(--point-color05);}
label [type="checkbox"]:checked:before{filter: var(--filter-white);}

textarea[readonly]{border-radius: var(--radius-05);width: 100%;height: 150px;font-size: var(--title-17);resize: none;box-sizing: border-box;line-height: 1.6;color: var(--black-color08);letter-spacing: -0.03em;overflow: hidden;overflow-y: auto;background: var(--gray-bg03);border:0;padding-block: 31px; padding-inline: 32px; }
textarea[readonly]::-webkit-scrollbar {width: auto; }
textarea[readonly]::-webkit-scrollbar-track {border-left: 4px solid var(--border-color01); margin:10px; cursor: pointer; border-radius: 2px; }
textarea[readonly]::-webkit-scrollbar-thumb {border-left: 4px solid var(--point-color06); cursor: pointer; border-radius: 2px;}

#wrap .bbs_write { position: relative; display: block; width: 100%; box-sizing: border-box; border-top: 1px solid var(--black-color01); padding-top: 40px; }
#wrap .bbs_write tbody { display: flex; gap: clamp(15px, 1.1vw, 20px) clamp(30px, 3.2vw, 60px); flex-wrap: wrap; }
#wrap .bbs_write tr { width: calc(100% / 2 - clamp(30px, 3.2vw, 60px) / 2); display: flex; align-items: center; gap: 15px 0; font-size: var(--title-20); border: 1px solid var(--border-color01); box-sizing: border-box; border-radius: var(--radius-10); background: var(--point-white); overflow: clip; padding-block: 19px; padding-inline: 29px 40px; }
#wrap .bbs_write :where(th, td) { position: relative; display: block; width: 100%; box-sizing: border-box; border: 0; padding: 0; background: none; }
#wrap .bbs_write th { width: clamp(140px, 10vw, 160px); flex-shrink: 0; padding-right: 15px; font-size: 100%; font-weight: 500; color: var(--black-color01); letter-spacing: -0.03em; }
#wrap .bbs_write th em{font-weight: inherit;color: var(--point-color05);}
#wrap .bbs_write td { width: 100%; font-size: 95%; font-weight: 400; color: var(--black-color03); letter-spacing: -0.03em; line-height: inherit; }
#wrap .bbs_write label { font-size: inherit; font-weight: inherit; color: inherit; }
#wrap .bbs_write tr:has(#title, #contents, #captcha) { width: 100%; }
#wrap .bbs_write tr:has(#contents){flex-wrap: wrap;padding-top: 26px;}
#wrap .bbs_write tr:has(#contents) th{width: 100%; flex-shrink: unset; padding-right: 0;}
#wrap .bbs_write :where([type="text"], [type="password"], textarea, select) { width: 100%; height: auto; min-width: auto; border: 0; line-height: normal; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0; font-size: inherit; font-weight: inherit; color: inherit; vertical-align: middle; letter-spacing: inherit; margin: 0; }
#wrap .bbs_write textarea { height: 128px; resize: none; }

#wrap .bbs_write :where([type="text"], [type="password"], textarea)::placeholder { color: var(--black-color09); }
#wrap .bbs_write select { appearance: none; width: 100%; background: var(--point-white) url('../images/sub/ico_sel_arw.svg') no-repeat 100% / 14px auto; padding-right: 45px; }
#wrap .bbs_write select:has(option:checked[value=""]) { opacity: 0.5; }
#wrap .bbs_write option { color: var(--black-color03); }

#wrap .bbs_write tr:has(.cap_wrap) { padding-block: 14px; }
#wrap .cap_wrap{display: flex;align-items: center;gap: 30px;  }
#wrap .cap_wrap .controller{display: flex;flex-shrink: 0;gap: 10px;width: 230px;}
#wrap #captcha_box{width: 100%;aspect-ratio: auto 4.73;border: 1px solid var(--black-color00);border-radius: var(--radius-05);overflow: hidden;box-sizing: border-box;margin: 0;}
#wrap #captcha_box img{width: calc(100% + 2px) !important;height: calc(100% + 2px) !important;max-width: none;max-height: none;margin: -1px 0 0 -1px;}
#wrap #refreshCode{font-size: 0;width: 40px;aspect-ratio: auto 1;background:var(--black-color06) url('../images/sub/ico_reset.png') no-repeat center; background-size: 14px auto; border-radius: var(--radius-05);flex-shrink: 0;}
#wrap .policy_wrap{margin-top: 20px;padding: 29px;border: 1px solid var(--border-color01);border-radius: var(--radius-10);box-sizing: border-box;display: grid;gap: 18px;}


.location_wrap { margin-top: 138px; }
.location_wrap .office_wrap { box-sizing: border-box; }
.location_wrap .map_info { display: flex; flex-wrap: wrap; gap: 20px 51px; margin-bottom: 37px; }
.location_wrap .map_info li { display: flex; align-items: baseline; gap: 8px; font-size: var(--title-20); }
.location_wrap .map_info li:nth-child(n+2) { font-family: var(--font-type04); }
.location_wrap .map_info li:nth-child(n+2) span { letter-spacing: -0.02em; }
.location_wrap .map_info li .ico { flex-shrink: 0; width: 20px; aspect-ratio: auto 1; translate: 0 -1px; }
.location_wrap .map_info li span { color: var(--black-color03); font-weight: 400; font-size: 100%; letter-spacing: -0.03em; }
.location_wrap .map_wrap { width: 100%; height: 480px; border-radius: var(--radius-20); overflow: clip; }

.location_wrap .office_wrap + .office_wrap { margin-top: 100px; padding-top: 98px; }
.location_wrap .seoul_office { border-top: 1px solid var(--border-color01); }

@media (max-width: 1023px) {
    #wrap .bbs_write { padding-top: clamp(25px, 4vw, 40px); }
    #wrap .bbs_write tr { width: 100%; padding-inline: clamp(20px, 3vw, 29px) clamp(25px, 4vw, 40px); row-gap: clamp(12px, 1.8vw, 18px) }
    #wrap .bbs_write tr:has(#contents) { padding-top: clamp(19px, 3vw, 26px); }
    #wrap .bbs_write textarea { height: clamp(100px, 12.8vw, 128px); }
    #wrap .bbs_write select { padding-right: clamp(30px, 4.5vw, 45px); background-size: clamp(7px, 1.4vw, 14px); }
    #wrap .cap_wrap { gap: clamp(15px, 3vw, 30px); }
    #wrap .cap_wrap .controller { width: clamp(200px, 25vw, 230px); }
    #wrap #refreshCode { width: clamp(36px, 4.5vw, 40px); background-size: clamp(12px, 1.9vw, 14px) auto; }
    #wrap .policy_wrap { padding: clamp(20px, 3vw, 30px); margin-top: clamp(15px, 2vw, 20px); gap: clamp(15px, 1.8vw, 18px); }
    

    label:has([type="checkbox"]) { line-height: clamp(22px, 2.9vw, 24px); }
    label [type="checkbox"] { width: clamp(22px, 2.9vw, 24px); height: clamp(22px, 2.9vw, 24px); }
    label [type="checkbox"]:before { width: clamp(10px, 1.7vw, 12px); }
    textarea[readonly] { padding-block: clamp(20px, 3vw, 31px); padding-inline: clamp(20px, 3vw, 32px); height: clamp(140px, 15vw, 150px); }

    .location_wrap { margin-top: clamp(70px, 14vw, 138px); }
    .location_wrap .map_info { margin-bottom: clamp(20px, 4vw, 37px); gap: clamp(15px, 2vw, 20px) clamp(25px, 5vw, 51px); }
    .location_wrap .map_wrap { height: clamp(320px, 48vw, 480px); }
    .location_wrap .office_wrap + .office_wrap { margin-top: clamp(50px, 10vw, 100px); padding-top: clamp(50px, 10vw, 98px); }


    textarea[readonly]::-webkit-scrollbar-track {border-width: clamp(2px, 0.2vw, 4px); }
    textarea[readonly]::-webkit-scrollbar-thumb {border-width: clamp(2px, 0.2vw, 4px); }
    
}

@media (max-width: 860px) {
    #wrap .cap_wrap { flex-wrap: wrap; }
}

@media (max-width: 479px) {
    #wrap .bbs_write tr { flex-wrap: wrap; }
}