#wrap {overflow-x: clip;} .blind{position: absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;} .w_custom{position: relative; width: calc(100% - 60px); max-width: 1500px; margin-inline: auto;} .main_index .w_custom{max-width:1600px} .bullet-list{display: flex;flex-direction: column;gap: clamp(7px, 1vw, 10px);} .bullet-list > li{position: relative;display: flex;align-items: baseline;gap: var(--row-gap10);font-size: var(--text-16);font-weight:300;} .bullet-list > li::before{display: inline-flex;content:'';width: clamp(3px, 0.5vw, 4px);aspect-ratio: auto 1;flex-shrink: 0;background: var(--black-color03);translate: 0 -3px;border-radius:100%;} .bullet-list .desc{display: flex;align-items: baseline;gap: 10px;} .bullet-list .desc dt{font-weight: 500;flex-shrink: 0;} .bullet-list.type02 > li{font-size: var(--text-18);line-height: 1.4;color: var(--black-color05);gap: clamp(8px, 1.4vw, 14px);} .bullet-list.type02 > li::before{background: var(--black-color05);border-radius: 100%;translate: 0 clamp(-5px, -0.7vw, -4px);} .bullet-list.type03 > li{font-size: var(--text-20);line-height: 1.4;color: var(--black-color05);gap: clamp(8px, 1.4vw, 14px);} .bullet-list.type03 > li::before{background: var(--black-color05);border-radius: 100%;translate: 0 clamp(-5px, -0.7vw, -4px);} /*check_list — 체크 아이콘 리스트 (공통)*/ .check_list{display: flex;flex-direction:column;gap:var(--row-gap10);width:100%;} .check_list li{display: flex;align-items: center;gap:14px;padding:var(--row-gap20);border-radius:10px;font-size:var(--text-20);color:var(--black-color03);font-weight:400;} .check_list li strong{font-weight:600;} .check_list li .ico{position: relative;flex-shrink:0;width:30px;height:30px;border-radius:5px;background:var(--point-white);} .check_list li .ico:after{content:"";position: absolute;left:10px;top:6px;width:7px;height:13px;border:solid;border-width:0 2.5px 2.5px 0;transform:rotate(45deg);} .check_list.blue li{background:var(--point-color18);} .check_list.blue li .ico:after{border-color:var(--point-color16);} .check_list.green li{background:rgba(0, 168, 107, 0.08);} .check_list.green li .ico:after{border-color:var(--point-color12);} .check_list.orange li .ico:after{border-color:var(--point-color19);} .check_list.flat li{padding:0;background:none;} /*pf-faq — 공용 FAQ 아코디언 (상품/페이지/SEO 공통, front/_faq.php)*/ .pf-faq-wrap{width:calc(100% - 60px);max-width:1500px;margin-inline:auto;} .pf-faq-title{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap20);text-align:center;margin-bottom:var(--row-gap50);} .pf-faq-title-sub{font-size:var(--text-20);color:var(--point-color03);font-weight:500;} .pf-faq-title-main{font-size:var(--text-56);color:var(--point-color04);font-weight:700;} .pf-faq-list{display: flex;flex-direction:column;width:100%;border-radius:var(--radius-20);background:var(--point-white);border:1px solid var(--border-color01);overflow:hidden;padding-block:var(--row-gap10);} .pf-faq-item{border-bottom:1px solid var(--border-color03);} .pf-faq-item:last-child{border-bottom:0;} .pf-faq-toggle{display: flex;align-items: center;justify-content: space-between;gap:var(--row-gap20);width:100%;padding:var(--row-gap30) var(--row-gap40);background:none;border:none;text-align:left;} .pf-faq-q{display: flex;align-items:center;gap:var(--row-gap20);min-width:0;} .pf-faq-badge{display: flex;align-items: center;justify-content: center;flex-shrink:0;width:clamp(34px, 4vw, 46px);height:clamp(34px, 4vw, 46px);border-radius:100%;font-size:var(--text-20);font-weight:700;} .pf-faq-badge--q{background:var(--point-color03);color:var(--point-white);} .pf-faq-badge--a{background:var(--point-white);color:var(--point-color03);} .pf-faq-question{font-size:var(--text-24);color:var(--point-color04);font-weight:600;line-height:1.4;} .pf-faq-prefix{margin-right:6px;color:var(--point-color03);} .pf-faq-arrow{flex-shrink:0;width:clamp(20px, 2.5vw, 27px);height:clamp(20px, 2.5vw, 27px);color:var(--black-color08);transition:transform 0.3s ease;} .pf-faq-item.is-open .pf-faq-arrow{transform:rotate(180deg);color:var(--black-color01);} .pf-faq-answer{display: none;padding:0 clamp(20px, 3vw, 36px) clamp(20px, 2.5vw, 28px);} .pf-faq-a{display: flex;align-items: flex-start;gap:var(--row-gap15);padding:var(--row-gap30);border-radius:var(--radius-20);background:var(--gray-bg05);} .pf-faq-a .pf-faq-badge{margin-top:2px;} .pf-faq-answer-text{font-size:var(--text-20);color:var(--black-color03);font-weight:400;line-height:1.6;padding-top:clamp(5px, 0.7vw, 9px);} .link{position: absolute; inset: 0; z-index: 3;} #wrap [class*="swiper-butto"]::after{display: none;} .ft_en{font-family: var(--font-type02);} /* main{padding-block:var(--row-gap100) var(--row-gap140);} */ #wrap:has(.pbDn) #container{padding-bottom: 0;} #wrap:has(.ptDn) #container{padding-top: 0;} #wrap:has(.fullSec) #container{width: 100%; max-width: 100%;} #wrap .dn{display: none;} .ofc{overflow:hidden;} .ofc img{width:100% !important;height:100% !important;object-fit:cover !important;} .dragscroll{ scrollbar-gutter: stable;} .dragscroll::-webkit-scrollbar {width: clamp(3px, 0.6vw, 4px);height:3px;} .dragscroll::-webkit-scrollbar-track {background: #eee; border-radius: 10px;} .dragscroll::-webkit-scrollbar-thumb {background: #aaa; border-radius: 10px;} #container{padding-block:var(--row-gap100);} .main_index #container{padding:0;} @media (max-width:1500px) { br.for_pc{display: none;} } @media (max-width:860px) { .w_custom{width: calc(100% - 30px);} } @media (max-width:320px) { .w_custom{width: calc(100% - 20px);} } /* ======================================== 빠른 상담문의 (Quick Inquiry) ======================================== */ #dbQuickInquiry{display: none;} /* ── 공통 ── */ .db-qi-header { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1rem; } .db-qi-title { font-size: 1rem; font-weight: 700; color: var(--qi-text, #fff); } .db-qi-close { background: none; border: none; color: var(--qi-text, #fff); font-size: 1.5rem; cursor: pointer; opacity: 0.7; line-height: 1; } .db-qi-close:hover { opacity: 1; } .db-qi-input { display: block; width: 100%; padding: 0.5rem 0.75rem; border: 1px solid rgba(255,255,255,0.3); border-radius: 0.375rem; background: rgba(255,255,255,0.15); color: var(--qi-text, #fff); font-size: 0.875rem; outline: none; transition: border-color 0.2s; } .db-qi-input::placeholder { color: rgba(255,255,255,0.6); } .db-qi-input:focus { border-color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.25); } .db-qi-privacy { display: flex; align-items: center; gap: 0.375rem; font-size: 0.75rem; color: var(--qi-text, #fff); opacity: 0.85; cursor: pointer; flex-shrink: 0; } .db-qi-privacy input[type="checkbox"] { width: 14px; height: 14px; flex-shrink: 0; } .db-qi-privacy-link { color: var(--qi-text, #fff); text-decoration: underline; opacity: 0.8; margin-left: 0.25rem; } .db-qi-privacy-link:hover { opacity: 1; } .db-qi-btn { padding: 0.5rem 1.5rem; background: rgba(255,255,255,0.95); color: var(--qi-bg, #1e40af); border: none; border-radius: 0.375rem; font-weight: 700; font-size: 0.875rem; cursor: pointer; transition: background 0.2s; white-space: nowrap; flex-shrink: 0; } .db-qi-btn:hover { background: #fff; } .db-qi-msg { text-align: center; font-size: 0.8rem; padding: 0.5rem; color: var(--qi-text, #fff); } .db-qi-form { display: flex; flex-direction: column; gap: 0.5rem; padding: 0 1rem 1rem; } /* ── 하단 고정 바 ── */ .db-qi-bottom { position: fixed; bottom: 0; left: 0; right: 0; z-index: 9980; } .db-qi-bottom-tab { display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; padding: 0.75rem; background: var(--qi-bg, #1e40af); color: var(--qi-text, #fff); border: none; cursor: pointer; font-size: 0.9rem; font-weight: 600; } .db-qi-bottom-tab:hover { filter: brightness(1.1); } .db-qi-bottom-panel { background: var(--qi-bg, #1e40af); border-top: 1px solid rgba(255,255,255,0.1); } .db-qi-bottom-inner { max-width: 1200px; margin: 0 auto; } .db-qi-form-row { flex-direction: row !important; flex-wrap: wrap; align-items: center; gap: 0.5rem; } .db-qi-form-row .db-qi-input { width: auto; flex: 1 1 150px; min-width: 120px; } /* 캡차 영역 */ .db-qi-captcha { flex: 0 0 auto; display: flex; align-items: center; } .db-qi-captcha img { height: 40px !important; border-radius: 6px; } .db-qi-captcha input[name="captcha_answer"] { height: 40px; padding: 0 10px; border: 1px solid #d1d5db; border-radius: 6px; width: 110px; font-size: 13px; color: #111; background: #fff; } @media (max-width: 768px) { .db-qi-captcha { width: 100%; justify-content: flex-start; } } /* ── 우측 패널 ── */ .db-qi-right { position: fixed; right: 0; top: 50%; transform: translateY(-50%); z-index: 9980; display: flex; align-items: flex-start; } .db-qi-right-tab { writing-mode: vertical-rl; text-orientation: mixed; padding: 1rem 0.5rem; background: var(--qi-bg, #1e40af); color: var(--qi-text, #fff); border: none; border-radius: 0.5rem 0 0 0.5rem; cursor: pointer; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.05em; } .db-qi-right-tab:hover { filter: brightness(1.1); } .db-qi-right-panel { display: none; width: 280px; background: var(--qi-bg, #1e40af); border-radius: 0.5rem 0 0 0.5rem; box-shadow: -4px 0 20px rgba(0,0,0,0.15); } /* ── 반응형 ── */ @media (max-width: 768px) { .db-qi-form-row { flex-direction: column !important; } .db-qi-form-row .db-qi-input { width: 100%; flex: none; } .db-qi-right { right: 0; top: auto; bottom: 0; transform: none; left: 0; flex-direction: column; } .db-qi-right-tab { writing-mode: horizontal-tb; text-orientation: initial; border-radius: 0; width: 100%; text-align: center; } .db-qi-right-panel { width: 100%; border-radius: 0; } } /* body::-webkit-scrollbar{display: none;} */ /*──────────────────────────────────────────────────────────── header ────────────────────────────────────────────────────────────*/ #header{position:fixed;top:0;width: 100%;height: clamp(65px, 11vw, 112px);z-index: 100;transition: all 0.4s;} body:has(.hdAb) #header{position: absolute;} #header .w_custom{display: flex;align-items: center;justify-content: space-between;height: 100%;gap: 15px;max-width:1760px;} #header .logo{height: 100%;max-width: clamp(120px, 15vw, 184px);position:relative;z-index:3;} #header .logo a{display: flex; align-items: center; height: 100%;} #header .logo img{height:auto;} #header .gnb{position: absolute; top:0; left:50%; translate: -50%; width: calc(100% - 300px); height: 100%; display: flex; justify-content: center; text-align: center;} #header .gnb > li{position: relative;height: 100%;font-size: var(--text-19);font-weight: 600;color: var(--black-color00); transition: all 0.4s;} #header .gnb > li > a{display: flex;align-items: center;justify-content: center;height: 100%;padding-inline: clamp(20px, 2vw, 40px);letter-spacing:0;} #header .gnb > li > a span{display: inline-block;width:96px;} #header .gnb > li.active > a{color:var(--point-color01);} #header .gnb .dep02{position: absolute;top: 80%;left: 50%;width: max-content;max-width: 300px;min-width: 180px;translate: -50%;background: var(--point-color01);padding-block: 18px;opacity: 0;pointer-events: none;transition: inherit;border-radius:var(--radius-10);} #header .gnb .dep02 > li{font-size: 90%;filter: var(--filter-white); transition: inherit;} #header .gnb .dep02 > li > a{display: block;padding: 10px 25px;} .utility{display: flex; align-items: center; gap:var(--row-gap40);position: relative;z-index:3;} .utility .hd_btn{display: flex;align-items: center;gap:var(--row-gap10);} .utility .hd_btn a{display: inline-flex;align-items: center;justify-content: center;height:clamp(40px, 5vw, 50px);gap:clamp(10px, 1.5vw, 20px);font-size:var(--text-18);color:var(--point-white);font-weight:500;padding-inline:clamp(14px, 2vw, 28px);border:1px solid rgba(255,255,255,0.2);border-radius:6px;background:rgba(255,255,255,0.1);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);transition:all 0.3s;} .utility .hd_btn a:after{width:clamp(8px, 1vw, 10px);aspect-ratio:auto 1;content:"";background:url('/images/main_more_on.svg')no-repeat center / auto 100%;filter:var(--filter-white)} .allCate{display: flex;flex-direction: column;justify-content: space-between;width: clamp(30px, 5vw, 60px);aspect-ratio: auto 3.33;position: relative;} .allCate span{display: inline-block;width:100%;height:clamp(2px, 0.2vw, 4px);content:"";background:var(--black-color00);transition:width 0.3s;} .allCate span:nth-child(1){width:50%;} .allCate span:nth-child(1){align-self: flex-end;} #header :where(.logo, .gnb > li > a, .allCate){filter:var(--filter-white);} /*on*/ #header.on{box-shadow: inset 0 -1px 0 var(--border-color01);background: var(--point-white);} #header.on :where(.logo, .gnb > li > a, .hd_lang, .allCate){filter:none;} #header.on .utility .hd_btn a{background:var(--point-white);color:var(--point-color01);border-color:var(--point-color04);font-weight:600;} #header.on .utility .hd_btn a:after{filter:none;} /* over */ @media (hover:hover) and (pointer:fine) { #header:hover{box-shadow: inset 0 -1px 0 var(--border-color01);background: var(--point-white);} #header:hover :where(.logo, .gnb > li > a, .allCate){filter:none;} #header .gnb > li:hover > a{color:var(--point-color01);} #header .gnb .dep02 > li:hover > a{color:var(--black-color03);text-decoration: underline;} #header .gnb > li:hover .dep02{opacity: 1; pointer-events: auto;} #header .gnb .dep02:has(> li:hover) > li:not(:hover){opacity: 0.4;} #header:hover .utility .hd_btn a{background:var(--point-white);color:var(--point-color04);border-color:var(--point-color04);font-weight:600;} #header:hover .utility .hd_btn a:after{filter:none;} .allCate:hover span{width:100%;} } @media (max-width:1250px) { #header .gnb{display: none;} #header .logo{padding-block:5px;} } @media (max-width:479px) { #header .utility .hd_btn{display: none;} } /*─────────────────────────────────────────────────────────── Aside ───────────────────────────────────────────────────────────*/ #aside{position: fixed;top: 0;left:0;width: 100%;height: 100%;z-index: 999;background: rgba(255,255,255,0.8);backdrop-filter:blur(10px);display: flex;flex-direction: column;overflow: hidden;overflow-y: auto;padding-block: 10vh;box-sizing: border-box;opacity: 0;transition: all 0.6s;clip-path: inset(0 0 100% 0);} #aside.on{opacity: 1;clip-path: inset(0);} body:has(#aside.on){overflow: clip; touch-action: none;} #aside .utility .hd_btn a{background:var(--point-white);border-color:var(--point-color04);color:var(--point-color04);} #aside .utility .hd_btn a:after{filter:none;} #aside .w_custom{flex-shrink: 0;max-width: 1800px;min-height: 100%;display: flex;align-items: center;} #aside .gnb{width: 100%;display: grid;align-items: start;justify-content: center;grid: auto / repeat(5, 1fr);gap: clamp(15px, 2.2vw, 40px);} #aside .gnb > li{color: var(--black-color03);font-size: var(--text-20);text-align: center;} @media (min-width:861px) { #aside .gnb > li{opacity:0;translate:0 100px;transition:all 0.8s 0.3s;} #aside.on .gnb > li{opacity:1;translate:0;} #aside.on .gnb > li:nth-child(2){transition-delay:0.4s;} #aside.on .gnb > li:nth-child(3){transition-delay:0.5s;} #aside.on .gnb > li:nth-child(4){transition-delay:0.6s;} #aside.on .gnb > li:nth-child(5){transition-delay:0.7s;} #aside.on .gnb > li:nth-child(6){transition-delay:0.8s;} } #aside .gnb > li > a{position: relative;display: block;font-size: var(--text-30);font-weight: 700;line-height: 1.4;padding-block: 30px;transition: all 0.4s;letter-spacing: 0;} #aside .gnb > li > a:before{position: absolute;content: '';top: 0;left: 50%;translate: -50%;width:12px;height: 0;opacity:0;background: var(--point-color01);transition:all 0.3s;} #aside .gnb .dep02{position: relative;} #aside .gnb .dep02 > li > a{display: block;font-weight: 400;padding-block: clamp(7px, 1.7vw, 13px);color: var(--black-color03);line-height: 1.6;transition: all 0.4s;} #aside .gnb .dep03 > li > a{display: block;font-size:var(--text-16);font-weight: 400;padding-block: clamp(3px, 0.5vw, 5px);color: var(--black-color03);line-height: 1.6;transition: all 0.4s;} #aside .utility{position: absolute;top: clamp(30px, 2.8vw, 50px);right: clamp(30px, 2.8vw, 50px);display: flex;align-items: center;gap: clamp(20px, 1.6vw, 30px);z-index:2;} #aside .close_btn{position: relative;width: clamp(30px, 4vw, 40px);height: clamp(30px, 4vw, 40px);z-index: 9;} #aside .close_btn span{position: absolute;top:50%;left:50%;transform: translate(-50%, -50%) rotate(45deg);width: 100%;height: 2px;background: var(--point-color04);} #aside .close_btn span + span{transform: translate(-50%, -50%) rotate(-45deg);} /* over */ @media (hover:hover) and (pointer:fine){ #aside .gnb > li:hover > a{color: var(--point-color01);} #aside .gnb > li:hover > a:before{height:12px;opacity:1;} #aside .gnb .dep02 > li:hover a{color: var(--point-color02);font-weight:600;} } @media (max-width:1023px){ #aside{padding-block: clamp(80px, 12vw, 120px);} } @media (max-width:860px){ #aside{display: block;} #aside .w_custom{align-items:flex-start;} #aside .gnb{grid-template: auto / repeat(1, 1fr);gap:0;} #aside .gnb > li{padding-block: clamp(20px, 3vw, 25px);text-align:left;border-bottom: 1px solid rgba(0,0,0,0.15);} #aside .gnb > li > a{padding-block: 0;} #aside .gnb > li > a:before{display: none;} #aside .gnb .dep02{display: grid;gap: 0 20px;grid-template: auto / repeat(2, 1fr);margin-top: clamp(10px, 1.8vw, 15px);justify-content: flex-start;} #aside .gnb .dep03{display: flex;flex-wrap:wrap;gap:5px 10px;} #aside .utility{top:15px; right: 15px;} } @media (max-width:479px){ #aside .gnb .dep02{grid-template: auto / repeat(1, 1fr);} } /*─────────────────────────────────────────────────────────── Main ───────────────────────────────────────────────────────────*/ /*visual*/ .visual_wrapper{position: relative;} .visualSwiper .swiper-slide{position:relative; box-sizing:border-box;height:clamp(550px, 96vw, 960px);overflow:hidden; opacity:0 !important; pointer-events:none;overflow:hidden;} .visualSwiper .swiper-slide.swiper-slide-active{opacity:1 !important; pointer-events:inherit;} .visualSwiper .swiper-slide .img{width:100%;height:100%;position: relative;overflow:hidden;} .visualSwiper .swiper-slide .img img{transition:all 6s;} .visualSwiper .swiper-slide-active .img img{scale:1.1;} /*txt*/ .visualSwiper .swiper-slide .visual_txt{position: absolute;top:44%;left:50%;translate:-50% -50%;display: flex;flex-direction:column;gap:var(--row-gap30);z-index:2;} .visualSwiper .visual_txt .tit{display: flex;flex-direction:column;gap:var(--row-gap40);} .visualSwiper .visual_txt .logo{display: flex;align-items: center;gap:var(--row-gap25);} .visualSwiper .visual_txt .logo img{height:clamp(28px, 3.3vw, 64px);width:auto;} .visualSwiper .visual_txt .logo img.wh{filter:var(--filter-white);} .visualSwiper .visual_txt .logo img:last-child{height:clamp(18px, 2.1vw, 40px);} .visualSwiper .visual_txt .logo span{font-size:var(--text-24);color:var(--point-white);font-weight:500;} .visualSwiper .visual_txt h2{font-size:var(--text-80);color:var(--point-white);font-weight:700;line-height:1.3;letter-spacing:-0.03em;} .visualSwiper .visual_txt p{font-size:var(--text-22);color:var(--point-white);font-weight:300;line-height:1.7;font-family:var(--font-type02);} .visualSwiper .txtAni{opacity:0;translate:0 100px;pointer-events:none;transition:all 0.8s;} .visualSwiper .swiper-slide-active .txtAni{opacity:1;translate:0;pointer-events:initial;} .visualSwiper .swiper-slide-active .txtAni:nth-child(2){transition-delay:0.3s;} /*controller*/ .visual_wrapper .controller{position: absolute;bottom:29%;left:50%;translate:-50%;display: flex;align-items: center;justify-content: flex-start;z-index:3;} .visual_wrapper .controller .visual-pagination{display: flex;align-items: center;gap:var(--row-gap60);width:auto;} .visual_wrapper .controller .swiper-pagination-bullet{width:10px;height:10px;border-radius:100%;background:var(--point-white);opacity:0.5;margin:0;cursor:pointer;position:relative;transition:opacity 0.3s;} .visual_wrapper .controller .swiper-pagination-bullet:before{position:absolute;inset:-10px;content:"";border-radius:100%;background:rgba(255,255,255,0.2);opacity:0;transition:opacity 0.3s;} .visual_wrapper .controller .swiper-pagination-bullet-active{opacity:1;} .visual_wrapper .controller .swiper-pagination-bullet-active:before{opacity:1;} .visual_wrapper .controller .arw_box{display: flex;align-items: center;gap:var(--row-gap30);margin-left:var(--row-gap40);flex-shrink:0;} .visual_wrapper .controller .swipe_arw{width:clamp(8px, 1vw, 11px);height:clamp(16px, 2vw, 20px);position: relative;display: flex;align-items: center;justify-content: center;cursor:pointer;} .visual_wrapper .controller .swipe_arw:before{width:100%;aspect-ratio:auto 1;content:"";border:2px solid var(--point-white);border-width:2px 2px 0 0;rotate:-135deg;translate:3px;} .visual_wrapper .controller .swipe_arw.next{scale:-1 -1;} .visual_wrapper .controller .swipe_btn{width:clamp(8px, 0.8vw, 10px);height:clamp(11px, 1.2vw, 14px);position: relative;cursor:pointer;} .visual_wrapper .controller .swipe_btn:before, .visual_wrapper .controller .swipe_btn:after{position:absolute;top:0;content:"";width:2px;height:100%;background:var(--point-white);} .visual_wrapper .controller .swipe_btn:before{left:0;} .visual_wrapper .controller .swipe_btn:after{right:0;} .visual_wrapper .controller .swipe_btn.stop{border-style:solid;border-width:7px 0 7px 10px;border-color:transparent transparent transparent var(--point-white);} .visual_wrapper .controller .swipe_btn.stop:before, .visual_wrapper .controller .swipe_btn.stop:after{content:none;} /*about*/ .main_content .about_wrapper{position: relative;height:100vh;min-height:600px;display: flex;align-items: center;justify-content: center;overflow:hidden;background:var(--point-white);padding:0;} .about_wrapper .about_bg{position: absolute;inset:0;margin:auto;width:38%;height:55%;border-radius:20px;overflow:hidden;} .about_wrapper .about_bg .img{width:100%;height:100%;position: relative;overflow:hidden;} .about_wrapper .about_bg .img:before{position: absolute;inset:0;content:"";background:rgba(0,0,0,0.55);z-index:1;} .about_wrapper .about_txt{position: relative;z-index:2;display: flex;flex-direction:column;align-items: center;text-align:center;gap:var(--row-gap20);} .about_wrapper .label{font-size:var(--text-22);color:var(--point-color03);font-weight:500;transition:color 0.6s;} .about_wrapper .logo{width:clamp(70px, 6.25vw, 120px);aspect-ratio:120/138;overflow:hidden;position: relative;} .about_wrapper .logo img{position: absolute;max-width:none;transition:filter 0.6s;} .about_wrapper h3{font-size:var(--text-30);color:var(--point-color01);font-weight:600;transition:color 0.6s;} .about_wrapper .desc{font-size:var(--text-20);color:var(--black-color06);font-weight:400;line-height:1.7;max-width:640px;transition:color 0.6s;} .about_wrapper .view_more{display: inline-flex;align-items: center;justify-content:space-between;gap:10px;height:clamp(48px, 5vw, 58px);padding-inline:clamp(12px, 2vw, 24px);background:transparent;border-radius:100px;color:var(--point-white);font-size:var(--text-18);font-weight:500;margin-top:var(--row-gap20);min-width:clamp(120px, 20vw, 220px);border:2px solid var(--point-white);transition:all 0.3s;} .about_wrapper .view_more:after{width:13px;aspect-ratio:auto 1;content:"";background:url('/images/main_more.svg')no-repeat center / contain;filter:var(--filter-white);transition:all 0.3s;} /*grown (배경이 다 커진 상태 - ScrollTrigger가 부여)*/ .about_wrapper.grown h3, .about_wrapper.grown .desc{color:var(--point-white);} .about_wrapper.grown .logo img{filter:var(--filter-white);} /* over */ @media (hover:hover) and (pointer:fine){ .about_wrapper .view_more:hover{background:var(--point-white);color:var(--point-color04);} .about_wrapper .view_more:hover:after{filter:none;} } @media (max-width:1023px) { .main_content .about_wrapper{height:auto;padding-block:var(--row-gap140);} } /*growth*/ .growth_wrapper{background:var(--point-grad01);} .growth_wrapper .growth_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .growth_wrapper .growth_cards{display: flex;align-items: stretch;gap:var(--row-gap40);width:100%;} .growth_wrapper .card{flex:1 0 0;min-width:0;display: flex;flex-direction:column;gap:var(--row-gap30);padding:clamp(28px, 2.6vw, 50px) clamp(22px, 2.1vw, 40px);background:var(--point-color05);border:1px solid rgba(255,255,255,0.3);border-radius:20px;box-shadow:8.667px 3.467px 8.667px rgba(0,0,0,0.1);} .growth_wrapper .card_tit{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap10);text-align:center;padding-bottom:var(--row-gap30);border-bottom:1px solid rgba(255,255,255,0.2);} .growth_wrapper .badge{display: inline-flex;align-items: center;justify-content: center;padding:6px 16px;border-radius:50px;font-size:var(--text-20);color:var(--point-white);font-weight:500;margin-bottom:var(--row-gap10);} .growth_wrapper .badge01{background:var(--point-color03);} .growth_wrapper .badge02{background:var(--point-color07);} .growth_wrapper .badge03{background:var(--point-color08);} .growth_wrapper .card_tit strong{font-size:var(--text-36);color:var(--point-white);font-weight:500;line-height:1.4;} .growth_wrapper .card_tit strong em{font-weight:700;} .growth_wrapper .card_tit > p{font-size:var(--text-22);color:var(--point-white);font-weight:400;} .growth_wrapper .card_list{display: flex;flex-direction:column;gap:var(--row-gap10);} .growth_wrapper .card_list li{display: flex;align-items: center;gap:var(--row-gap10);} .growth_wrapper .card_list .step{flex-shrink:0;display: inline-flex;align-items: center;justify-content: center;padding:3px 10px;min-width:83px;border-radius:50px;background:var(--point-color09);font-size:var(--text-17);color:var(--point-white);font-weight:500;text-align:center;} .growth_wrapper .card:nth-child(3) .card_list .step{min-width:100px;} .growth_wrapper .card_list li > p{font-size:var(--text-18);color:var(--point-white);font-weight:300;line-height:1.5;} .growth_wrapper .tag_list{display: flex;flex-wrap:wrap;align-items: center;gap:var(--row-gap20);margin-top:auto;font-size:var(--text-18);color:var(--point-white);font-weight:400;} /* 카드 호버 효과 (제휴 서비스 카드와 동일. AOS 규칙보다 우선하도록 선택자 강화, 등장은 AOS 값 유지) */ .growth_wrapper .growth_cards .card[data-aos][data-aos]{transition-property:transform,opacity,translate,box-shadow,border-color;transition-duration:.7s,.7s,.15s,.15s,.15s;transition-timing-function:cubic-bezier(.55,.085,.68,.53),cubic-bezier(.55,.085,.68,.53),ease-out,ease-out,ease-out;} @media (hover:hover) and (pointer:fine){ .growth_wrapper .card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.35);border-color:rgba(255,255,255,0.6);} } @media (prefers-reduced-motion:reduce){ .growth_wrapper .card:hover{translate:none;} } @media (max-width:1023px) { .growth_wrapper .growth_cards{flex-direction:column;} } /*partner*/ .partner_wrapper{background:var(--point-white);} .partner_wrapper .partner_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .partner_wrapper .partner_cards{display: flex;align-items: stretch;gap:var(--row-gap25);width:100%;} .partner_wrapper .p_card{flex:1 0 0;min-width:0;display: flex;flex-direction:column;align-items: center;border-radius:var(--radius-10);overflow:hidden;box-shadow:4px 4px 25px rgba(0,0,0,0.1);} .partner_wrapper .p_card_tit{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap20);width:100%;padding:var(--row-gap30) var(--row-gap10);text-align:center;} .partner_wrapper .badge{display: inline-flex;align-items: center;justify-content: center;padding:6px 16px;border-radius:50px;background:var(--point-white);font-size:var(--text-18);font-weight:500;} .partner_wrapper .p_card_tit strong{font-size:var(--text-28);color:var(--point-white);font-weight:700;line-height:1.4;} .partner_wrapper .badge01{background:var(--point-color07);} .partner_wrapper .badge01 .badge{color:var(--point-color07);} .partner_wrapper .badge02{background:var(--point-color12);} .partner_wrapper .badge02 .badge{color:var(--point-color12);} .partner_wrapper .badge03{background:var(--point-color13);} .partner_wrapper .badge03 .badge{color:var(--point-color13);} .partner_wrapper .badge04{background:var(--point-color08);} .partner_wrapper .badge04 .badge{color:var(--point-color08);} .partner_wrapper .p_card_body{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap25);width:100%;padding:var(--row-gap30) var(--row-gap40) var(--row-gap40);} .partner_wrapper .p_card_body .ico{display: flex;align-items: center;justify-content: center;width:clamp(64px, 6vw, 98px);aspect-ratio:auto 1;border-radius:100%;background:var(--gray-bg01);font-size:var(--text-40);} .partner_wrapper .p_card_body p{font-size:var(--text-20);color:var(--black-color05);font-weight:400;line-height:1.6;text-align:center;} /* 카드 호버 효과 (AOS의 transform 과 충돌하지 않도록 translate 속성 사용) */ .partner_wrapper .p_card{position:relative;} /* AOS 의 [data-aos][data-aos][data-aos-duration] 규칙보다 우선하도록 선택자 강화. 등장(transform/opacity)은 AOS 값 유지, 호버(translate/box-shadow)만 빠르게 */ .partner_wrapper .partner_cards .p_card[data-aos][data-aos]{transition-property:transform,opacity,translate,box-shadow;transition-duration:.7s,.7s,.15s,.15s;transition-timing-function:cubic-bezier(.55,.085,.68,.53),cubic-bezier(.55,.085,.68,.53),ease-out,ease-out;} .partner_wrapper .p_card_tit{transition:filter .15s ease-out;} @media (hover:hover) and (pointer:fine){ .partner_wrapper .p_card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.18);} .partner_wrapper .p_card:hover .p_card_tit{filter:brightness(1.08);} } @media (prefers-reduced-motion:reduce){ .partner_wrapper .p_card:hover{translate:none;} } @media (max-width:1400px) { .partner_wrapper .p_card_tit strong{font-size:var(--text-20);} } @media (max-width:1023px) { .partner_wrapper .partner_cards{flex-wrap:wrap;gap:var(--row-gap30)} .partner_wrapper .p_card{flex:auto;width:calc(50% - var(--row-gap30) / 2);} .partner_wrapper .p_card_tit strong{font-size:var(--text-24);} } @media (max-width:640px) { .partner_wrapper .p_card{width:100%;} } /*insurer (파트너 보험사 로고)*/ .main_content .insurer_wrapper{position: relative;background:var(--gray-bg05);padding-bottom:0;overflow:hidden;} .insurer_wrapper .insurer_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .insurer_wrapper .insurer_logos{display: grid;grid-template-columns:repeat(8, 1fr);width:100%;list-style:none;margin:0;padding:0;} .insurer_wrapper .insurer_logos li{display: flex;align-items: center;justify-content: center;background:var(--gray-bg05);} .insurer_wrapper .insurer_logos li img{mix-blend-mode:darken;} .waveSwiper .swiper-wrapper{position: relative; transition-timing-function: linear;} .waveSwiper .swiper-wrapper .swiper-slide{font-size:clamp(50px, 10vw, 130px);color:var(--point-white);font-weight:700;text-transform: uppercase;line-height:1;width:auto;padding-right:var(--row-gap20);} @media (max-width:1023px) { .insurer_wrapper .insurer_logos{grid-template-columns:repeat(4, 1fr);} } @media (max-width:640px) { .insurer_wrapper .insurer_logos{grid-template-columns:repeat(3, 1fr);} } @media (max-width:479px) { .insurer_wrapper .insurer_logos{grid-template-columns:repeat(2, 1fr);} } /*sns*/ .sns_wrapper{background:var(--point-grad03);} .sns_wrapper .sns_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .sns_wrapper .sns_cards{display: flex;align-items: stretch;gap:var(--row-gap25);width:100%;} .sns_wrapper .sns_card{width:100%;display: flex;align-items: center;gap:var(--row-gap30);padding:var(--row-gap30);background:var(--point-color05);border:1px solid rgba(255,255,255,0.3);border-radius:var(--radius-10);box-shadow:8.667px 3.467px 8.667px rgba(0,0,0,0.1);transition:translate .15s ease-out, box-shadow .15s ease-out, border-color .15s ease-out;} .sns_wrapper .sns_card .ico{flex-shrink:0;width:clamp(44px, 4vw, 60px);aspect-ratio:auto 1;border-radius:100%;overflow:hidden;} .sns_wrapper .sns_card .ico img{width:100% !important;height:100% !important;object-fit:cover !important;} .sns_wrapper .sns_card .tit{display: flex;flex-direction:column;gap:4px;font-size:var(--text-26);color:var(--point-white);font-weight:600;} .sns_wrapper .sns_card .tit em{font-style:normal;font-size:var(--text-18);color:var(--point-white);opacity:0.5;font-weight:500;} /* 카드 호버 효과 (다른 카드와 동일) */ @media (hover:hover) and (pointer:fine){ .sns_wrapper .sns_card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.35);border-color:rgba(255,255,255,0.6);} } @media (prefers-reduced-motion:reduce){ .sns_wrapper .sns_card:hover{translate:none;} } @media (max-width:1023px) { .sns_wrapper .sns_cards{flex-wrap:wrap;} .sns_wrapper .sns_card{width:calc(50% - var(--row-gap25) / 2);} } @media (max-width:640px) { .sns_wrapper .sns_card{width:100%;} } /*board (메인 게시판 노출)*/ .board_wrapper{background:var(--point-white);} .board_wrapper .board_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .board_wrapper .main_title.dark .tit h3{color:var(--point-color04);} .board_wrapper .db-expose-more{display:none;} .db-expose-board{width:100%;display: flex;flex-direction:column;gap:var(--row-gap40);} .db-expose-empty{padding-block:var(--row-gap60);text-align:center;font-size:var(--text-18);color:var(--black-color07);} .db-expose-grid{display: grid;grid-template-columns:repeat(3, 1fr);gap:var(--row-gap60) var(--row-gap50);width:100%;list-style:none;margin:0;padding:0;} .db-expose-card{display: flex;flex-direction:column;gap:var(--row-gap25);height:100%;} .db-expose-thumb{display:block;aspect-ratio:auto 5/3;border-radius:var(--radius-10);overflow:hidden;background:var(--gray-bg05);position: relative;} .db-expose-thumb .ov_box{width:100%;height:100%;position: absolute;top:0;left:0;background:rgba(23, 40, 88, 0.6);pointer-events:none;display: flex;align-items: center;justify-content: center;opacity:0;transition:all 0.3s;z-index:3;} .db-expose-thumb .ov_box:before{width:30px;aspect-ratio:auto 1;content:"";display: inline-block;clip-path:var(--clip-poly03);background:var(--point-white);transition:all 0.3s;} .db-expose-thumb img{width:100% !important;height:100% !important;object-fit:cover !important;transition:transform 0.3s;} .db-expose-no-img{display: flex;align-items: center;justify-content: center;width:100%;height:100%;color:var(--black-color08);} .db-expose-no-img svg{width:clamp(28px, 3vw, 40px);aspect-ratio:auto 1;} .db-expose-info{display: flex;flex-direction:column;gap:var(--row-gap25);} .db-expose-title{font-size:var(--text-24);color:var(--black-color03);font-weight:700;line-height:1.4;transition:color 0.3s;} .db-expose-date{font-size:clamp(16px, 1.5vw, 18px);color:var(--black-color06);font-weight:400;} .db-expose-list{display: flex;flex-direction:column;list-style:none;margin:0;padding:0;border-top:1px solid rgba(0,0,0,0.08);} .db-expose-list-item{display: flex;align-items: center;justify-content: space-between;gap:var(--row-gap20);padding-block:var(--row-gap20);border-bottom:1px solid rgba(0,0,0,0.08);} .db-expose-list-title{min-width:0;flex:1 1 auto;font-size:var(--text-18);color:var(--black-color03);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color 0.3s;} .db-expose-list-item .db-expose-date{flex-shrink:0;} .db-expose-more{display: flex;justify-content:center;} @media (hover:hover) and (pointer:fine){ .db-expose-card:hover .db-expose-thumb img{transform:scale(1.05);} .db-expose-card:hover .ov_box{opacity:1;} .db-expose-card:hover .ov_box:before{rotate:90deg;} } @media (max-width:1023px) { .db-expose-grid{grid-template-columns:repeat(2, 1fr);} } @media (max-width:479px) { .db-expose-grid{grid-template-columns:repeat(1, 1fr);} } /*join (입사 지원 CTA)*/ .join_wrapper{position: relative;overflow:hidden;background:var(--point-color06);} .join_wrapper .join_bg{position: absolute;inset:0;z-index:0;} .join_wrapper .join_bg:after{width:100%;height:100%;background:rgba(9, 16, 36, 0.85);content:"";position: absolute;top:0;left:0;} .join_wrapper .join_inner{position: relative;z-index:2;display: flex;flex-direction:column;align-items: center;text-align:center;gap:var(--row-gap60);} .join_wrapper .join_badges{display: flex;align-items: center;justify-content: center;flex-wrap:wrap;gap:var(--row-gap30);list-style:none;margin:var(--row-gap40) 0 0;padding:0;width:100%;} .join_wrapper .join_badges li{display: flex;align-items: center;gap:var(--row-gap15);} .join_wrapper .join_badges .wreath{width:clamp(20px, 2vw, 38px);flex-shrink:0;} .join_wrapper .join_badges .wreath.r{transform:scaleX(-1);} .join_wrapper .join_badges .badge_cont{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap10);} .join_wrapper .join_badges .badge_cont .ico{width:clamp(28px, 2.6vw, 40px);} .join_wrapper .join_badges .badge_cont em{font-style:normal;font-size:clamp(16px, 1.6vw, 18px);color:var(--point-white);font-weight:600;white-space:nowrap;} .join_wrapper .highlight_tit{display: flex;align-items: center;justify-content: center;gap:var(--row-gap15);} .join_wrapper .highlight_tit p{font-size:var(--text-30);font-weight:600;line-height:1.7;background:var(--point-grad02);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;} .join_wrapper .highlight_tit .wreath.r{transform: scaleX(-1);} .join_wrapper .join_cards{display: grid;grid-template-columns:repeat(3, 1fr);gap:var(--row-gap30);width:100%;margin:var(--row-gap40) 0 0;} .join_wrapper .j_card{display: flex;flex-direction:column;gap:var(--row-gap20);padding:var(--row-gap30);border: 1px solid rgba(255, 255, 255, 0.30);background: rgba(26, 43, 76, 0.60);border-radius:var(--radius-20);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);text-align:left;} .join_wrapper .j_card .q{display: flex;align-items:center;gap:var(--row-gap20);padding-bottom:var(--row-gap20);border-bottom:1px solid rgba(255,255,255,0.15);min-height:82px;} .join_wrapper .j_card .q .ico{width:40px;flex-shrink:0;} .join_wrapper .j_card .q p{font-size:var(--text-22);color:var(--point-white);font-weight:700;line-height:1.4;} .join_wrapper .j_card .a{display: flex;flex-direction:column;gap:var(--row-gap10);} .join_wrapper .j_card .a strong{font-size:var(--text-22);color:var(--point-white);font-weight:700;line-height:1.4;} .join_wrapper .j_card .a p{font-size:var(--text-20);color:var(--point-white);font-weight:400;line-height:1.6;} /* 카드 호버 효과 (성장지원/제휴 서비스 카드와 동일) */ .join_wrapper .j_card{transition:translate .15s ease-out, box-shadow .15s ease-out, border-color .15s ease-out, background-color .15s ease-out;} @media (hover:hover) and (pointer:fine){ .join_wrapper .j_card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.35);border-color:rgba(255,255,255,0.6);background:rgba(26, 43, 76, 0.80);} } @media (prefers-reduced-motion:reduce){ .join_wrapper .j_card:hover{translate:none;} } .join_wrapper .join_cta{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap30);text-align:center;margin:var(--row-gap80) 0 0;} .join_wrapper .join_cta .sub{font-size:var(--text-20);color:var(--point-white);opacity:.75;font-weight:400;} .join_wrapper .join_cta .tit{font-size:var(--text-56);color:var(--point-white);font-weight:700;line-height:1.3;letter-spacing:-0.03em;} .join_wrapper .join_btns{display: grid;grid-template-columns:repeat(4, 1fr);gap:var(--row-gap20);width:100%;list-style:none;margin:var(--row-gap60) 0 0;padding:0;} .join_wrapper .join_btns a{position: relative;display: flex;align-items: center;gap:var(--row-gap20);height:clamp(64px, 6vw, 90px);padding-inline:var(--row-gap30);background:var(--point-white);border-radius:clamp(12px, 1.2vw, 16px);transition:all 0.3s;} .join_wrapper .join_btns img:not(.arw){width:clamp(32px, 3vw, 50px);flex-shrink:0;} .join_wrapper .join_btns span{font-size:var(--text-20);color:var(--black-color02);font-weight:600;transition:color 0.3s;} .join_wrapper .join_btns .arw{position: absolute;top:50%;right:var(--row-gap30);translate:0 -50%;width:12px;transition:all 0.3s;} .join_wrapper .join_btns a:hover{background:var(--point-color04);} .join_wrapper .join_btns a:hover span{color:var(--point-white);} .join_wrapper .join_btns a:hover .arw{filter:var(--filter-white);} @media (max-width:1200px) { .join_wrapper .join_cards{grid-template-columns:repeat(1, 1fr);} .join_wrapper .j_card .q{min-height:initial;} } @media (max-width:1023px) { .join_wrapper .join_btns{grid-template-columns:repeat(2, 1fr);} } @media (max-width:640px) { .join_wrapper .join_btns{grid-template-columns:repeat(1, 1fr);} } /*공통*/ .main_content > section, .sub_content > section{padding-block:var(--row-gap140)} /*섹션 타이틀 박스*/ .main_title{display: flex;flex-direction:column;align-items: center;text-align:center;gap:var(--row-gap20);} .main_title .tit{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap20);} .main_title .label{font-size:var(--text-20);color:var(--point-color03);font-weight:500;} .main_title .tit h3{font-size:var(--text-56);color:var(--point-white);font-weight:700;line-height:1.3;letter-spacing:-0.03em;} .main_title .tit h3 em{font-style:normal;background:var(--point-grad02);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;} .main_title .desc{font-size:var(--text-20);color:var(--point-white);font-weight:400;line-height:1.7;} /*밝은 배경 섹션용 - 어두운 텍스트*/ .main_title.dark .tit h3{color:var(--point-color11);} .main_title.navy .tit h3{color:var(--point-color04);} .main_title.dark .desc{color:var(--black-color03);} .main_title.navy .desc{color:var(--black-color05);} /*더보기 버튼*/ .main_more{display: inline-flex;align-items: center;gap:var(--row-gap20);height:clamp(50px, 6vw, 60px);padding-inline:clamp(20px, 3vw, 30px);border:2px solid rgba(255,255,255,0.6);border-radius:100px;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);color:var(--point-white);font-size:var(--text-20);font-weight:600;transition:all 0.3s;} .main_more:after{width:13px;aspect-ratio:auto 1;content:"";background:url('/images/main_more.svg')no-repeat center / contain;filter:var(--filter-white);transition:all 0.3s;} /*밝은 배경 섹션용 - 어두운 아웃라인*/ .main_more.dark{border-color:var(--point-color02);backdrop-filter:none;-webkit-backdrop-filter:none;color:var(--point-color02);} .main_more.dark:after{filter:none;} /*CTA 배너용 - 골드 채움*/ .main_more.gold{border:none;background:var(--point-color03);backdrop-filter:none;-webkit-backdrop-filter:none;color:var(--point-white);} /* over */ @media (hover:hover) and (pointer:fine){ .main_more:hover{background:var(--point-white);color:var(--point-color04);} .main_more:hover:after{filter:none;} .main_more.dark:hover{background:var(--point-color04);color:var(--point-white);} .main_more.dark:hover:after{filter:var(--filter-white);} .main_more.gold:hover{background:var(--point-color02);color:var(--point-white);} .main_more.gold:hover:after{filter:var(--filter-white);} } /*─────────────────────────────────────────────────────────── Footer ───────────────────────────────────────────────────────────*/ #footer{background:var(--black-color00);} #footer .ft_top{display: flex;align-items: center;justify-content: space-between;flex-wrap:wrap;gap:var(--row-gap20) var(--row-gap30);padding-block:var(--row-gap40) var(--row-gap30);border-bottom:1px solid rgba(255,255,255,0.15);} #footer .ft_top a{width:clamp(120px, 12vw, 150px);flex-shrink:0;} #footer .ft_top a img{height:auto;filter:var(--filter-white);} #footer .ft_body{display: flex;flex-direction:column;gap:var(--row-gap20);padding-block:var(--row-gap30);} #footer .ft_addr{display: flex;flex-direction:column;gap:6px;} #footer .ft_addr p{display: flex;flex-wrap:wrap;align-items: center;gap:8px clamp(10px, 1.2vw, 16px);font-size:clamp(16px, 1.5vw, 17px);color:var(--border-color02);font-weight:400;} #footer .ft_addr strong{color:var(--point-white);font-weight:700;} #footer .ft_addr a{color:var(--border-color02);} #footer .ft_addr .bar{color:var(--black-color07);} #footer .ft_top_box{padding-block:var(--row-gap60) clamp(25px, 5vw, 56px);border-bottom:1px solid rgba(255,255,255,0.2);} #footer .ft_top_box .w_custom{display: flex;align-items: flex-start;justify-content: space-between;gap:var(--row-gap30);} footer .logo_box{display: flex;flex-direction: column;gap:var(--row-gap40)} #footer .logo{width: clamp(150px, 20vw, 220px);flex-shrink:0;} #footer .info_box{display: flex;flex-direction: column;gap:clamp(8px, 1vw, 13px);} #footer .info_box > strong{font-size:var(--text-20);color:var(--point-white);font-weight:500;} #footer .info_box .addr-list{display:flex;flex-direction: column;} #footer .addr-list li{display: flex;flex-wrap:wrap;gap:clamp(10px, 1.4vw, 14px) clamp(15px, 3vw, 29px);} #footer .desc{display: flex;gap:3px;font-size:var(--text-17);color:var(--border-color01);font-weight:300;line-height:1.9;position: relative;font-family:var(--font-type02);letter-spacing:0;} #footer .desc :is(dt, dd){letter-spacing:0;} #footer .desc > dt{flex-shrink:0;} #footer .desc > dd{position: relative;} #footer .cs_info_box{text-align: right;display: flex;flex-direction: column;align-items: flex-end;} #footer .cs_info_box > strong{display: flex;align-items: center;gap:clamp(6px, 1vw, 12px);font-size:var(--text-18);color:var(--point-white);font-weight:400;justify-content: flex-end;} #footer .cs_info_box > strong:before{width:clamp(2px, 0.2vw, 4px);aspect-ratio:auto 1;content:"";background:var(--point-color01);display: inline-block;flex-shrink:0;} #footer .cs_info_box .info{display: flex;flex-direction: column;gap:3px;align-items: flex-end;margin-top:clamp(5px, 0.5vw, 8px);} #footer .cs_info_box .info a{font-size:var(--text-34);color:var(--point-white);font-weight:500;} #footer .cs_info_box .info p{font-size:var(--text-16);color:var(--border-color01);font-weight:300;font-family:var(--font-type02);} #footer .cs_info_box > a{display: inline-flex;width:40px;aspect-ratio:auto 1;align-items: center;justify-content: center;border:1px solid rgba(255,255,255,0.4);margin-top:clamp(20px, 3vw, 35px);} #footer .cs_info_box > a img{height:clamp(12px, 1.2vw, 16px);} #footer .ft_copy_box{display: flex;align-items: center;justify-content: space-between;padding-block:clamp(20px, 3.5vw, 39px);} #footer .copy{font-size:var(--text-17);color:var(--black-color06);font-weight:400;} #footer .ft_menu{display: flex;gap:var(--row-gap40)} #footer .ft_menu li a{font-size:var(--text-17);color:var(--point-white);font-weight:300;} #footer .ft_menu li.policy a{font-weight:600;} .ft_quick{position: fixed;bottom:var(--row-gap30);right:var(--row-gap30);z-index:10;opacity:0;pointer-events:none;transition:all 0.3s;} .ft_quick.on{opacity:1;pointer-events:initial;} .ft_quick .quick_top{width:clamp(46px, 5.5vw, 60px);aspect-ratio:auto 1;border-radius:100%;background:var(--point-white);box-shadow:var(--shadow-02);display: flex;align-items: center;justify-content: center;} @media (max-width:1450px){ #footer .ft_cs_box{flex-wrap:wrap;justify-content: flex-end;} #footer .ft_menu{width:100%;flex-direction:row;justify-content: flex-end;} } @media (max-width:1023px){ #footer .w_custom{flex-direction: column-reverse;} #footer .ft_info_box .logo{display: none;} #footer .ft_cs_box .logo_box{display: block;width:100%;} #footer .ft_cs_box, #footer .ft_menu{justify-content: flex-start;} .ft_quick a img{max-width:48%;} } @media (max-width:640px){ #footer .ft_cs_box{flex-direction: column;} } @media (max-width:479px){ #footer .desc + .desc:before{display: none;} } /*─────────────────────────────────────────────────────────── Sub Visual & 고정 서브 메뉴 (서브페이지 상단 비주얼 + 헤더 아래 고정 탭) ───────────────────────────────────────────────────────────*/ .sub_visual .thumb{position: relative;height:clamp(500px, 96vw, 960px);background:var(--point-color01);} .sub_visual .sv_cont{position: absolute;inset-inline:0;top:50%;translate:0 -50%;z-index:2;display: flex;flex-direction:column;gap:var(--row-gap30);color:var(--point-white);align-items: flex-start;} .sub_visual .sv_cont > span{display: block;font-size:var(--text-22);font-weight:600;line-height:1.7;} .sub_visual .sv_cont h2{font-size:var(--text-68);font-weight:700;font-family:var(--font-type02);line-height:1.3;} .sub_visual .sv_cont p{font-size:var(--text-20);font-weight:400;font-family:var(--font-type02);line-height:1.6;margin-top:var(--row-gap10);} .sub_visual .sv_cont .care_system{margin-top:var(--row-gap30);padding:clamp(10px, 1.5vw, 17px) var(--row-gap40);border-radius:var(--radius-10);background: rgba(255, 255, 255, 0.20);display: flex;align-items: center;flex-wrap:wrap;gap:var(--row-gap80);} .sub_visual .sv_cont .care_system p{display: flex;align-items: center;flex-shrink:0;gap:clamp(12px, 2vw, 24px);margin:0;position: relative;} .sub_visual .sv_cont .care_system p + p:before{width:1px;height:clamp(10px, 2vw, 20px);content:"";background: rgba(255, 255, 255, 0.20);position: absolute;top:50%;left:calc(var(--row-gap80) / 2 * -1);translate:0 -50%;} .sub_visual .sv_cont .care_system p strong{font-size:var(--text-34);font-weight:700;} .sv_scroll_wrap{position: absolute;bottom:0;left:50%;translate:-50%;display: flex;justify-content: flex-end;} .sub_visual .sv_scroll{display: flex;flex-direction:column;align-items:center;gap:16px;} .sub_visual .sv_scroll .txt{writing-mode:vertical-rl;font-size:var(--text-14);color:var(--point-white);letter-spacing:0.2em;font-weight:500;font-family:var(--font-type02);} .sub_visual .sv_scroll .line{position: relative;width:2px;height:100px;background:rgba(255,255,255,0.3);overflow:hidden;} .sub_visual .sv_scroll .line:before{content:"";position: absolute;left:0;top:0;width:100%;height:20%;background:var(--point-white);animation:svScrollMove 2s ease-in-out infinite;} .sub-nav.dep02{position: sticky;top:0;z-index:90;background:rgba(255,255,255,0.9);backdrop-filter:blur(6px);border-block:1px solid var(--border-color01);} .sub-nav.dep02 .lnb{display: flex;align-items: center;gap:var(--row-gap60);height:clamp(56px, 6vw, 70px);overflow-x:auto;} .sub-nav.dep02 .lnb a{flex-shrink:0;display:flex;align-items: center;font-size:var(--text-18);color:var(--black-color03);font-weight:400;height:100%;border-bottom:2px solid transparent;white-space:nowrap;} .sub-nav.dep02 .lnb a.on{color:var(--black-color00);font-weight:600;border-color:var(--black-color00);} .sub-nav.dep02 .recruit_nav{position: relative;} .sub-nav.dep02 .recruit_nav .main_more{border-radius:6px;border:1px solid var(--point-color04);position: absolute;right:0;top:50%;translate:0 -50%;backdrop-filter: none;height:auto;padding:10px 20px;gap:8px;font-size:var(--text-16);color:var(--point-color04) !important;font-weight:500 !important;background:var(--point-white);} .sub-nav.dep02 .recruit_nav .main_more:after{filter:none;} @media (hover:hover) and (pointer:fine){ .sub-nav.dep02 .lnb a:not(.on):hover{color:var(--black-color00);} } @media (max-width:860px){ .sv_scroll_wrap{display: none;} } @media (max-width:479px){ .sub_visual .sv_cont h2{font-size:var(--text-50);} .sub_visual .sv_cont .care_system{gap:5px;padding:10px;} .sub_visual .sv_cont .care_system p + p:before{display: none;} .sub_visual .sv_cont p br{display: none;} .sub_visual .sv_scroll{display: none;} .sub-nav.dep02 .recruit_nav .main_more{display: none;} } @keyframes svScrollMove{ 0%{transform:translateY(-100%);} 100%{transform:translateY(550%);} } .sec-bg{background:var(--gray-bg05);} /*─────────────────────────────────────────────────────────── About 페이지 (writable/pages/ko/about.html) ───────────────────────────────────────────────────────────*/ /*trust*/ .trust_wrapper{background:var(--point-grad01);} .trust_wrapper .trust_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .trust_wrapper .trust_cards{display: flex;align-items: stretch;gap:var(--row-gap30);width:100%;} .trust_wrapper .trust_card{flex:1 0 0;min-width:0;display: flex;flex-direction:column;align-items: center;gap:var(--row-gap10);padding:clamp(28px, 2.6vw, 44px) clamp(16px, 1.5vw, 24px);background:var(--point-color05);border:1px solid rgba(255,255,255,0.2);border-radius:20px;text-align:center;transition:all 0.3s;} .trust_wrapper .trust_card .ico{display: flex;align-items: center;justify-content: center;width:clamp(48px, 4.5vw, 60px);height:clamp(48px, 4.5vw, 60px);border-radius:50%;background:var(--point-color03);color:var(--point-white);} .trust_wrapper .trust_card .ico svg{width:50%;height:50%;} .trust_wrapper .trust_card strong{font-size:var(--text-36);color:var(--point-white);font-weight:700;} .trust_wrapper .trust_card p{font-size:var(--text-22);color:rgba(255,255,255,0.7);font-weight:400;} @media (hover:hover) and (pointer:fine){ .trust_wrapper .trust_card:hover{translate:0 -20px;} } @media (max-width:1023px) { .trust_wrapper .trust_cards{flex-wrap:wrap;} .trust_wrapper .trust_card{flex:1 0 calc(50% - var(--row-gap30) / 2);} } /*system*/ .system_wrapper{background:var(--point-white);} .system_wrapper .system_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .system_wrapper .system_cards{display: flex;gap:var(--row-gap30);width:100%;} .system_wrapper .card{flex:1 0 0;min-width:0;display: flex;flex-direction:column;align-items: center;justify-content: center;gap:var(--row-gap20);padding:clamp(28px, 2.8vw, 50px) clamp(20px, 2vw, 32px);border-radius:20px;text-align:center;} .system_wrapper .card01{background:var(--point-color14);} .system_wrapper .card02{background:var(--point-color15);} .system_wrapper .card03{background:var(--point-color01);} .system_wrapper .card .ico{display: flex;align-items: center;justify-content: center;width:clamp(70px, 9vw, 98px);aspect-ratio:auto 1;;border-radius:50%;background:var(--point-white);color:var(--point-color02);} .system_wrapper .card03 .ico{background:var(--point-grad04);color:var(--point-white);} .system_wrapper .card strong{font-size:var(--text-34);color:var(--black-color03);font-weight:600;display: block;margin-top:var(--row-gap20);} .system_wrapper .card03 strong{color:var(--point-white);} .system_wrapper .card p{font-size:var(--text-20);color:var(--black-color05);font-weight:400;line-height:1.6;} .system_wrapper .card03 p{color:rgba(255,255,255,0.75);} .system_wrapper .system_plus{flex-shrink:0;display: inline-flex;position: relative;width:clamp(30px, 4vw, 44px);aspect-ratio:auto 1;align-items: center;justify-content: center;} .system_wrapper .system_plus:before{width:clamp(12px, 1.5vw, 18px);aspect-ratio:auto 1;content:"";background:var(--black-color03);clip-path:var(--clip-poly03);} .system_wrapper .system_arrow{flex-shrink:0;display:flex;width:clamp(40px, 5vw, 77px);align-items: center;} @media (max-width:1023px){ .system_wrapper .system_cards{flex-direction:column;align-items: center;} .system_wrapper .card{flex:auto;width:100%;} .system_wrapper .system_arrow{transform:rotate(90deg);} } /*reason*/ .reason_wrapper .reason_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .reason_wrapper .reason_cards{display: grid;grid-template-columns:repeat(2, 1fr);gap:var(--row-gap30);width:100%;} .reason_wrapper .reason_card{display: flex;flex-direction:column;gap:var(--row-gap20);padding:clamp(28px, 2.8vw, 50px) clamp(24px, 2.4vw, 44px);background:var(--point-white);border-radius:20px;box-shadow:4px 4px 25px rgba(0,0,0,0.05);} .reason_wrapper .card_tit{display: flex;align-items: center;gap:var(--row-gap10);} .reason_wrapper .num{flex-shrink:0;display: inline-flex;align-items: center;justify-content: center;width:clamp(32px, 4vw, 46px);height:clamp(32px, 4vw, 46px);border-radius:50%;background:var(--point-color03);color:var(--point-white);font-size:var(--text-20);font-weight:500;} .reason_wrapper .card_tit strong{font-size:var(--text-28);color:var(--point-color04);font-weight:700;} .reason_wrapper .reason_card > p{font-size:var(--text-20);color:var(--black-color05);font-weight:400;line-height:1.7;} /* 카드 호버 효과 (다른 카드와 동일. AOS 규칙보다 우선하도록 선택자 강화, 등장은 AOS 값 유지) */ .reason_wrapper .reason_cards .reason_card[data-aos][data-aos]{transition-property:transform,opacity,translate,box-shadow;transition-duration:.7s,.7s,.15s,.15s;transition-timing-function:cubic-bezier(.55,.085,.68,.53),cubic-bezier(.55,.085,.68,.53),ease-out,ease-out;} @media (hover:hover) and (pointer:fine){ .reason_wrapper .reason_card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.14);} } @media (prefers-reduced-motion:reduce){ .reason_wrapper .reason_card:hover{translate:none;} } @media (max-width:1023px){ .reason_wrapper .reason_cards{grid-template-columns:1fr;} } /*ceo*/ .ceo_wrapper .ceo_content{display: flex;align-items: flex-start;gap:var(--row-gap100);margin-top:var(--row-gap80);} .ceo_wrapper .ceo_profile{border-radius:var(--radius-20);overflow:hidden;background:var(--point-white);box-shadow:var(--shadow-03);width:clamp(300px, 35vw, 460px);flex-shrink:0;position: sticky;top:100px;} .ceo_wrapper .ceo_profile .info{padding:var(--row-gap40);display: flex;flex-direction:column;gap:clamp(8px, 1.4vw, 16px);} .ceo_wrapper .ceo_profile .info strong{font-size:var(--text-40);color:var(--point-color04);font-weight:700;} .ceo_wrapper .ceo_profile .info > span{font-size:var(--text-20);color:var(--point-color03);font-weight:500;line-height:1.4;} .ceo_wrapper .ceo_profile .info p{font-size:var(--text-18);color:var(--black-color05);font-weight:500;line-height:1.6;} .ceo_wrapper .contact{display: flex;flex-direction:column;gap:var(--row-gap10);margin-top:clamp(10px, 1.4vw, 14px);} .ceo_wrapper .contact a{display: flex;align-items: center;gap:var(--row-gap10);font-size:var(--text-17);color:var(--black-color05);font-weight:400;} .ceo_wrapper .contact .ico{flex-shrink:0;display: flex;align-items: center;justify-content: center;width:clamp(24px, 3vw, 32px);aspect-ratio:auto 1;border-radius:50%;background:var(--point-color03);color:var(--point-white);} .ceo_wrapper .ceo_right{min-width:0;display: flex;flex-direction:column;gap:var(--row-gap120);width:100%;} .ceo_wrapper .ceo_video h4, .ceo_wrapper .ceo_history h4, .ceo_wrapper .ceo_message h4{font-size:var(--text-40);color:var(--point-color04);font-weight:700;margin-bottom:var(--row-gap40);} .ceo_wrapper .video_box{position: relative;aspect-ratio:auto 16/9;border-radius:var(--radius-20);overflow:hidden;} .ceo_wrapper .video_box iframe{position: absolute;inset:0;width:100%;height:100%;border:0;} .ceo_wrapper .history_group{display: flex;align-items: flex-start;position: relative;padding-bottom:var(--row-gap50);gap:var(--row-gap50);} .ceo_wrapper .history_group:last-child{padding-bottom:0;} .ceo_wrapper .history_range{width:110px;flex-shrink:0;font-size:var(--text-30);color:var(--black-color03);font-weight:500;} .ceo_wrapper .history_years{flex:1 1 0;min-width:0;display: flex;flex-direction:column;gap:var(--row-gap20);position: relative;padding-top:clamp(5px, 0.8vw, 8px);} .ceo_wrapper .history_years > li{font-size:var(--text-18);color:var(--black-color05);font-weight:400;line-height:1.4;} .ceo_wrapper .history_years > li strong{color:var(--point-color04);font-weight:600;} .ceo_wrapper .history_group:first-child .line{top:clamp(12px, 1.5vw, 16px);height:calc(100% - clamp(12px, 1.5vw, 16px));} .ceo_wrapper .history_group:last-child .line{height:calc(var(--row-gap50) / 2);} .ceo_wrapper .history_group .line{width:1px;height:100%;background:var(--border-color01);position: absolute;top:0;left:110px;} .ceo_wrapper .history_group .line::before{width:clamp(5px, 0.6vw, 9px);height:clamp(5px, 0.6vw, 9px);content:"";border-radius:100%;background:var(--border-color02);position: absolute;top:clamp(10px, 1.4vw, 18px);left:0;translate:-50%;} .ceo_wrapper .history_group:first-child .line:before{top:0;} .ceo_wrapper .history_group .line em{position: absolute;top:0;left:0;width:100%;background: var(--point-color03);} /*on*/ .ceo_wrapper .history_group.on .line::before{background: var(--point-color03);} .ceo_wrapper .history_group.on:not(:has(~ .history_group.on)) .line::before{box-shadow: 0 0 0 clamp(4px, 0.5vw, 6px) rgba(207, 154, 37, 0.2);} .ceo_wrapper .msg_box{background:var(--gray-bg05);border-radius:var(--radius-20);padding:var(--row-gap40);display: flex;flex-direction:column;gap:clamp(10px, 1.4vw, 16px);} .ceo_wrapper .msg_box p{font-size:var(--text-18);color:var(--black-color04);font-weight:400;line-height:1.6;} .ceo_wrapper .msg_box strong{color:var(--black-color03);font-weight:600;} .ceo_wrapper .msg_sign{display: flex;align-items: center;justify-content: flex-end;gap:var(--row-gap20);margin-top:clamp(6px, 1.2vw, 14px);padding-top:var(--row-gap20);border-top:1px solid var(--border-color01);} .ceo_wrapper .msg_sign span{font-size:var(--text-17);color:var(--black-color05);font-weight:400;} .ceo_wrapper .msg_sign strong{font-size:var(--text-30);color:var(--point-color04);font-weight:600;line-height:1.6;} @media (max-width:1023px){ .ceo_wrapper .ceo_content{flex-direction:column;align-items: center;} .ceo_wrapper .ceo_profile{flex:auto;width:100%;max-width:460px;position:static;} } @media (max-width:640px){ .ceo_wrapper .history_group{flex-direction:column;gap:var(--row-gap10);padding-left:var(--row-gap30);} .ceo_wrapper .history_range{width:auto;padding-right:0;} .ceo_wrapper .history_years{padding-left:0;} .ceo_wrapper .history_group .line{left:0;} } /*support*/ .support_wrapper .support_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap40);} .support_cards{position: relative;display: flex;gap:var(--row-gap20);width:100%;margin-top:var(--row-gap120);padding-top:var(--row-gap60);} .support_cards:before{content:"";position: absolute;top:calc(var(--row-gap120) * -1);left:50%;width:1px;height:var(--row-gap120);background:var(--border-color01);} .support_cards:after{content:"";position: absolute;top:0;left:9.5%;right:9.5%;height:1px;background:var(--border-color01);} .support_card{position: relative;flex:1 1 0;min-width:0;border-radius:var(--radius-10);background:var(--point-white);border:1px solid var(--border-color01);} .support_card:before{content:"";position: absolute;top:calc(var(--row-gap60) * -1);left:50%;width:1px;height:var(--row-gap60);background:var(--border-color01);} .support_card .card_tit{display: flex;align-items: center;gap:var(--row-gap20);padding:var(--row-gap15) var(--row-gap20);color:var(--point-white);border-radius:var(--radius-10) var(--radius-10) 0 0;} .support_card .ico{flex-shrink:0;display: flex;align-items: center;justify-content: center;width:clamp(40px, 5vw, 50px);height:clamp(40px, 5vw, 50px);border-radius:var(--radius-10);background:rgba(255,255,255,0.2);} .support_card .card_tit strong{font-size:var(--text-26);font-weight:500;} .support_card ul{display: flex;flex-direction:column;padding:clamp(12px, 2vw, 24px);padding-top:clamp(6px, 1vw, 12px);} .support_card ul li{position: relative;padding-block:clamp(6px, 1vw, 12px);font-size:var(--text-18);color:var(--black-color05);font-weight:400;line-height:1.6;border-bottom:1px solid var(--border-color01);display: flex;align-items: flex-start;gap:clamp(4px, 0.6vw, 8px);letter-spacing:-0.04em} .support_card ul li:last-child{border-bottom:0;} .support_card ul li:before{content:"";translate:0 clamp(8px, 1vw, 11px);width:5px;height:5px;border-radius:50%;flex-shrink:0;} .support_card.team01 .card_tit{background:var(--point-color07);} .support_card.team01 li:before{background:var(--point-color07);} .support_card.team02 .card_tit{background:var(--point-color12);} .support_card.team02 li:before{background:var(--point-color12);} .support_card.team03 .card_tit{background:var(--point-color13);} .support_card.team03 li:before{background:var(--point-color13);} .support_card.team04 .card_tit{background:var(--point-color08);} .support_card.team04 li:before{background:var(--point-color08);} .support_card.team05 .card_tit{background:var(--point-color16);} .support_card.team05 li:before{background:var(--point-color16);} @media (max-width:1200px){ .support_cards{flex-wrap:wrap;margin-top:var(--row-gap40);padding-top:0;gap:var(--row-gap30);} .support_cards:before, .support_cards:after, .support_card:before{display: none;} .support_card{flex:initial;width:calc(50% - var(--row-gap30) / 2);} } @media (max-width:640px){ .support_card{width:100%;} } /*branch — 관리자 지점관리 데이터 연동*/ .branch_wrapper .branch_content{display: flex;align-items: stretch;gap:var(--row-gap20);width:100%;margin-top:var(--row-gap60);} .branch_wrapper .branch_map{flex:1 1 0;min-width:0;display: flex;flex-direction:column;align-items: center;justify-content: center;gap:var(--row-gap10);border-radius:var(--radius-20);background:var(--gray-bg05);color:var(--black-color07);min-height:570px;overflow:hidden;} .branch_wrapper .branch_map .pin{width:40px;height:40px;} .branch_wrapper .branch_map p{font-size:var(--text-16);} .branch_wrapper .branch_map .branch_map_canvas{width:100%;height:100%;} .branch_wrapper .branch_panel{flex:0 0 clamp(400px, 40vw, 500px);border:1px solid var(--border-color01);border-radius:var(--radius-20);padding:var(--row-gap30);display: flex;flex-direction:column;gap:var(--row-gap20);} .branch_wrapper .branch_tabs{display: flex;gap:var(--row-gap10);} .branch_wrapper .branch_tabs button{flex:1 1 0;padding:var(--row-gap10) 0;border:1px solid var(--border-color01);border-radius:10px;background:var(--point-white);font-size:var(--text-17);color:var(--black-color05);font-weight:500;transition:all 0.3s;} .branch_wrapper .branch_tabs button.on{background:var(--point-color01);border-color:var(--point-color01);color:var(--point-white);} .branch_wrapper .branch_groups{display: flex;flex-direction:column;max-height:570px;overflow:hidden;overflow-y:auto;padding-right:10px;} .branch_wrapper .branch_groups::-webkit-scrollbar{width:4px;background:var(--gray-bg01);} .branch_wrapper .branch_groups::-webkit-scrollbar-thumb{background:var(--black-color10);} .branch_wrapper .branch_group{border-bottom:1px solid var(--border-color01);} .branch_wrapper .branch_group:last-child{border-bottom:0;} .branch_wrapper .group_tit{display: flex;align-items: center;gap:var(--row-gap10);width:100%;padding:var(--row-gap15) 0;text-align:left;} .branch_wrapper .group_tit strong{font-size:var(--text-18);color:var(--black-color00);font-weight:700;} .branch_wrapper .group_tit span:not(.arw){font-size:var(--text-15);color:var(--black-color06);font-weight:400;} .branch_wrapper .group_tit .arw{flex-shrink:0;margin-left:auto;width:16px;height:16px;color:var(--black-color06);transition:transform 0.3s;} .branch_wrapper .branch_group.on .group_tit .arw{transform:rotate(180deg);} .branch_wrapper .group_list{display: flex;flex-direction:column;gap:var(--row-gap10);max-height:0;overflow:hidden;transition:max-height 0.3s;} .branch_wrapper .branch_group.on .group_list{max-height:400px;padding-bottom:var(--row-gap15);} .branch_wrapper .group_list li{border:1px solid var(--border-color01);border-radius:10px;overflow:hidden;} .branch_wrapper .group_list .branch_item{display:flex;flex-direction:column;gap:var(--row-gap10);width:100%;padding:var(--row-gap10) var(--row-gap15);text-align:left;background:var(--point-white);cursor:pointer;transition:background 0.2s;} .branch_wrapper .group_list .branch_item:focus-visible{background:var(--gray-bg01);} .branch_wrapper .group_list .branch_name{font-size:var(--text-16);color:var(--black-color05);font-weight:500;} .branch_wrapper .group_list .branch_addr{font-size:var(--text-14);color:var(--black-color07);} @media (hover:hover) and (pointer:fine){ .branch_wrapper .group_list .branch_item:hover{background:var(--gray-bg01);} } @media (max-width:1023px){ .branch_wrapper .branch_content{flex-direction:column;} .branch_wrapper .branch_map{width:100%;min-height:320px;} .branch_wrapper .branch_panel{flex:auto;width:100%;} } /*next — CTA 배너(배경 이미지는 /images/next_bg.jpg 로 등록)*/ #wrap .next_wrapper{position:relative;padding-block:clamp(60px, 10vw, 116px);} .next_wrapper .bg{width:100%;height:100%;position: absolute;top:0;left:0;} .next_wrapper::before{content:"";position:absolute;inset:0;background:var(--point-color11);opacity:0.8;z-index:1;} .next_wrapper .next_inner{position:relative;display: flex;flex-direction:column;align-items: center;gap:var(--row-gap40);text-align:center;z-index: 3;} .next_wrapper .check_row{display: flex;align-items: center;justify-content: center;flex-wrap:wrap;gap:var(--row-gap20) var(--row-gap40);width:100%;padding:var(--row-gap40) var(--row-gap20);border-radius:var(--radius-20);border: 1px solid rgba(255, 255, 255, 0.30);background: rgba(26, 43, 76, 0.60);} .next_wrapper .check_row li{display: flex;align-items: center;gap:var(--row-gap10);color:var(--point-white);font-size:var(--text-20);font-weight:500;} .next_wrapper .check_row li .ico{position: relative;flex-shrink:0;width:clamp(20px, 3vw, 30px);height:clamp(20px, 3vw, 30px);border-radius:100%;background:var(--point-color03);display: flex;align-items: center;justify-content: center;} .next_wrapper .check_row li .ico:after{content:"";display: inline-block;width:6px;height:10px;border:solid var(--point-white);border-width:0 2px 2px 0;transform:rotate(45deg);} .next_wrapper .btn_group{display: flex;align-items: center;gap:var(--row-gap20);} @media (max-width:1023px){ .next_wrapper .check_row{flex-direction:column;align-items: flex-start;gap:var(--row-gap15);} .next_wrapper .check_row li{border-left:none;padding-inline:0;width:100%;} .next_wrapper .btn_group{flex-direction:column;width:100%;} .next_wrapper .btn_group .main_more{width:100%;justify-content: center;} } /*─────────────────────────────────────────────────────────── 성장지원시스템 ───────────────────────────────────────────────────────────*/ /*onboarding — 신입 정착 프로그램*/ .onboarding_wrapper .onboarding_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .onboarding_wrapper .onboarding_inner .main_title:not(:first-child){margin-top:var(--row-gap40);} .onboarding_cards{display: flex;align-items: stretch;gap:var(--col-gap40);width:100%;} .onboarding_card{flex:1 1 0;min-width:0;display: flex;flex-direction:column;gap:var(--row-gap30);padding:var(--row-gap40);background:var(--point-white);border-radius:var(--radius-20);box-shadow:4px 4px 25px rgba(0,0,0,0.1);} .onboarding_card .card_tit{display: flex;align-items: center;gap:var(--col-gap30);} .onboarding_card .card_tit .ico{flex-shrink:0;width:clamp(64px, 6vw, 98px);height:clamp(64px, 6vw, 98px);background:var(--point-color16);border-radius:100%;} .onboarding_card:nth-child(2) .card_tit .ico{background:var(--point-color12);} .onboarding_card .card_tit .ico img{width:100%;height:100%;} .onboarding_card .card_tit .txt{display: flex;flex-direction:column;gap:var(--row-gap10);} .onboarding_card .card_tit .txt strong{font-size:var(--text-34);color:var(--point-color04);font-weight:700;} .onboarding_card .card_tit .txt p{font-size:var(--text-22);color:var(--black-color03);} /* 카드 호버 효과 (다른 카드와 동일. AOS 규칙보다 우선하도록 선택자 강화, 등장은 AOS 값 유지) */ .onboarding_cards .onboarding_card[data-aos][data-aos]{transition-property:transform,opacity,translate,box-shadow;transition-duration:.7s,.7s,.15s,.15s;transition-timing-function:cubic-bezier(.55,.085,.68,.53),cubic-bezier(.55,.085,.68,.53),ease-out,ease-out;} @media (hover:hover) and (pointer:fine){ .onboarding_card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.18);} } @media (prefers-reduced-motion:reduce){ .onboarding_card:hover{translate:none;} } .process_cards{display: flex;align-items: stretch;gap:var(--col-gap25);width:100%;} .process_card{flex:1 1 0;min-width:0;display: flex;flex-direction:column;background:var(--point-white);border-radius:10px;box-shadow:4px 4px 25px rgba(0,0,0,0.1);overflow:hidden;} .process_card .card_tit{display: flex;flex-direction:column;align-items: center;justify-content: center;gap:var(--row-gap20);padding:var(--row-gap30) clamp(20px, 3vw, 40px);text-align:center;} .process_card .step{display: inline-flex;align-items: center;justify-content: center;padding:6px 16px;border-radius:50px;background:var(--point-white);font-size:var(--text-18);font-weight:500;} .process_card .card_tit strong{font-size:var(--text-28);color:var(--point-white);font-weight:700;line-height:1.4;} .process_card ul{display: flex;flex-direction:column;padding:0 clamp(20px, 3vw, 30px) var(--row-gap30);} .process_card li{position: relative;padding:var(--row-gap15) 0 var(--row-gap15) 14px;font-size:var(--text-18);color:var(--black-color06);line-height:1.6;border-bottom:1px solid var(--border-color03);} .process_card li:last-child{border-bottom:0;} .process_card li:before{content:"";position: absolute;top:calc(var(--row-gap15) + 0.7em);left:0;width:4px;height:4px;border-radius:100%;background:var(--black-color03);} .process_card li strong{font-weight:600;color:var(--black-color03);} .process_card.c01 .card_tit{background:var(--point-color07);} .process_card.c01 .step{color:var(--point-color07);} .process_card.c01 li:before{background:var(--point-color07);} .process_card.c02 .card_tit{background:var(--point-color12);} .process_card.c02 .step{color:var(--point-color12);} .process_card.c02 li:before{background:var(--point-color12);} .process_card.c03 .card_tit{background:var(--point-color13);} .process_card.c03 .step{color:var(--point-color13);} .process_card.c03 li:before{background:var(--point-color13);} .process_card.c04 .card_tit{background:var(--point-color08);} .process_card.c04 .step{color:var(--point-color08);} .process_card.c04 li:before{background:var(--point-color08);} /* 카드 호버 효과 - 성장지원 페이지 한정(채용 페이지 .process_card 에는 영향 없음). 4개월 케어는 카드에 AOS 가 있어 선택자 강화 */ .onboarding_wrapper .process_cards .process_card[data-aos][data-aos]{transition-property:transform,opacity,translate,box-shadow;transition-duration:.7s,.7s,.15s,.15s;transition-timing-function:cubic-bezier(.55,.085,.68,.53),cubic-bezier(.55,.085,.68,.53),ease-out,ease-out;} .eduprogram_wrapper .edu_cards .process_card{transition:translate .15s ease-out, box-shadow .15s ease-out;} @media (hover:hover) and (pointer:fine){ .onboarding_wrapper .process_card:hover, .eduprogram_wrapper .process_card:hover{translate:0 -10px;box-shadow:6px 14px 35px rgba(0,0,0,0.18);} } @media (prefers-reduced-motion:reduce){ .onboarding_wrapper .process_card:hover, .eduprogram_wrapper .process_card:hover{translate:none;} } @media (max-width:1023px){ .onboarding_cards{flex-direction:column;} .process_cards{flex-wrap:wrap;} .process_card{flex:1 1 calc(50% - var(--col-gap25) / 2);} } @media (max-width:640px){ .process_card{flex:1 1 100%;} } /*exclusive — 명문컴퍼니 독점 지원 시스템 (탭)*/ .exclusive_wrapper{background:var(--point-grad01);} .exclusive_wrapper .exclusive_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .exclusive_tabs{display: flex;align-items: stretch;gap:var(--row-gap30);width:100%;background:var(--point-color05);border:1px solid rgba(255,255,255,0.3);border-radius:var(--radius-20);padding:var(--row-gap30);box-shadow:8.667px 3.467px 8.667px rgba(0,0,0,0.1);} .exclusive_tabs .tab_list{display: flex;flex-direction:column;flex:0 0 380px;} .exclusive_tabs .tab_item{display: flex;align-items: center;gap:var(--row-gap20);width:100%;padding:var(--row-gap20);border:2px solid transparent;border-radius:15px;text-align:left;opacity:0.5;transition:opacity 0.3s;} .exclusive_tabs .tab_item .ico{flex-shrink:0;width:50px;height:50px;border-radius:15px;background:var(--point-color03);} .exclusive_tabs .tab_item .ico img{width:100%;height:100%;} .exclusive_tabs .tab_item .txt{display: flex;flex-direction:column;gap:4px;} .exclusive_tabs .tab_item .txt strong{font-size:var(--text-22);color:var(--point-white);font-weight:600;} .exclusive_tabs .tab_item .txt p{font-size:var(--text-16);color:var(--point-white);font-weight:400;} .exclusive_tabs .tab_item.on{opacity:1;border-color:var(--point-color03);} .exclusive_tabs .tab_panels{flex:1 1 0;min-width:0;} .exclusive_tabs .tab_panel{display:none;flex-direction:column;justify-content: center;gap:var(--row-gap40);height:100%;background:rgba(255,255,255,0.05);border-radius:15px;padding:var(--row-gap40);} .exclusive_tabs .tab_panel.on{display: flex;} .exclusive_tabs .panel_tit{display: flex;flex-direction:column;gap:var(--row-gap15);} .exclusive_tabs .panel_tit strong{font-size:var(--text-34);color:var(--point-white);font-weight:700;} .exclusive_tabs .panel_tit p{font-size:var(--text-20);color:var(--point-white);font-weight:400;line-height:1.6;} .exclusive_tabs .panel_grid{display: grid;grid-template-columns:repeat(2, 1fr);gap:var(--row-gap10);width:100%;} .exclusive_tabs .grid_item{display: flex;flex-direction:column;gap:var(--row-gap10);padding:clamp(15px, 2vw, 24px) var(--row-gap30);background:var(--point-color09);border-radius:10px;} .exclusive_tabs .grid_item .tit{display: flex;align-items: center;gap:var(--row-gap10);} .exclusive_tabs .grid_item .tit .ico{position: relative;flex-shrink:0;width:16px;height:13px;} .exclusive_tabs .grid_item .tit .ico:before{content:"";position: absolute;left:3px;top:-1px;width:clamp(7px, 0.8vw, 9px);height:clamp(12px, 1.3vw, 15px);border:solid var(--point-color03);border-width:0 3px 3px 0;transform:rotate(45deg);} .exclusive_tabs .grid_item .tit strong{font-size:var(--text-24);color:var(--point-white);font-weight:600;} .exclusive_tabs .grid_item p{font-size:var(--text-18);color:var(--point-white);font-weight:400;} .exclusive_tabs .tab_panel > .main_more{align-self:flex-start;width:100%;justify-content: center;border-radius:var(--radius-10);height:clamp(44px, 5vw, 54px);} @media (hover:hover) and (pointer:fine){ .exclusive_tabs .tab_item:hover{border-color:var(--point-color03)} } @media (max-width:1023px){ .exclusive_tabs{flex-direction:column;} .exclusive_tabs .tab_list{flex-direction:row;flex-wrap:wrap;flex:auto;} .exclusive_tabs .tab_item{flex:initial;width:50%;} .exclusive_tabs .panel_grid{grid-template-columns:1fr;} } @media (max-width:640px){ .exclusive_tabs .tab_item{width:100%;} } /*welcomekit — 명문 웰컴키트 (배경 크로스페이드는 관리자 > 배너관리 '웰컴키트' 그룹과 연동)*/ .welcomekit_wrapper{position: relative;overflow:hidden;background:var(--point-color11);} .welcomekit_wrapper .welcomekit_bg{position: absolute;inset:0;z-index:0;} .welcomekit_wrapper .welcomekit_bg li{position: absolute;inset:0;opacity:0;transition:opacity 1.2s ease;} .welcomekit_wrapper .welcomekit_bg li.on{opacity:1;} .welcomekit_wrapper .welcomekit_bg img{width:100%;height:100%;object-fit:cover;} .welcomekit_wrapper:before{content:"";position: absolute;inset:0;background:var(--point-color11);opacity:0.8;z-index:1;} .welcomekit_wrapper .welcomekit_inner{position: relative;z-index:2;display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .welcomekit_grid{display: grid;grid-template-columns:repeat(3, 1fr);gap:24px;width:100%;} .welcomekit_grid li{display: flex;flex-direction:column;align-items: center;gap:16px;padding:var(--row-gap30);background:rgba(255,255,255,0.1);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,0.2);border-radius:var(--radius-20);position: relative;} .welcomekit_grid li:before{width:100%;height:100%;content:"";border:2px solid var(--point-color03);position: absolute;top:0;left:0;opacity:0;pointer-events:none;transition:all 0.3s;border-radius:var(--radius-20);} .welcomekit_grid .ico{box-sizing:border-box;flex-shrink:0;width:clamp(50px, 7vw, 70px);height:clamp(50px, 7vw, 70px);background:var(--point-color03);border-radius:100%;} .welcomekit_grid li p{font-size:var(--text-22);color:var(--point-white);font-weight:600;text-align:center;} @media (hover:hover) and (pointer:fine){ .welcomekit_grid li:hover:before{opacity:1;} } @media (max-width:1023px){ .welcomekit_grid{grid-template-columns:repeat(2, 1fr);} } @media (max-width:640px){ .welcomekit_grid{grid-template-columns:1fr;} } /*salessupport — 영업 활동 지원*/ .salessupport_wrapper .salessupport_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .vs_row{position: relative;display: flex;align-items: stretch;gap:var(--row-gap30);width:100%;} .vs_card{flex:1 1 0;min-width:0;display: flex;flex-direction:column;gap:var(--row-gap30);padding:var(--row-gap40);border-radius:var(--radius-20);} .vs_card.bad{background:var(--point-color17);} .vs_card.good{background:var(--point-color18);} .vs_card .card_tit{display: flex;align-items: center;gap:var(--row-gap20);padding-bottom:var(--row-gap30);border-bottom:1px solid var(--border-color01);} .vs_card .card_tit .ico{flex-shrink:0;width:clamp(40px, 5vw, 50px);height:clamp(40px, 5vw, 50px);background:var(--point-color19);border-radius:var(--radius-10);} .vs_card.good .card_tit .ico{background:var(--point-color16);} .vs_card .card_tit strong{font-size:var(--text-28);color:var(--black-color01);font-weight:600;} .vs_badge{position: absolute;top:47%;left:50%;translate:-50% -50%;display: flex;align-items: center;justify-content: center;width:60px;height:60px;border-radius:100%;background:var(--point-color04);color:var(--point-white);font-size:var(--text-22);font-weight:700;box-shadow:0 0 17.5px rgba(0,0,0,0.1);z-index:1;} .support_row{display: flex;align-items: stretch;gap:var(--row-gap30);width:100%;} .salessupport_wrapper .support_card{padding:var(--row-gap50) var(--row-gap40);text-align: center;border-radius:var(--radius-20);} .salessupport_wrapper .support_card:before{display: none;} .salessupport_wrapper .support_card .card_tit{flex-direction:column;border-radius:0;gap:var(--row-gap10);padding:0;} .salessupport_wrapper .support_card .ico{background:var(--gray-bg01);width:clamp(70px, 8vw, 98px);height:clamp(70px, 8vw, 98px);border-radius:100%;margin-bottom:var(--row-gap30);} .salessupport_wrapper .support_card strong{font-size:var(--text-34);color:var(--black-color03);font-weight:600;} .salessupport_wrapper .support_card p{font-size:var(--text-20);color:var(--black-color03);font-weight:400;line-height:1.6;} .salessupport_wrapper .support_card ul{padding:var(--row-gap30) 0 0 0;margin-top: var(--row-gap30);border-top:1px solid var(--border-color03);} .salessupport_wrapper .support_card ul li{padding:0;border:none;} .salessupport_wrapper .card_btns{display: flex;flex-wrap:wrap;gap:var(--row-gap10);margin-top:var(--row-gap30);} .salessupport_wrapper .main_more{border:2px solid var(--point-color04);background:var(--point-color04);width:calc(50% - var(--row-gap10) / 2);border-radius:var(--radius-10);font-size:var(--text-19);padding-inline:var(--row-gap10);justify-content: center;} .salessupport_wrapper .main_more.basic{background:var(--point-white);color:var(--point-color04);} .salessupport_wrapper .main_more.basic:after{filter:none;} @media (hover:hover) and (pointer:fine){ .salessupport_wrapper .main_more:hover{background:var(--point-white);} .salessupport_wrapper .main_more.basic:hover{background:var(--point-color04);color:var(--point-white)} .salessupport_wrapper .main_more.basic:hover:after{filter:var(--filter-white)} } @media (max-width:1500px){ .salessupport_wrapper .main_more{width:100%;} } @media (max-width:1023px){ .vs_row{flex-direction:column;} .vs_badge{position: static;translate:none;margin-inline:auto;} .support_row{flex-direction:column;} .salessupport_wrapper .support_card{width:100%;} } /*popup_modal — 공용 팝업(DB 리스트 · 활용 영상 등 data-modal 트리거로 재사용)*/ .popup_modal{position: fixed;inset:0;z-index:300;display:none;align-items: center;justify-content: center;padding:20px;} .popup_modal.on{display: flex;} .popup_modal .popup_dim{position: absolute;inset:0;background:rgba(0,0,0,0.5);cursor:pointer;} .popup_modal .popup_box{position: relative;z-index:1;width:100%;max-width:1080px;max-height:90vh;background:var(--point-white);border-radius:var(--radius-20);padding:var(--row-gap40);display: flex;flex-direction:column;} .popup_modal .popup_tit{display: flex;align-items: center;justify-content: space-between;gap:var(--row-gap20);padding-bottom:var(--row-gap30);border-bottom:1px solid var(--border-color01);} .popup_modal .popup_tit h4{font-size:var(--text-30);color:var(--point-color04);font-weight:500;} .popup_modal .popup_tit h4 strong{font-weight:700;} .popup_modal .popup_close{flex-shrink:0;width:24px;height:24px;cursor:pointer;color:var(--black-color03);} .popup_modal .popup_body{overflow-y:auto;padding-top:var(--row-gap30);} .popup_modal .popup_body img{display: block;width:100%;height:auto;border-radius:10px;} .popup_modal .popup_body video{display: block;width:100%;aspect-ratio:16/9;border-radius:10px;background:#000;} .popup_modal.video .popup_box{max-width:960px;} body:has(.popup_modal.on){overflow:hidden;} @media (max-width:640px){ .popup_modal .popup_box{padding:var(--row-gap30) var(--row-gap20);} } /*eduprogram — 명문컴퍼니 교육프로그램 (process_card 헤더 재사용)*/ .eduprogram_wrapper .eduprogram_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .edu_cards{display: flex;align-items: stretch;gap:var(--col-gap25);width:100%;} .edu_cards .process_card .card_tit strong{font-size:var(--text-36);} .process_card .edu_body{display: flex;flex-direction:column;gap:var(--row-gap30);width:100%;padding:var(--row-gap30);} .process_card .edu_desc{font-size:var(--text-18);color:var(--black-color05);line-height:1.6;text-align:center;} .process_card .tag_grid{display: grid;grid-template-columns:repeat(2, 1fr);gap:10px;width:100%;} .process_card .tag_grid span{display: flex;align-items: center;justify-content: center;padding:10px 16px;border-radius:5px;font-size:var(--text-18);font-weight:600;text-align:center;} .process_card.c01 .tag_grid span{background:rgba(31, 72, 159, 0.05);color:var(--point-color07);} .process_card.c02 .tag_grid span{background:rgba(0, 168, 107, 0.05);color:var(--point-color12);} .process_card.c04 .tag_grid span{background:rgba(111, 70, 204, 0.05);color:var(--point-color08);} @media (max-width:1023px){ .edu_cards{flex-wrap:wrap;} .edu_cards .process_card{flex:initial;width:calc(50% - var(--col-gap25) / 2);} } @media (max-width:640px){ .edu_cards .process_card{width:100%;;} .tag_grid{grid-template-columns:1fr;} } /*edusupport — 교육지원 (일정표 카드 + 교육테마 표)*/ .edusupport_wrapper{background:var(--point-grad01);} .edusupport_wrapper .edusupport_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .schedule_cards{display: flex;align-items: stretch;gap:var(--row-gap30);width:100%;} .schedule_card{flex:1 1 0;min-width:0;display: flex;flex-direction:column;gap:var(--row-gap20);padding:var(--row-gap30);background:var(--point-white);border-radius:var(--radius-20);} .schedule_card .thumb{aspect-ratio:1/1;border-radius:10px;} .schedule_card p{font-size:var(--text-22);color:var(--point-color04);font-weight:600;text-align:center;} .edu_table_wrap{display: flex;align-items: stretch;width:100%;border-radius:var(--radius-10);overflow:hidden;} .edu_table{flex:1 1 0;min-width:0;width:auto;border-collapse:collapse;} .edu_table th, .edu_table td{border:1px solid var(--border-color01);} .edu_table thead th{background:var(--point-color07);color:var(--point-white);font-size:var(--text-20);font-weight:700;padding:var(--row-gap20);border-color:rgba(255,255,255,0.2);} .edu_table thead th:first-child{width:300px;} .edu_table tbody th{width:300px;background:var(--gray-bg05);color:var(--black-color03);font-size:var(--text-20);font-weight:600;padding:var(--row-gap20);vertical-align:middle;} .edu_table tbody td{background:var(--point-white);color:var(--black-color03);font-size:var(--text-18);font-weight:400;padding:18px var(--row-gap20);text-align:left;line-height:1.6;} .edu_table + .edu_table thead th:first-child, .edu_table + .edu_table tbody th{border-left:none;} @media (max-width:1023px){ .schedule_cards{flex-direction:column;} .edu_table_wrap{flex-direction:column;gap:var(--row-gap40);border-radius:0;} .edu_table thead th:first-child, .edu_table tbody th{width:40%;} .edu_table{border-radius:var(--radius-10);overflow:hidden;} } /*─────────────────────────────────────────────────────────── 설계사 제휴 서비스 ───────────────────────────────────────────────────────────*/ /*partnership — 팀케어 / 보케어*/ .partnership_wrapper .partnership_inner{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap60);} .partnership_list{display: flex;flex-direction:column;gap:var(--row-gap40);width:100%;} .partnership_card{display: flex;align-items: stretch;background:var(--point-white);border-radius:var(--radius-20);box-shadow:4px 4px 50px rgba(0,0,0,0.1);overflow:hidden;} .partnership_card:nth-child(even){flex-direction:row-reverse;} .partnership_card .thumb{position: relative;width:50%;} .partnership_card .thumb:after{content:"";position: absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,0.5) 100%);opacity:0;transition:opacity 0.3s ease;} .partnership_card.c01 .thumb:after{background:linear-gradient(180deg, rgba(31,72,159,0) 50%, rgba(31,72,159,0.5) 100%);} .partnership_card.c02 .thumb{background:var(--gray-bg01);} .partnership_card.c02 .thumb:after{background:linear-gradient(180deg, rgba(0,168,107,0) 50%, rgba(0,168,107,0.5) 100%), rgba(0,0,0,0.1);} .partnership_card.c03 .thumb:after{background:linear-gradient(180deg, rgba(244,158,11,0) 50%, rgba(244,158,11,0.5) 100%);} .partnership_card.c04 .thumb{background:var(--gray-bg01);} .partnership_card.c04 .thumb:after{background:linear-gradient(180deg, rgba(111,70,204,0) 50%, rgba(111,70,204,0.5) 100%), rgba(0,0,0,0.1);} .partnership_card.c05 .thumb:after{background:linear-gradient(180deg, rgba(1,118,215,0) 50%, rgba(1,118,215,0.5) 100%);} .partnership_card.c06 .thumb{background:var(--gray-bg01);} .partnership_card.c06 .thumb:after{background:linear-gradient(180deg, rgba(230, 87, 30, 0.00) 50%, rgba(230, 87, 30, 0.50) 100%);} .partnership_card:hover .thumb:after{opacity:1;} .partnership_card .thumb_cont{position: absolute;inset:0;z-index:1;display: flex;flex-direction:column;align-items: center;justify-content: center;gap:var(--row-gap20);opacity:0;transition:opacity 0.3s ease;} .partnership_card:hover .thumb_cont{opacity:1;} .partnership_card .thumb_cont .ico{display: flex;align-items: center;justify-content: center;width:98px;height:98px;border-radius:100%;background:var(--point-white);} .partnership_card .thumb_cont .ico img{width:40px;height:40px;} .partnership_card .thumb_cont .badge{display: inline-flex;align-items: center;padding:10px 24px;border-radius:100px;color:var(--point-white);font-size:var(--text-20);font-weight:500;} .partnership_card.c01 .thumb_cont .badge{background:var(--point-color07);} .partnership_card.c02 .thumb_cont .badge{background:var(--point-color12);} .partnership_card.c03 .thumb_cont .badge{background:var(--point-color13);} .partnership_card.c04 .thumb_cont .badge{background:var(--point-color08);} .partnership_card.c05 .thumb_cont .badge{background:var(--point-color16);} .partnership_card.c06 .thumb_cont .badge{background:var(--point-color19);} .partnership_card .txt{width:50%;display: flex;flex-direction:column;gap:var(--row-gap30);padding:var(--row-gap60);} .partnership_card .txt .tit{display: flex;flex-direction:column;gap:var(--row-gap20);} .partnership_card .txt .tit .label{display: inline-flex;align-items: center;align-self:flex-start;padding:4px 16px;border-radius:100px;background:var(--point-white);border:1px solid;font-size:var(--text-18);font-weight:500;} .partnership_card .txt .tit strong{font-size:var(--text-40);color:var(--point-color04);font-weight:700;} .partnership_card .txt .tit .desc{display: flex;flex-direction:column;gap:var(--row-gap10);} .partnership_card .txt .tit .desc .lead{font-size:var(--text-20);color:var(--black-color03);font-weight:500;line-height:1.6;} .partnership_card .txt .tit .desc p:not(.lead){font-size:var(--text-18);color:var(--black-color03);font-weight:400;line-height:1.6;} .partnership_card.c01 .txt .tit .label{color:var(--point-color07);border-color:var(--point-color07);} .partnership_card.c02 .txt .tit .label{color:var(--point-color12);border-color:var(--point-color12);} .partnership_card.c03 .txt .tit .label{color:var(--point-color13);border-color:var(--point-color13);} .partnership_card.c04 .txt .tit .label{color:var(--point-color08);border-color:var(--point-color08);} .partnership_card.c05 .txt .tit .label{color:var(--point-color16);border-color:var(--point-color16);} .partnership_card.c06 .txt .tit .label{color:var(--point-color19);border-color:var(--point-color19);} .partnership_card .feature_list{display: flex;flex-direction:column;width:100%;border-top:1px solid var(--border-color03);} .partnership_card .feature_list li{display: flex;align-items: flex-start;gap:var(--row-gap20);width:100%;padding:var(--row-gap20) 0;border-bottom:1px solid var(--border-color01);} .partnership_card .feature_list .ico{flex-shrink:0;width:clamp(40px, 5vw, 50px);height:clamp(40px, 5vw, 50px);border-radius:var(--radius-10);} .partnership_card.c01 .feature_list .ico{background:var(--point-color07);} .partnership_card.c02 .feature_list .ico{background:var(--point-color12);} .partnership_card.c03 .feature_list .ico{background:var(--point-color13);} .partnership_card.c04 .feature_list .ico{background:var(--point-color08);} .partnership_card.c05 .feature_list .ico{background:var(--point-color16);} .partnership_card.c06 .feature_list .ico{background:var(--point-color19);} .partnership_card .feature_list .txt{flex:1 1 0;min-width:0;display: flex;flex-direction:column;gap:4px;padding:0;} .partnership_card .feature_list .txt strong{font-size:var(--text-20);color:var(--point-color04);font-weight:600;} .partnership_card .feature_list .txt p{font-size:var(--text-17);color:var(--black-color05);font-weight:400;line-height:1.6;} .partnership_card .tag_list{display: flex;align-items: center;gap:var(--row-gap10);flex-wrap:wrap;} .partnership_card .tag_list > span{display: inline-flex;align-items: center;gap:var(--row-gap10);padding:9px 24px;border-radius:100px;color:var(--black-color01);font-size:var(--text-17);font-weight:500;} .partnership_card .tag_list .ico{position: relative;flex-shrink:0;width:15px;height:12px;} .partnership_card .tag_list .ico:after{content:"";position: absolute;left:3px;top:-2px;width:7px;height:13px;border:solid;border-width:0 2.5px 2.5px 0;transform:rotate(45deg);} .partnership_card.c01 .tag_list > span{background:#f5f7fb;} .partnership_card.c01 .tag_list .ico:after{border-color:var(--point-color07);} .partnership_card.c02 .tag_list > span{background:#f5fbf9;} .partnership_card.c02 .tag_list .ico:after{border-color:var(--point-color12);} .partnership_card.c03 .tag_list > span{background:#fdf6ec;} .partnership_card.c03 .tag_list .ico:after{border-color:var(--point-color13);} .partnership_card.c04 .tag_list > span{background:#f6f4fc;} .partnership_card.c04 .tag_list .ico:after{border-color:var(--point-color08);} .partnership_card.c05 .tag_list > span{background:#eff7fd;} .partnership_card.c05 .tag_list .ico:after{border-color:var(--point-color16);} .partnership_card.c06 .tag_list > span{background:#f2f2f4;} .partnership_card.c06 .tag_list .ico:after{border-color:var(--point-color19);} @media (max-width:1023px){ .partnership_card, .partnership_card.reverse{flex-direction:column;} .partnership_card .thumb{height:clamp(280px, 40vw, 400px);width:100%;} .partnership_card .txt{padding:var(--row-gap40) var(--row-gap30);width:100%;} } /*─────────────────────────────────────────────────────────── 입사안내 (recruit) ───────────────────────────────────────────────────────────*/ /*concern — 신입/경력 설계사 고민 매칭*/ .concern_wrapper .concern_list{display: flex;flex-direction:column;gap:var(--row-gap30);width:100%;margin-top:var(--row-gap60);} .concern_panel{display: flex;flex-direction:column;gap:var(--row-gap30);width:100%;padding:var(--row-gap40);border-radius:var(--radius-20);box-shadow:var(--shadow-04);} .concern_panel .head{display: flex;align-items: center;gap:var(--row-gap30);} .concern_panel .head .ico{flex-shrink:0;display: flex;align-items: center;justify-content: center;width:clamp(70px, 8vw, 98px);height:clamp(70px, 8vw, 98px);border-radius:100%;color:var(--point-white);} .concern_panel .head .txt{display: flex;flex-direction:column;gap:4px;} .concern_panel .head .txt .label{font-size:var(--text-22);color:var(--black-color03);font-weight:400;} .concern_panel .head .txt strong{font-size:var(--text-34);color:var(--point-color04);font-weight:700;} .concern_panel.blue .head .ico{background:var(--point-color16);} .concern_panel.green .head .ico{background:var(--point-color12);} .concern_panel .qna_list{display: grid;grid-template-columns:repeat(2, 1fr);gap:var(--row-gap20);width:100%;} .concern_panel .qna_list li{padding:clamp(14px, 2vw, 24px);border-radius:var(--radius-10);} .concern_panel .qna_list li .txt{display: flex;flex-direction:column;gap:var(--row-gap10);} .concern_panel .qna_list li .txt strong{display: flex;align-items:flex-start;gap:var(--row-gap10);font-size:var(--text-24);color:var(--black-color03);font-weight:600;line-height:1.4;} .concern_panel .qna_list li .txt strong .ico{position: relative;flex-shrink:0;width:16px;height:16px;display: flex;align-items: center;justify-content: center;translate:0 clamp(5px, 0.7vw, 9px);} .concern_panel .qna_list li .txt strong .ico:after{content:"";width:8px;height:15px;border:solid;border-width:0 3px 3px 0;transform:rotate(45deg);display: inline-block;translate:0 -2px;} .concern_panel .qna_list li .txt p{font-size:var(--text-18);color:var(--black-color03);font-weight:400;line-height:1.6;} .concern_panel.blue .qna_list li{background:var(--point-color18);} .concern_panel.blue .qna_list li .txt strong .ico:after{border-color:var(--point-color16);} .concern_panel.green .qna_list li{background:rgba(0, 168, 107, 0.08);} .concern_panel.green .qna_list li .txt strong .ico:after{border-color:var(--point-color12);} @media (max-width:1023px){ .concern_panel{padding:var(--row-gap30) var(--row-gap20);} .concern_panel .qna_list{grid-template-columns:1fr;} } @media (max-width:640px){ .concern_panel .qna_list li .txt strong .ico:after{width:7px;height:13px;} } /*support — 신인활동지원비*/ .newcomer_support_wrapper .newcomer_support_inner > .process_cards{margin-top:var(--row-gap40);} .support_highlight{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap20);width:100%;margin-top:var(--row-gap60);padding:var(--row-gap60) var(--row-gap30);border-radius:var(--radius-10);background:var(--point-grad03);text-align:center;} .support_highlight .badge{display: inline-flex;align-items: center;padding:5px 16px;border-radius:100px;background:var(--point-grad02);color:var(--point-color04);font-size:var(--text-20);font-weight:600;} .support_highlight .amount{display: flex;align-items:center;justify-content: center;flex-wrap:wrap;gap:var(--row-gap20);color:var(--point-white);} .support_highlight .amount .pre{font-size:var(--text-30);font-weight:600;font-family:var(--font-type02);} .support_highlight .amount strong{font-size:var(--text-56);font-weight:700;background:var(--point-grad02);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-family:var(--font-type02);} .support_highlight .note{font-size:var(--text-20);color:var(--point-white);font-weight:400;font-family:var(--font-type02);} .process_cards.steps{align-items: stretch;} .process_cards.steps .process_card{position: relative;overflow:visible;} .process_cards.steps .arrow{position: absolute;top:50%;right:calc(var(--col-gap25) - clamp(40px, 4vw, 50px) - 10px);width:clamp(40px, 5vw, 50px);height:clamp(40px, 5vw, 50px);border-radius:100%;background:var(--point-color04);translate:0 -50%;z-index:2;} .process_cards.steps .arrow:after{content:"";position: absolute;left:calc(50% - 2px);top:calc(50% - 6px);width:0;height:0;border-style:solid;border-width:6px 0 6px 9px;border-color:transparent transparent transparent var(--point-white);} .newcomer_support_wrapper .process_card{padding:var(--row-gap50) clamp(20px, 3vw, 40px);gap:var(--row-gap20);} .newcomer_support_wrapper .process_card .card_tit{padding:0 0 var(--row-gap30);border-bottom:1px solid var(--border-color01);background:var(--trans-color);gap:var(--row-gap10);} .newcomer_support_wrapper .process_card .step{color:var(--point-white);margin-bottom: var(--row-gap10);} .newcomer_support_wrapper .process_card .card_tit strong{font-size:var(--text-32);color:var(--black-color01);} .newcomer_support_wrapper .process_card .card_tit p{font-size:var(--text-20);color:var(--black-color03);} .newcomer_support_wrapper .process_card.c01 .step{background:var(--point-color07);} .newcomer_support_wrapper .process_card.c02 .step{background:var(--point-color12);} .newcomer_support_wrapper .process_card.c03 .step{background:var(--point-color13);} .newcomer_support_wrapper .process_card.c04 .step{background:var(--point-color08);} .process_card .stat_body{display: flex;flex-direction:column;align-items: center;gap:6px;width:100%;padding:var(--row-gap30) clamp(20px, 3vw, 30px);text-align:center;} .process_card .stat_body strong{font-size:var(--text-30);font-weight:700;font-family:var(--font-type02);} .process_card .stat_body p{font-size:var(--text-16);color:var(--black-color06);font-weight:400;} .process_card.c01 .stat_body strong{color:var(--point-color07);} .process_card.c02 .stat_body strong{color:var(--point-color12);} .process_card.c03 .stat_body strong{color:var(--point-color13);} .process_card.c04 .stat_body strong{color:var(--point-color08);} .newcomer_support_wrapper .process_card .stat_body{padding:0;} .newcomer_support_wrapper .process_card .stat_body strong{font-size:var(--text-36);} .newcomer_support_wrapper .process_card .stat_body p{font-size:var(--text-18);} @media (max-width:1023px){ .process_cards.steps{flex-direction:column;} .process_cards.steps .arrow{top:auto;right:auto;bottom:-30px;left:50%;rotate:90deg;translate:-50% 0;} .support_highlight .amount strong{font-size:var(--text-36);} } /*faq*/ .faq_wrapper .main_title{margin-bottom:var(--row-gap60);} /*─────────────────────────────────────────────────────────── 게시판 ───────────────────────────────────────────────────────────*/ /*page head — 게시판 상단 타이틀(제목/설명)*/ #wrap .sub_board .page_head{display: flex;flex-direction:column;align-items: center;gap:var(--row-gap20);text-align:center;margin-bottom:var(--row-gap60);} #wrap .sub_board .page-tit{font-size:var(--text-56);color:var(--point-color04);font-weight:700;line-height:1.3;letter-spacing:-0.03em;} #wrap .sub_board .page-desc{font-size:var(--text-20);color:var(--black-color05);font-weight:400;line-height:1.7;} /*input*/ #wrap [type="checkbox"]{display: inline-flex;align-items: center;justify-content: center;width: clamp(22px, 3.1vw, 24px);height: clamp(22px, 3.1vw, 24px);border: 1px solid var(--border-color01);flex-shrink: 0;cursor: pointer;appearance:none;border-radius:var(--radius-04);background:var(--point-white);} #wrap [type="checkbox"]::before{display: inline-flex;content:'';width: clamp(10px, 1.7vw, 12px);aspect-ratio: auto 1.33;background: url('/images/ico_chk.svg') no-repeat center / 100% auto;filter: var(--filter-black) opacity(0.2);} #wrap [type="checkbox"]:checked{border-color: var(--point-color01);background: var(--point-color01);} #wrap [type="checkbox"]:checked:before{filter: var(--filter-white);} #wrap label:has([type="checkbox"]){display:inline-flex;align-items: flex-start;gap: 10px;font-size: var(--text-18);font-weight: 500;color: var(--black-color03);line-height: clamp(22px, 3.1vw, 25px);cursor: pointer;} #wrap label:has([type="checkbox"]) em{font-weight: 600; color: var(--point-red02); display: contents;} #wrap :is(input[type="text"], input[type="password"], input[type="number"], input[type="date"], input[type="email"], input[type="tel"], select, textarea) { height:clamp(40px, 5vw, 50px); line-height: 1.5; width: 100%; border:1px solid var(--border-color01);color: var(--black-color03); font-weight: 400; font-size: var(--text-18); font-family: var(--font-type02); padding: 0 clamp(10px, 2vw, 20px); text-indent: 0; margin: 0;vertical-align: middle; text-align: left; outline: 0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;border-radius:var(--radius-10)} #wrap .bbs_write textarea {height:clamp(150px, 20vw, 200px); resize: none; padding:var(--row-gap20);} #wrap select{appearance:none;-webkit-appearance:none;background:var(--point-white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23888888' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right clamp(10px, 2vw, 20px) center / 14px 8px;padding-right:clamp(30px, 4vw, 44px);cursor:pointer;} #wrap :is(input[type="text"], input[type="password"], input[type="number"], input[type="date"], input[type="email"], input[type="tel"], select, textarea)::placeholder { color: var(--black-color08); font-weight: 400; } #wrap :is(input[type="text"], input[type="password"], input[type="number"], input[type="date"], input[type="email"], input[type="tel"], select, textarea):focus {background-color: var(--point-white); border-color: var(--point-color01);} #wrap input[readonly]{background:var(--gray-bg05);color:var(--black-color08);} /* === search === */ #wrap .search_wrap{margin-bottom:var(--row-gap40);} #wrap .search_wrap .inp_box {display: flex; justify-content:flex-end; gap: 10px; width: 100%;} #wrap .search_wrap .inp_box [type="text"]{width: 360px;} #wrap .search_wrap .inp_box button{width:clamp(40px, 5vw, 50px);aspect-ratio:auto 1;background:var(--black-color01) url('/images/ico_search.svg') no-repeat center / clamp(16px, 2vw, 22px) auto;box-sizing:border-box;font-size:0;border-radius:var(--radius-10);} /* === paging === */ #wrap .paging {position: absolute; left: 50%; top: 50%; translate: -50% -50%; display: flex; justify-content: center; align-items: center; width: max-content; text-align:center;} #wrap .paging span {display:inline-block;vertical-align:top;} #wrap .paging a {box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;font-size:var(--text-17);font-weight: 500;color:var(--black-color08);padding:0;border:0;box-sizing:border-box;width:clamp(30px, 4vw, 40px);height:clamp(30px, 4vw, 40px);line-height:1;min-width:auto;text-align:center;vertical-align:top;margin:0 5px;} #wrap .paging :is(.on a, a.on){background:var(--black-color01);color:var(--point-white);font-weight:600;} #wrap .paging .arrow a {font-size:0;width:clamp(20px, 3vw, 30px); background:no-repeat center; } #wrap .paging .arrow.first a {background-image:url("/images/paging_first.svg");} #wrap .paging .arrow.prev a {background-image:url("/images/paging_prev.svg"); margin-right: 10px;} #wrap .paging .arrow.next a {background-image:url("/images/paging_prev.svg"); margin-left: 10px;scale:-1 -1;} #wrap .paging .arrow.last a {background-image:url("/images/paging_first.svg");scale:-1 -1;} @media (max-width:860px) { #wrap .paging {position: relative; left: inherit; top: inherit; translate: 0; width: 100%;} #wrap .paging + .btn_wrap {margin-top: var(--row-gap40);} } /* === list === */ /* 일반 */ #wrap .nodata {width: 100% !important; text-align:center !important; min-height: clamp(140px, 14.58vw, 280px);} #wrap .bbs_table {position: relative; width: 100%; table-layout: fixed; font-size: var(--text-20); border-top: 1px solid var(--black-color01);} #wrap .bbs_table :where(th, td){line-height: 1.3;border-bottom: 1px solid var(--border-color01);padding: 26px 10px;text-align: center;} #wrap .bbs_table th{font-size:100%; font-weight: 500; color: var(--black-color01);} #wrap .bbs_table td{font-size:90%;font-weight: 400; color: var(--black-color08);} #wrap .bbs_table td.left{font-size:100%;text-align: left; padding-inline: var(--row-gap20); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break: break-all;color:var(--black-color03);font-weight:400;} #wrap .bbs_table .notice td.left{font-weight:500;} #wrap .bbs_table .notice .tag{display: inline-flex;align-items: center;justify-content: center;box-sizing:border-box;font-size:var(--text-16);color:var(--point-white);font-weight:600;background:var(--point-color01);padding:10px 20px 9px;line-height:1;} #wrap .bbs_table .for_t {display: none;} /* 말머리 필터 탭 */ #wrap .bl-prefixes{display:flex;flex-wrap:wrap;gap:var(--row-gap10) var(--col-gap17);margin-bottom:var(--row-gap20);} #wrap .bl-prefix-tab{display:inline-flex;align-items:center;justify-content:center;padding:var(--row-gap10) var(--col-gap22);border-radius:999px;border:1px solid var(--border-color02);background:var(--point-white);color:var(--black-color06);font-size:var(--text-16);font-weight:600;text-decoration:none;transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease;} #wrap .bl-prefix-tab.is-active{background:var(--point-color01);border-color:var(--point-color01);color:var(--point-white);} @media (hover:hover) and (pointer:fine) { #wrap .bl-prefix-tab:not(.is-active):hover{border-color:var(--point-color01);color:var(--point-color01);} } /* 하위 카테고리 탭 (3차 메뉴가 있는 게시판) */ #wrap .sp-type-nav{display:flex;flex-wrap:wrap;gap:var(--row-gap10) var(--col-gap17);margin-bottom:var(--row-gap30);} #wrap .sp-type-nav a{display:inline-flex;align-items:center;justify-content:center;padding:var(--row-gap10) var(--col-gap22);border-radius:999px;border:1px solid var(--border-color02);background:var(--point-white);color:var(--black-color06);font-size:var(--text-18);font-weight:600;text-decoration:none;transition:background 0.2s ease, color 0.2s ease, border-color 0.2s ease;} #wrap .sp-type-nav a.is-current{background:var(--point-color04);border-color:var(--point-color04);color:var(--point-white);} @media (hover:hover) and (pointer:fine) { #wrap .sp-type-nav a:not(.is-current):hover{border-color:var(--point-color04);color:var(--point-color04);} } /* 목록 공용 — 빈 목록 안내 · 글쓰기 버튼 (gallery/normal/video 등 전체 리스트 뷰 공용) */ #wrap .bl-empty{padding:var(--row-gap70) 0;text-align:center;color:var(--black-color08);font-size:var(--text-18);} #wrap .bl-actions{margin-top:var(--row-gap30);text-align:right;} #wrap .bl-btn{display:inline-flex;align-items:center;justify-content:center;height:clamp(46px, 5vw, 54px);padding-inline:clamp(20px, 3vw, 28px);border-radius:var(--radius-10);font-size:var(--text-18);font-weight:600;transition:background 0.3s;} #wrap .bl-btn--write{background:var(--point-color04);color:var(--point-white);} @media (hover:hover) and (pointer:fine) { #wrap .bl-btn--write:hover{background:var(--point-color01);} } /* over */ @media (hover:hover) and (pointer:fine) { #wrap .bbs_table tbody tr:not(:has(.nodata)):hover {background: var(--gray-bg01);} } @media (max-width:1023px) { #wrap .bbs_table .notice .tag{padding:6px 14px 5px;} } @media (max-width:860px) { #wrap .bbs_table{display: block;} #wrap .bbs_table thead{display: none;} #wrap .bbs_table :where(tbody, tr, th, td){display: block; width: 100%; border:0; padding:0; text-align: left;} #wrap .bbs_table tr{padding:var(--row-gap25);display: flex;flex-wrap: wrap;gap: var(--row-gap10) var(--row-gap20);border-bottom: 1px solid var(--border-color01);} #wrap .bbs_table td{width: auto;} #wrap .bbs_table td.left{width: 100%; padding: 0;} #wrap .bbs_table td.num{display: none;} #wrap .bbs_table .for_t {display: inline-block;} } /*gallery*/ .sub_gallery{display:grid;gap:var(--row-gap20);grid:auto / repeat(4, 1fr);} .sub_gallery li{border-radius:var(--radius-10);overflow:hidden;background:var(--point-white);box-shadow:var(--shadow-03);} .sub_gallery li a{display: flex;flex-direction: column;} .sub_gallery li .thumb{aspect-ratio:auto 1.5;} .sub_gallery li .info{padding:clamp(15px, 2vw, 20px) clamp(12px, 2.4vw, 24px);display: flex;flex-direction: column;gap:var(--row-gap10);align-items: flex-start;} .sub_gallery li .info .notice{display: inline-flex;align-items: center;justify-content: center;box-sizing:border-box;font-size:var(--text-16);color:var(--point-white);font-weight:600;background:var(--point-color01);padding:7px 12px;line-height:1;border-radius:var(--radius-10);} .sub_gallery li .info .title{font-size:var(--text-22);color:var(--black-color02);font-weight:500;line-height:1.5;text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:2;} .sub_gallery li .info .cf_sub{font-size:var(--text-16);color:var(--point-color03);font-weight:600;} .sub_gallery li .info .content{font-size:var(--text-18);color:var(--black-color04);font-weight:400;line-height:1.6;text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp:1;} .sub_gallery li .info .date{font-size:var(--text-17);color:var(--black-color08);font-weight:400;display: block;margin-top:clamp(8px, 1.4vw, 14px);} .sub_gallery li .thumb .no_img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--gray-bg05);color:var(--black-color08);font-size:var(--text-16);text-align:center;} .sub_gallery li .thumb .no_img.secret{background:var(--point-color11);color:rgba(255,255,255,0.6);} @media (max-width:1023px) { .sub_gallery{grid:auto / repeat(3, 1fr);} } @media (max-width:640px) { .sub_gallery{grid:auto / repeat(2, 1fr);} } @media (max-width:479px) { .sub_gallery{grid:auto / repeat(1, 1fr);} } /* === view === */ #wrap .bbs_view .view_tit{display: flex;flex-direction: column;gap:var(--row-gap30);box-sizing:border-box;padding-bottom:var(--row-gap40);border-bottom:1px solid var(--border-color01);align-items: flex-start;} #wrap .bbs_view .view_tit h4{display: flex;align-items:center;gap:var(--row-gap20);} #wrap .bbs_view .view_tit h4 .board-cate{margin:0;} #wrap .bbs_view .view_tit h4 strong{color:var(--black-color03);font-weight:600;line-height:1.4;font-size:var(--text-34);} #wrap .bbs_view .view_tit .name_box{display: flex;align-items: center;gap:var(--row-gap40);} #wrap .bbs_view .view_tit .name_box dl{display: flex;align-items: center;gap:clamp(10px, 1.2vw, 16px);position: relative;} #wrap .bbs_view .view_tit .name_box dl + dl:before{width:1px;height:clamp(8px, 1vw, 12px);content:"";background:var(--border-color01);display: inline-block;position: absolute;left:-20px;top:50%;translate:0 -50%;} #wrap .bbs_view .view_tit .name_box :where(dt, dd) {font-size:var(--text-18);font-weight:500;font-family:var(--font-type03);} #wrap .bbs_view .view_tit .name_box dt{color:var(--black-color06);} #wrap .bbs_view .view_tit .name_box dd{color:var(--black-color08);} #wrap .bbs_view div.view_cont{border-bottom:1px solid var(--border-color01);padding:clamp(25px, 4vw, 40px) 0;text-align: center;} #wrap .bbs_view .extra_editor_wrap{display: flex;box-sizing:border-box;border-radius:var(--radius-10);background:var(--gray-bg01);align-items: center;padding:clamp(12px, 2.2vw, 27px) 0;border:none;margin-top:40px;} #wrap .bbs_view .extra_editor_wrap h5 {text-align: center;font-size:var(--text-18);color:var(--black-color03);font-weight:500;width:clamp(100px, 15vw, 180px);flex-shrink:0;background:none;} #wrap .bbs_view .extra_editor_wrap > div.extra_cont{box-sizing:border-box;padding-inline:var(--row-gap60) clamp(12px, 3vw, 30px);position: relative;} #wrap .bbs_view .extra_editor_wrap > div.extra_cont:before{width:1px;height:clamp(8px, 1vw, 12px);content:"";background:var(--border-color01);display: inline-block;position: absolute;left:0;top:50%;translate:0 -50%;} #wrap .bbs_view .extra_editor_wrap > div.extra_cont a{font-size:var(--text-18);color:var(--black-color06) !important;font-weight:400;} #wrap .view_btn {position: relative; margin-top: var(--row-gap60);text-align: center;} /* === write === */ #wrap .bbs_write { box-sizing: border-box; display: flex; flex-direction: column; flex-wrap: wrap; gap: var(--row-gap30); padding-block: var(--row-gap40); border-top: 1px solid var(--black-color00); border-bottom: 1px solid var(--border-color01); } #wrap .bbs_write .line2 { display:grid; grid-template-columns:var(--grid-array02); gap: var(--row-gap60); } #wrap .bbs_write dl { display: flex; flex-wrap: wrap; width: 100%; align-items: center; box-sizing: border-box; } #wrap .bbs_write dl dt { width: clamp(120px, 15vw, 150px); box-sizing: border-box; padding-right:var(--row-gap15);color: var(--black-color03); font-weight: 500; font-size: var(--text-20); letter-spacing: -0.03em; } #wrap .bbs_write dl dd { width: calc(100% - clamp(120px, 15vw, 150px)); display: flex; align-items: center; gap: 10px; } #wrap .req .require_dot { color: var(--point-color03); } #wrap dl dt:not(.req) .require_dot{display: none;} #wrap .bbs_write .bbs_file dd{flex-direction: column;align-items: flex-start;} #wrap .bbs_file input[type="file"]{display: none;} #wrap .bbs_file .file_box{display: flex;align-items: center;gap:var(--row-gap10);width:100%;} #wrap .bbs_file .file_name_view{box-sizing:border-box;flex:1 1 0;min-width:0;height:clamp(40px, 5vw, 50px);display:flex;align-items:center;border:1px solid var(--border-color01);border-radius:var(--radius-10);padding-inline:clamp(10px, 2vw, 20px);color:var(--black-color08);font-size:var(--text-18);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} #wrap .bbs_file .file_btn{display: inline-flex;flex-shrink:0;align-items: center;justify-content: center;height:clamp(40px, 5vw, 50px);border:1px solid var(--black-color03);border-radius:var(--radius-10);font-size:var(--text-18);color:var(--black-color03);font-weight:500;cursor:pointer;width:clamp(100px, 13vw, 130px);} #wrap .bbs_file .bf-file-wrap{display: none;} /* === 추가 필드 옵션형 UI(라디오/체크박스/파일) — 마크업 자체는 다른 필드와 동일한 dl/dt/dd 사용 */ #wrap .bbs_write .bf-options{display:flex;flex-wrap:wrap;gap:var(--row-gap15);} #wrap .bbs_write .bf-options label{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-18);color:var(--black-color05);cursor:pointer;} #wrap .bbs_write .bf-help{font-size:var(--text-14);color:var(--black-color08);} #wrap .bbs_write .bf-existing-file{display:flex;align-items:center;gap:8px;margin-bottom:6px;} #wrap .bbs_write .btn-cf-remove{background:none;border:0;color:var(--point-color19);font-weight:600;cursor:pointer;} #wrap .captcha_wrap {display: flex; gap: 10px;width: 200px;} #wrap .captcha input[type="text"] {width: calc(100% - 180px);} #wrap .db-captcha-img {width:140px;} #wrap .db-captcha-refresh {display: flex; justify-content: center; align-items: center; width:clamp(40px, 5vw, 50px); height:clamp(40px, 5vw, 50px);border-radius:var(--radius-10);border:1px solid var(--black-color03);background:url('/images/ico_reset.svg')no-repeat center / auto clamp(15px, 1.7vw, 19px);} #wrap .policy_wrap {display:flex;align-items:center;justify-content:space-between;gap:var(--row-gap20);width:100%;margin-top:var(--row-gap40);padding:var(--row-gap15) var(--row-gap25);border-radius:var(--radius-10);background:var(--gray-bg05);} #wrap .policy_wrap .chk_cont{display:flex;flex-wrap:wrap;gap:6px;} #wrap .policy_wrap label{display:flex;align-items:center;gap:var(--row-gap10);font-size:var(--text-18);color:var(--black-color03);font-weight:500;} #wrap .policy_wrap label em{font-style:normal;color:var(--point-color04);} #wrap .policy_wrap .chk_desc{font-size:var(--text-18);color:var(--black-color06);font-weight:400;padding-left:clamp(6px, 1vw, 14px);} #wrap .policy_wrap .policy_more{flex-shrink:0;font-size:var(--text-16);color:var(--black-color08);font-weight:500;text-decoration: underline; text-underline-offset: 4px;} @media (max-width:1023px) { #wrap .captcha dd {flex-wrap: wrap;} #wrap .captcha input[type="text"] {width: 100%;} } @media (max-width:860px) { #wrap .captcha_wrap {width: 151px; height: 50px; padding: 6px; gap: 6px;} #wrap .db-captcha-refresh {width: 38px; height: 38px;} #wrap .bbs_write .line2 {gap: var(--row-gap30); grid-template-columns: var(--grid-array01);} #wrap .bbs_write dl dt { width: clamp(120px, 17.58vw, 180px);} #wrap .bbs_write dl dd { width: calc(100% - clamp(120px, 17.58vw, 180px));} #wrap .policy_wrap{flex-direction:column;align-items:flex-start;} } @media (max-width:479px) { #wrap .bbs_write {gap: var(--row-gap35);} #wrap .bbs_write dl {align-items: flex-start; flex-direction: column; gap: 10px;} #wrap .bbs_write dl dt, #wrap .bbs_write dl dd {width: 100%;} #wrap .policy_wrap .chk_desc{padding-left:0;} } /* === complete === */ #wrap .complete_box {width:100%;box-sizing:border-box;border:1px solid var(--border-color01);text-align: center;padding:var(--row-gap60);border-radius:var(--radius-15);} #wrap .complete_box .chk_ico{width: var(--row-gap70); height: var(--row-gap70); margin: 0 auto; background-color: var(--gray-bg01);} #wrap .complete_box .chk_ico .text-green-600 {color: var(--point-color01);} #wrap .complete_box h4 {font-size:var(--text-28);color:var(--black-color03);font-weight:600;margin-top: var(--row-gap30);} #wrap .complete_box p {font-size:var(--text-20);color:var(--black-color05);margin-top: var(--row-gap20);} #wrap .complete_box .view_btn {margin-top: var(--row-gap50);} @media (max-width:1023px) { #wrap .complete_box .chk_ico {width: var(--row-gap95); height: var(--row-gap95);} } /*─────────────────────────────────────────────────────────── 2026 신인 스카우트 랜딩 (/page/2026_recruit) — 랜딩페이지 예시05 전용 컴포넌트. 다른 페이지에 영향 없도록 상위 래퍼(.trust_wrapper / .review_wrapper / .apply_wrapper / .recruit_sticky)에 종속시킴. ───────────────────────────────────────────────────────────*/ .sv_recruit2026 .pkg_box{box-sizing:border-box;display:flex;flex-direction:column;gap:var(--row-gap25);width:100%;max-width:860px;padding:clamp(24px, 2.6vw, 40px);background:var(--point-white);border-radius:var(--radius-20);box-shadow:var(--shadow-01);} .sv_recruit2026 .pkg_box .pkg_head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--row-gap15);padding-bottom:var(--row-gap20);border-bottom:1px solid var(--border-color01);} .sv_recruit2026 .pkg_box .pkg_head strong{display:flex;align-items:center;gap:var(--row-gap10);font-size:var(--text-26);color:var(--point-color04);font-weight:700;line-height:1.3;} .sv_recruit2026 .pkg_box .pkg_head strong .ico{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:clamp(22px, 2.4vw, 28px);height:clamp(22px, 2.4vw, 28px);color:var(--point-color16);} .sv_recruit2026 .pkg_box .pkg_head strong .ico svg{width:100%;height:100%;} .sv_recruit2026 .pkg_box .pkg_head .badge{flex-shrink:0;display:inline-flex;align-items:center;padding:5px 14px;border-radius:100px;background:rgba(0, 168, 107, 0.1);color:var(--point-color12);font-size:var(--text-16);font-weight:700;} .sv_recruit2026 .pkg_box .pkg_list{display:flex;flex-direction:column;gap:var(--row-gap15);width:100%;} .sv_recruit2026 .pkg_box .pkg_list li{display:flex;align-items:center;gap:var(--row-gap20);padding:clamp(14px, 1.6vw, 20px);border-radius:var(--radius-10);background:var(--gray-bg05);transition:all 0.2s;} .sv_recruit2026 .pkg_box .pkg_list li:hover{background:var(--point-color18);translate:4px 0;} .sv_recruit2026 .pkg_box .pkg_list .ico{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:clamp(44px, 4vw, 56px);height:clamp(44px, 4vw, 56px);border-radius:var(--radius-10);background:var(--point-white);color:var(--point-color16);box-shadow:var(--shadow-04);} .sv_recruit2026 .pkg_box .pkg_list .ico svg{width:52%;height:52%;} .sv_recruit2026 .pkg_box .pkg_list .txt{display:flex;flex-direction:column;gap:4px;min-width:0;} .sv_recruit2026 .pkg_box .pkg_list .txt strong{font-size:var(--text-20);color:var(--black-color01);font-weight:700;line-height:1.4;word-break:keep-all;} .sv_recruit2026 .pkg_box .pkg_list .txt span{font-size:var(--text-16);color:var(--black-color06);font-weight:400;line-height:1.5;word-break:keep-all;} /*voucher — 1,200만원 지급 내역 (신인활동지원비 하위 목록)*/ .newcomer_support_wrapper .voucher_list{display:flex;flex-direction:column;width:100%;max-width:860px;margin:var(--row-gap40) auto 0;padding:clamp(20px, 2.4vw, 36px) clamp(20px, 2.8vw, 44px);background:var(--point-white);border-radius:var(--radius-20);box-shadow:var(--shadow-04);} .newcomer_support_wrapper .voucher_list li{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--row-gap10);padding:clamp(16px, 1.8vw, 24px) 0;border-bottom:1px dashed var(--border-color01);} .newcomer_support_wrapper .voucher_list li:last-child{border-bottom:0;} .newcomer_support_wrapper .voucher_list li span{font-size:var(--text-20);color:var(--black-color05);font-weight:500;line-height:1.5;word-break:keep-all;} .newcomer_support_wrapper .voucher_list li strong{flex-shrink:0;font-size:var(--text-28);color:var(--point-color04);font-weight:700;font-family:var(--font-type02);} /*review — 먼저 시작한 동료들의 후기*/ .review_wrapper .review_inner{display:flex;flex-direction:column;align-items:center;gap:var(--row-gap60);} .review_wrapper .review_cards{display:flex;align-items:stretch;gap:var(--col-gap40);width:100%;} .review_wrapper .review_card{box-sizing:border-box;flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:space-between;gap:var(--row-gap25);padding:var(--row-gap40);background:var(--point-white);border-radius:var(--radius-20);box-shadow:var(--shadow-04);} .review_wrapper .review_card .r_top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--row-gap15);} .review_wrapper .review_card .r_who{display:flex;align-items:center;gap:var(--row-gap15);min-width:0;} .review_wrapper .review_card .r_who .thumb{flex-shrink:0;width:clamp(52px, 5vw, 64px);height:clamp(52px, 5vw, 64px);border-radius:100%;overflow:hidden;border:2px solid var(--point-color18);background:var(--gray-bg05);} .review_wrapper .review_card .r_who .thumb img{width:100%;height:100%;object-fit:cover;} .review_wrapper .review_card .r_who .txt{display:flex;flex-direction:column;gap:4px;min-width:0;} .review_wrapper .review_card .r_who .txt strong{font-size:var(--text-22);color:var(--point-color04);font-weight:700;line-height:1.3;word-break:keep-all;} .review_wrapper .review_card .r_who .txt span{font-size:var(--text-16);color:var(--black-color06);font-weight:400;} .review_wrapper .review_card .r_badge{flex-shrink:0;display:inline-flex;align-items:center;padding:5px 14px;border-radius:100px;background:var(--point-color18);color:var(--point-color16);font-size:var(--text-16);font-weight:700;} .review_wrapper .review_card .r_text{font-size:var(--text-18);color:var(--black-color05);font-weight:400;line-height:1.75;word-break:keep-all;} .review_wrapper .review_card .r_text strong{color:var(--point-color04);font-weight:700;} .review_wrapper .review_card .r_point{display:flex;align-items:center;gap:var(--row-gap10);padding-top:var(--row-gap20);border-top:1px solid var(--border-color03);font-size:var(--text-18);color:var(--point-color12);font-weight:700;line-height:1.4;word-break:keep-all;} .review_wrapper .review_card .r_point .ico{position:relative;flex-shrink:0;width:18px;height:18px;border-radius:100%;background:var(--point-color12);} .review_wrapper .review_card .r_point .ico:after{content:"";position:absolute;left:5px;top:4px;width:5px;height:9px;border:solid var(--point-white);border-width:0 2px 2px 0;transform:rotate(45deg);} /*apply — 최종 전환 폼(어두운 카드 + 내부 흰 폼)*/ .apply_wrapper .apply_inner{display:flex;flex-direction:column;align-items:center;} .apply_wrapper .apply_box{box-sizing:border-box;width:100%;padding:clamp(32px, 4vw, 60px) clamp(20px, 3vw, 44px);background:var(--point-grad01);border-radius:var(--radius-30);box-shadow:var(--shadow-01);} .apply_wrapper .apply_box .form_head{display:flex;flex-direction:column;align-items:center;gap:var(--row-gap15);margin-bottom:var(--row-gap40);text-align:center;} .apply_wrapper .apply_box .form_head .badge{display:inline-flex;align-items:center;padding:5px 16px;border-radius:100px;background:var(--point-grad02);color:var(--point-color04);font-size:var(--text-18);font-weight:700;} .apply_wrapper .apply_box .form_head h3{font-size:var(--text-44);color:var(--point-white);font-weight:700;line-height:1.3;word-break:keep-all;} .apply_wrapper .apply_box .form_head p{font-size:var(--text-20);color:rgba(255,255,255,0.75);font-weight:400;line-height:1.6;word-break:keep-all;} .apply_wrapper .apply_box .form_body{box-sizing:border-box;width:100%;padding:clamp(24px, 3vw, 44px) clamp(18px, 2.4vw, 36px);background:var(--point-white);border-radius:var(--radius-20);} .apply_wrapper .apply_box .form_body .bbs_write{border-top:0;border-bottom:0;padding-block:0;} .apply_wrapper .apply_box .form_notice{box-sizing:border-box;display:flex;flex-direction:column;gap:6px;width:100%;margin-top:var(--row-gap25);padding:var(--row-gap20) var(--row-gap25);border:1px solid var(--border-color01);border-radius:var(--radius-10);background:var(--gray-bg05);} .apply_wrapper .apply_box .form_notice p{font-size:var(--text-16);color:var(--black-color06);font-weight:400;line-height:1.7;word-break:keep-all;} .apply_wrapper .apply_box .form_notice p strong{color:var(--point-color19);font-weight:600;} .apply_wrapper .apply_box .form_btn{width:100%;margin-top:var(--row-gap30);} .apply_wrapper .apply_box .form_btn button{display:flex;align-items:center;justify-content:center;gap:var(--row-gap10);width:100%;height:clamp(54px, 6vw, 68px);border:0;border-radius:var(--radius-10);background:var(--point-grad04);color:var(--point-color04);font-size:var(--text-22);font-weight:700;font-family:inherit;cursor:pointer;transition:all 0.25s;} .apply_wrapper .apply_box .form_btn button:hover{translate:0 -2px;box-shadow:var(--shadow-02);} .apply_wrapper .apply_box .form_msg{width:100%;margin-top:var(--row-gap15);font-size:var(--text-16);font-weight:500;line-height:1.6;text-align:center;color:var(--point-white);} /*sticky — 하단 고정 CTA 바*/ .recruit_sticky{position:fixed;left:0;right:0;bottom:0;z-index:99;display:flex;align-items:center;justify-content:center;padding:clamp(10px, 1.2vw, 14px) clamp(16px, 2vw, 24px);background:rgba(255,255,255,0.97);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--border-color01);box-shadow:0 -4px 20px rgba(0,0,0,0.08);} .recruit_sticky .sticky_inner{display:flex;align-items:center;justify-content:space-between;gap:var(--row-gap20);width:100%;max-width:1400px;} .recruit_sticky .sticky_txt{font-size:var(--text-18);color:var(--black-color03);font-weight:600;line-height:1.4;word-break:keep-all;} .recruit_sticky .sticky_txt strong{color:var(--point-color04);font-size:var(--text-24);font-weight:700;font-family:var(--font-type02);} .recruit_sticky .sticky_btn{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;height:clamp(42px, 4.4vw, 52px);padding-inline:clamp(18px, 2.2vw, 30px);border-radius:100px;background:var(--point-color04);color:var(--point-white);font-size:var(--text-18);font-weight:700;transition:all 0.2s;} .recruit_sticky .sticky_btn:hover{background:var(--point-color03);} /*스티키 바가 푸터 하단을 가리지 않도록 여백 확보*/ body.has-recruit-sticky footer{padding-bottom:clamp(74px, 8vw, 100px);} @media (max-width:1023px){ .review_wrapper .review_cards{flex-direction:column;} .sv_recruit2026 .pkg_box .pkg_list li{align-items:flex-start;} } @media (max-width:640px){ .recruit_sticky .sticky_inner{flex-direction:column;gap:10px;} .recruit_sticky .sticky_txt{text-align:center;} .recruit_sticky .sticky_btn{width:100%;} body.has-recruit-sticky footer{padding-bottom:130px;} .newcomer_support_wrapper .voucher_list li{flex-direction:column;align-items:flex-start;} } /*sticky 사용 페이지 — 우측 하단 퀵버튼(.ft_quick)이 고정 바에 가리지 않도록 올림*/ body.has-recruit-sticky .ft_quick{bottom:calc(var(--row-gap30) + clamp(70px, 7.5vw, 92px));} @media (max-width:640px){ body.has-recruit-sticky .ft_quick{bottom:calc(var(--row-gap30) + 124px);} } /*fund — 바우처 카드 (좌 총 지원 금액 / 우 지급 내역)*/ .newcomer_support_wrapper .fund_card{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,0.88fr) minmax(0,1.12fr);align-items:stretch;width:100%;margin-top:var(--row-gap60);border-radius:var(--radius-30);overflow:hidden;background:var(--point-white);box-shadow:var(--shadow-01);} .newcomer_support_wrapper .fund_card .support_highlight{height:100%;margin-top:0;justify-content:center;gap:var(--row-gap15);padding:clamp(36px, 4vw, 64px) clamp(20px, 2.6vw, 40px);border-radius:0;} .newcomer_support_wrapper .fund_card .support_highlight .amount{gap:var(--row-gap10);} .newcomer_support_wrapper .fund_card .support_highlight .amount .pre{font-size:var(--text-24);color:rgba(255,255,255,0.8);} .newcomer_support_wrapper .fund_card .support_highlight .bar{display:block;width:clamp(48px, 5vw, 72px);height:3px;margin-top:4px;border-radius:100px;background:var(--point-grad02);} .newcomer_support_wrapper .fund_card .voucher_list{max-width:none;margin:0;justify-content:center;padding:clamp(24px, 2.6vw, 44px) clamp(20px, 2.8vw, 48px);border-left:2px dashed var(--border-color01);border-radius:0;box-shadow:none;background:var(--point-white);} .newcomer_support_wrapper .fund_card .voucher_list li{gap:var(--col-gap20);} .newcomer_support_wrapper .fund_card .voucher_list li .no{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:clamp(34px, 3.2vw, 42px);height:clamp(34px, 3.2vw, 42px);border-radius:100%;background:var(--point-color15);color:var(--point-color03);font-size:var(--text-16);font-weight:700;font-family:var(--font-type02);} .newcomer_support_wrapper .fund_card .voucher_list li .tx{margin-right:auto;} /*후기 프로필 — 배너관리 연동 이미지가 원형 썸네일에 꽉 차도록*/ .review_wrapper .review_card .r_who .thumb img{width:100%;height:100%;object-fit:cover;object-position:center;} @media (max-width:1023px){ .newcomer_support_wrapper .fund_card{grid-template-columns:minmax(0,1fr);} .newcomer_support_wrapper .fund_card .voucher_list{border-left:0;border-top:2px dashed var(--border-color01);} } @media (max-width:640px){ .newcomer_support_wrapper .fund_card .voucher_list li{flex-wrap:wrap;} .newcomer_support_wrapper .fund_card .voucher_list li .tx{margin-right:0;width:calc(100% - clamp(34px, 3.2vw, 42px) - var(--col-gap20));} .newcomer_support_wrapper .fund_card .voucher_list li strong{width:100%;padding-left:calc(clamp(34px, 3.2vw, 42px) + var(--col-gap20));} } /*2026 공개채용 서브비주얼 — 이 페이지 전용(.sv_recruit2026) 다른 서브페이지와 달리 비주얼 안에 지원 패키지 카드를 동반한다. 좌: 카피+CTA / 우: pkg_box*/ .sub_visual .thumb.sv_recruit2026{height:auto;min-height:clamp(560px, 96vw, 960px);display:flex;align-items:center;padding-top:calc(clamp(65px, 11vw, 112px) + var(--row-gap40));padding-bottom:var(--row-gap80);background:var(--point-color06);} .sub_visual .thumb.sv_recruit2026 > img{position:absolute;inset:0;z-index:0;} .sub_visual .thumb.sv_recruit2026:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg, rgba(15,26,46,0.93) 0%, rgba(15,26,46,0.80) 45%, rgba(15,26,46,0.58) 100%);pointer-events:none;} .sub_visual .thumb.sv_recruit2026 .sv_scroll_wrap{z-index:2;} .sub_visual .thumb.sv_recruit2026 .sv_cont{position:static;inset:auto;translate:none;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);align-items:center;column-gap:var(--col-gap60);row-gap:var(--row-gap20);} .sub_visual .thumb.sv_recruit2026 .sv_cont > span{grid-column:1;grid-row:1;} .sub_visual .thumb.sv_recruit2026 .sv_cont h2{grid-column:1;grid-row:2;font-size:var(--text-56);word-break:keep-all;} .sub_visual .thumb.sv_recruit2026 .sv_cont h2 em{font-style:normal;color:var(--point-color03);} .sub_visual .thumb.sv_recruit2026 .sv_cont > p{grid-column:1;grid-row:3;margin-top:0;word-break:keep-all;} .sub_visual .thumb.sv_recruit2026 .sv_cont > .main_more{grid-column:1;grid-row:4;justify-self:start;margin-top:var(--row-gap20);} .sub_visual .thumb.sv_recruit2026 .sv_cont > .pkg_box{grid-column:2;grid-row:1 / span 4;align-self:center;max-width:none;} @media (max-width:1240px){ .sub_visual .thumb.sv_recruit2026 .sv_cont{grid-template-columns:minmax(0,1fr) minmax(0,450px);} .sub_visual .thumb.sv_recruit2026 .sv_cont h2{font-size:var(--text-44);} } @media (max-width:1023px){ .sub_visual .thumb.sv_recruit2026{padding-bottom:var(--row-gap60);} .sub_visual .thumb.sv_recruit2026:after{background:linear-gradient(180deg, rgba(15,26,46,0.72) 0%, rgba(15,26,46,0.94) 100%);} .sub_visual .thumb.sv_recruit2026 .sv_cont{grid-template-columns:minmax(0,1fr);row-gap:var(--row-gap25);} .sub_visual .thumb.sv_recruit2026 .sv_cont > span, .sub_visual .thumb.sv_recruit2026 .sv_cont h2, .sub_visual .thumb.sv_recruit2026 .sv_cont > p, .sub_visual .thumb.sv_recruit2026 .sv_cont > .main_more, .sub_visual .thumb.sv_recruit2026 .sv_cont > .pkg_box{grid-column:1;grid-row:auto;} .sub_visual .thumb.sv_recruit2026 .sv_cont h2{font-size:var(--text-50);} .sub_visual .thumb.sv_recruit2026 .sv_cont > .pkg_box{max-width:860px;margin-top:var(--row-gap20);} } @media (max-width:640px){ .sub_visual .thumb.sv_recruit2026 .sv_cont > .main_more{justify-self:stretch;width:100%;justify-content:center;} .sub_visual .thumb.sv_recruit2026 .sv_cont > p br{display:none;} }