@charset "utf-8";

/* fonts */
@font-face {
    font-family: 'Pretendard';
    font-weight: 800;
    font-display: swap;
    src: local('Pretendard ExtraBold'), url(../fonts/Pretendard-ExtraBold.woff2) format('woff2'), url(../fonts/Pretendard-ExtraBold.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 700;
    font-display: swap;
    src: local('Pretendard Bold'), url(../fonts/Pretendard-Bold.woff2) format('woff2'), url(../fonts/Pretendard-Bold.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-display: swap;
    src: local('Pretendard SemiBold'), url(../fonts/Pretendard-SemiBold.woff2) format('woff2'), url(../fonts/Pretendard-SemiBold.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-display: swap;
    src: local('Pretendard Medium'), url(../fonts/Pretendard-Medium.woff2) format('woff2'), url(../fonts/Pretendard-Medium.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-display: swap;
    src: local('Pretendard Regular'), url(../fonts/Pretendard-Regular.woff2) format('woff2'), url(../fonts/Pretendard-Regular.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 300;
    font-display: swap;
    src: local('Pretendard Light'), url(../fonts/Pretendard-Light.woff2) format('woff2'), url(../fonts/Pretendard-Light.woff) format('woff');
}

@font-face {
    font-family: 'Jalnan800';
    font-weight: 800;
    font-display: swap;
    src: local('Jalnan Gothic'), url(../fonts/JalnanGothicTTF.ttf) format('ttf'), url(../fonts/JalnanGothicTTF.ttf) format('ttf');
}

@font-face {
    font-family: 'Jalnan700';
    font-weight: 700;
    font-display: swap;
    src: local('Jalnan Gothic'), url(../fonts/JalnanGothicTTF.ttf) format('ttf'), url(../fonts/JalnanGothicTTF.ttf) format('ttf');
}

@font-face {
    font-family: 'Jalnan600';
    font-weight: 600;
    font-display: swap;
    src: local('Jalnan Gothic'), url(../fonts/JalnanGothicTTF.ttf) format('ttf'), url(../fonts/JalnanGothicTTF.ttf) format('ttf');
}

@font-face {
    font-family: 'Jalnan500';
    font-weight: 500;
    font-display: swap;
    src: local('Jalnan Gothic'), url(../fonts/JalnanGothicTTF.ttf) format('ttf'), url(../fonts/JalnanGothicTTF.ttf) format('ttf');
}

@font-face {
    font-family: 'Jalnan400';
    font-weight: 400;
    font-display: swap;
    src: local('Jalnan Gothic'), url(../fonts/JalnanGothicTTF.ttf) format('ttf'), url(../fonts/JalnanGothicTTF.ttf) format('ttf');
}


/* base */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: inherit; vertical-align: baseline; box-sizing: border-box;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote::before, blockquote::after, q::before, q::after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
table caption {overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0;}
a {color: var(--black); text-decoration: none;cursor: pointer;}
label, img {vertical-align: middle;}
html {-webkit-text-size-adjust: antialiased; -moz-osx-font-smoothing: grayscale;}
input {-webkit-border-radius: 0; border-radius: 0; -webkit-appearance: none; appearance: none;}
:focus {outline: 1px solid #fff !important; box-sizing: border-box !important;}
:focus:not(:focus-visible) {outline: none !important; box-shadow: none !important;}
::placeholder {color: var(--Subbody_03, #B1B1B1) !important; font-weight: 500;}
::-webkit-input-placeholder {color: var(--Subbody_03, #B1B1B1) !important; font-weight: 500;}
:-ms-input-placeholder {color: var(--Subbody_03, #B1B1B1) !important; font-weight: 500;}
a, button, input, select, div, li, span, p {-webkit-tap-highlight-color: rgba(0,0,0,.025);}

html {font-size: 62.5%; scroll-behavior: smooth;scrollbar-gutter: stable;}
body {font-size: 1.6rem; font-family: Pretendard, 'Malgun Gothic', '맑은 고딕', sans-serif; color: var(--Black); background: #fff; line-height: 1.5; margin: 0; min-width: 320px;}
body.fixed {overflow: hidden;}

:root {
    --Violet_100: #f8f5ff;
    --Violet_400: #8b54f7;
    --Violet_500: #6d35de;
    --Violet_600: #5221b5;
    --Black: #263238;
    --Black_bg: rgba(0,0,0,.5);
    --White: #ffffff;
    --darkGray: #5a5a5a;
    --Gray: #f4f4f4;
    --Gray_200: #78909d;
    --Gray_400: #828282;
    --BG_disable: #eaeaea;
    --BG_body: #f7f7f7;
    --BG_subbody: #f1f3f5;
    --Line_Default: #dedede;
    --Subbody_01: #1D2024;
    --Subbody_02: #999999;
    --Subbody_03: #b1b1b1;
    --Subbody_04: #cccccc;
    --Subbody_05: #789091;
    --Subbody_06: #848484;
    --Blue_100: #f0f5ff;
    --Blue_200: #5971d6;      
    --Blue_400: #2f6fed;
    --Red_100: #fff1f1;
    --Red_200: #ff7b7b;
    --Red_300: #f65d5d;
    --Red_400: #ff5252;
    --Red_500: #f71f1f;
    --Red_600: #f60a0a;
    --Flash: #F7EC59;
    --Orange_100: #fff3e6;
    --Orange_400: #ff8500;
    --Gold_100: #fffbeb;
    --Gold_400: #d97706;
    --Green_100: #edfdf8;
    --Green_200: #1ae422;
    --Green_400: #259671;
    --SurfBlue_100: #f0f9ff;
    --SurfBlue_400: #026aa2;
    --Pure_blue_400: #2f6fed;
    --Mint: #18bdbf;
    --btn_bg: #e7ecef;
    --btn_bg-63: rgba(231, 236, 239, 0.63);
}

.violet-100 {color: var(--Violet_100) !important;}
.violet-400 {color: var(--Violet_400) !important;}
.violet-500 {color: var(--Violet_500) !important;}
.violet-600 {color: var(--Violet_600) !important;}
.black {color: var(--Black) !important;}
.black-bg {color: var(--Black_bg) !important;}
.white {color: var(--White) !important;}
.darkGray {color: var(--darkGray) !important;}
.gray-400 {color: var(--Gray_400) !important;}
.bg-disable {color: var(--BG_disable) !important;}
.bg-body {color: var(--BG_body) !important;}
.bg-subbody {color: var(--BG_subbody) !important;}
.line-default {color: var(--Line_Default) !important;}
.subbody-01 {color: var(--Subbody_01) !important;}
.subbody-02 {color: var(--Subbody_02) !important;}
.subbody-03 {color: var(--Subbody_03) !important;}
.subbody-04 {color: var(--Subbody_04) !important;}
.subbody-05 {color: var(--Subbody_05) !important;}
.subbody-06 {color: var(--Subbody_06) !important;}
.blue-100 {color: var(--Blue_100) !important;}
.blue-400 {color: var(--Blue_400) !important;}
.pureBlue {color: var(--Pure_blue_400) !important;}
.red-100 {color: var(--Red_100) !important;}
.red-200 {color: var(--Red_200) !important;}
.red-400 {color: var(--Red_400) !important;}
.flash {color: var(--Flash) !important;}
.orange-100 {color: var(--Orange_100) !important;}
.orange-400 {color: var(--Orange_400) !important;}
.gold-100 {color: var(--Gold_100) !important;}
.gold-400 {color: var(--Gold_400) !important;}
.green-100 {color: var(--Green_100) !important;}
.green-200 {color: var(--Green_200) !important;}
.green-400 {color: var(--Green_400) !important;}
.surf-blue-100 {color: var(--SurfBlue_100) !important;}
.surf-blue-400 {color: var(--SurfBlue_400) !important;}
.mint {color: var(--Mint) !important;}
.btn-bg {color: var(--btn_bg) !important;}
.btn-bg-63 {color: var(--btn_bg_63) !important;}
.bg-gray {background-color: var(--BG_body, #F7F7F7) !important;}
.bg-blue-100 {background-color: var(--Blue_100) !important;}

.w10p {width: 10% !important;}
.w20p {width: 20% !important;}
.w25p {width: 25% !important;}
.w30p {width: 30% !important;}
.w40p {width: 40% !important;}
.w50p {width: 50% !important;}
.w60p {width: 60% !important;}
.w70p {width: 70% !important;}
.w75p {width: 75% !important;}
.w80p {width: 80% !important;}
.w90p {width: 90% !important;}
.w100p {width: 100% !important;}

.w16 {width: 1.6rem !important;}
.w20 {width: 2rem !important;}
.w24 {width: 2.4rem !important;}
.w26 {width: 2.6rem !important;}
.w28 {width: 2.8rem !important;}
.w30 {width: 3rem !important;}
.w32 {width: 3.2rem !important;}
.w40 {width: 4rem !important;}
.w48 {width: 4.8rem !important;}
.w50 {width: 5rem !important;}
.w56 {width: 5.6rem !important;}
.w60 {width: 6rem !important;}
.w64 {width: 6.4rem !important;}
.w70 {width: 7rem !important;}
.w72 {width: 7.2rem !important;}
.w80 {width: 8rem !important;}
.w88 {width: 8.8rem !important;}
.w90 {width: 9rem !important;}
.w96 {width: 9.6rem !important;}
.w100 {width: 10rem !important;}
.w120 {width: 12rem !important;}
.w150 {width: 15rem !important;}
.w160 {width: 16rem !important;}
.w200 {width: 20rem !important;}
.w240 {width: 24rem !important;}
.w300 {width: 30rem !important;}
.w320 {width: 32rem !important;}
.w400 {width: 40rem !important;}
.w480 {width: 48rem !important;}
.w500 {width: 50rem !important;}
.w560 {width: 56rem !important;}
.w600 {width: 60rem !important;}
.w640 {width: 640rem !important;}
.w800 {width: 80rem !important;}

.h50p {height: 50% !important;}
.h100p {height: 100% !important;}

.h16 {height: 1.6rem !important;}
.h20 {height: 2rem !important;}
.h24 {height: 2.4rem !important;}
.h28 {height: 2.8rem !important;}
.h30 {height: 3rem !important;}
.h32 {height: 3.2rem !important;}
.h40 {height: 4rem !important;}
.h48 {height: 4.8rem !important;}
.h50 {height: 5rem !important;}
.h56 {height: 5.6rem !important;}
.h60 {height: 6rem !important;}
.h64 {height: 6.4rem !important;}
.h70 {height: 7rem !important;}
.h72 {height: 7.2rem !important;}
.h80 {height: 8rem !important;}
.h90 {height: 9rem !important;}
.h100 {height: 10rem !important;}
.h120 {height: 12rem !important;}
.h150 {height: 15rem !important;}
.h160 {height: 16rem !important;}
.h200 {height: 20rem !important;}
.h240 {height: 24rem !important;}
.h300 {height: 30rem !important;}
.h320 {height: 32rem !important;}
.h400 {height: 40rem !important;}
.h480 {height: 48rem !important;}
.h500 {height: 50rem !important;}
.h560 {height: 56rem !important;}
.h600 {height: 60rem !important;}

.mt-16 {margin-top: -1.6rem !important;}
.mt-8 {margin-top: -.8rem !important;}
.mt-4 {margin-top: -.4rem !important;}
.mt-2 {margin-top: -.2rem !important;}
.mt0 {margin-top: 0 !important;}
.mt2 {margin-top: .2rem !important;}
.mt4 {margin-top: .4rem !important;}
.mt5 {margin-top: .5rem !important;}
.mt8 {margin-top: .8rem !important;}
.mt10 {margin-top: 1rem !important;}
.mt12 {margin-top: 1.2rem !important;}
.mt15 {margin-top: 1.5rem !important;}
.mt16 {margin-top: 1.6rem !important;}
.mt20 {margin-top: 2rem !important;}
.mt24 {margin-top: 2.4rem !important;}
.mt30 {margin-top: 3rem !important;}
.mt32 {margin-top: 3.2rem !important;}
.mt40 {margin-top: 4rem !important;}
.mt48 {margin-top: 4.8rem !important;}
.mt50 {margin-top: 5rem !important;}
.mt56 {margin-top: 5.6rem !important;}
.mt64 {margin-top: 6.4rem !important;}
.mt80 {margin-top: 8rem !important;}
.mt100 {margin-top: 10rem !important;}
.mt120 {margin-top: 12rem !important;}
.mt140 {margin-top: 14rem !important;}
.mt160 {margin-top: 16rem !important;}
.mt-auto {margin-top: auto !important;}

.mb-2 {margin-bottom: -0.2rem !important;}
.mb-4 {margin-bottom: -0.4rem !important;}
.mb-5 {margin-bottom: -0.5rem !important;}
.mb-8 {margin-bottom: -0.8rem !important;}
.mb-10 {margin-bottom: -1rem !important;}
.mb-14 {margin-bottom: -1.4rem !important;}
.mb-20 {margin-bottom: -2rem !important;}
.mb-24 {margin-bottom: -2.4rem !important;}
.mb0 {margin-bottom: 0 !important;}
.mb2 {margin-bottom: .2rem !important;}
.mb4 {margin-bottom: .4rem !important;}
.mb5 {margin-bottom: .5rem !important;}
.mb8 {margin-bottom: .8rem !important;}
.mb10 {margin-bottom: 1rem !important;}
.mb12 {margin-bottom: 1.2rem !important;}
.mb15 {margin-bottom: 1.5rem !important;}
.mb16 {margin-bottom: 1.6rem !important;}
.mb20 {margin-bottom: 2rem !important;}
.mb24 {margin-bottom: 2.4rem !important;}
.mb30 {margin-bottom: 3rem !important;}
.mb32 {margin-bottom: 3.2rem !important;}
.mb40 {margin-bottom: 4rem !important;}
.mb48 {margin-bottom: 4.8rem !important;}
.mb50 {margin-bottom: 5rem !important;}
.mb56 {margin-bottom: 5.6rem !important;}
.mb64 {margin-bottom: 6.4rem !important;}
.mb80 {margin-bottom: 8rem !important;}
.mb100 {margin-bottom: 10rem !important;}
.mb120 {margin-bottom: 12rem !important;}
.mb140 {margin-bottom: 14rem !important;}
.mb160 {margin-bottom: 16rem !important;}
.mb-auto {margin-bottom: auto !important;}

.ml0 {margin-left: 0 !important;}
.ml2 {margin-left: .2rem !important;}
.ml4 {margin-left: .4rem !important;}
.ml5 {margin-left: .5rem !important;}
.ml8 {margin-left: .8rem !important;}
.ml10 {margin-left: 1rem !important;}
.ml12 {margin-left: 1.2rem !important;}
.ml15 {margin-left: 1.5rem !important;}
.ml16 {margin-left: 1.6rem !important;}
.ml20 {margin-left: 2rem !important;}
.ml24 {margin-left: 2.4rem !important;}
.ml30 {margin-left: 3rem !important;}
.ml32 {margin-left: 3.2rem !important;}
.ml40 {margin-left: 4rem !important;}
.ml48 {margin-left: 4.8rem !important;}
.ml50 {margin-left: 5rem !important;}
.ml56 {margin-left: 5.6rem !important;}
.ml64 {margin-left: 6.4rem !important;}
.ml80 {margin-left: 8rem !important;}
.ml100 {margin-left: 10rem !important;}
.ml120 {margin-left: 12rem !important;}
.ml140 {margin-left: 14rem !important;}
.ml160 {margin-left: 16rem !important;}
.ml-auto {margin-left: auto !important;}

.mr0 {margin-right: 0 !important;}
.mr2 {margin-right: .2rem !important;}
.mr4 {margin-right: .4rem !important;}
.mr5 {margin-right: .5rem !important;}
.mr8 {margin-right: .8rem !important;}
.mr10 {margin-right: 1rem !important;}
.mr12 {margin-right: 1.2rem !important;}
.mr15 {margin-right: 1.5rem !important;}
.mr16 {margin-right: 1.6rem !important;}
.mr20 {margin-right: 2rem !important;}
.mr24 {margin-right: 2.4rem !important;}
.mr30 {margin-right: 3rem !important;}
.mr32 {margin-right: 3.2rem !important;}
.mr40 {margin-right: 4rem !important;}
.mr48 {margin-right: 4.8rem !important;}
.mr50 {margin-right: 5rem !important;}
.mr56 {margin-right: 5.6rem !important;}
.mr64 {margin-right: 6.4rem !important;}
.mr80 {margin-right: 8rem !important;}
.mr100 {margin-right: 10rem !important;}
.mr120 {margin-right: 12rem !important;}
.mr140 {margin-right: 14rem !important;}
.mr160 {margin-right: 16rem !important;}
.mr-auto {margin-right: auto !important;}

.p0 {padding: 0 !important;}
.p4 {padding: .4rem !important;}
.p5 {padding: .5rem !important;}
.p8 {padding: .8rem !important;}
.p10 {padding: 1rem !important;}
.p15 {padding: 1.5rem !important;}
.p16 {padding: 1.6rem !important;}
.p20 {padding: 2rem !important;}
.p24 {padding: 2.4rem !important;}
.p30 {padding: 3rem !important;}
.p32 {padding: 3.2rem !important;}
.p40 {padding: 4rem !important;}
.p48 {padding: 4.8rem !important;}
.p50 {padding: 5rem !important;}
.p56 {padding: 5.6rem !important;}
.p60 {padding: 6rem !important;}
.p64 {padding: 6.4rem !important;}
.p72 {padding: 7.2rem !important;}
.p80 {padding: 8rem !important;}
.p100 {padding: 10rem !important;}
.p120 {padding: 12rem !important;}
.p140 {padding: 14rem !important;}
.p160 {padding: 16rem !important;}

.pt0 {padding-top: 0 !important;}
.pt2 {padding-top: .2rem !important;}
.pt4 {padding-top: .4rem !important;}
.pt5 {padding-top: .5rem !important;}
.pt8 {padding-top: .8rem !important;}
.pt10 {padding-top: 1rem !important;}
.pt12 {padding-top: 1.2rem !important;}
.pt15 {padding-top: 1.5rem !important;}
.pt16 {padding-top: 1.6rem !important;}
.pt20 {padding-top: 2rem !important;}
.pt24 {padding-top: 2.4rem !important;}
.pt30 {padding-top: 3rem !important;}
.pt32 {padding-top: 3.2rem !important;}
.pt40 {padding-top: 4rem !important;}
.pt48 {padding-top: 4.8rem !important;}
.pt50 {padding-top: 5rem !important;}
.pt56 {padding-top: 5.6rem !important;}
.pt60 {padding-top: 6rem !important;}
.pt64 {padding-top: 6.4rem !important;}
.pt72 {padding-top: 7.2rem !important;}
.pt80 {padding-top: 8rem !important;}
.pt100 {padding-top: 10rem !important;}
.pt120 {padding-top: 12rem !important;}
.pt140 {padding-top: 14rem !important;}
.pt160 {padding-top: 16rem !important;}

.pb0 {padding-bottom: 0 !important;}
.pb2 {padding-bottom: .2rem !important;}
.pb4 {padding-bottom: .4rem !important;}
.pb5 {padding-bottom: .5rem !important;}
.pb8 {padding-bottom: .8rem !important;}
.pb10 {padding-bottom: 1rem !important;}
.pb12 {padding-bottom: 1.2rem !important;}
.pb15 {padding-bottom: 1.5rem !important;}
.pb16 {padding-bottom: 1.6rem !important;}
.pb20 {padding-bottom: 2rem !important;}
.pb24 {padding-bottom: 2.4rem !important;}
.pb30 {padding-bottom: 3rem !important;}
.pb32 {padding-bottom: 3.2rem !important;}
.pb40 {padding-bottom: 4rem !important;}
.pb48 {padding-bottom: 4.8rem !important;}
.pb50 {padding-bottom: 5rem !important;}
.pb56 {padding-bottom: 5.6rem !important;}
.pb60 {padding-bottom: 6rem !important;}
.pb64 {padding-bottom: 6.4rem !important;}
.pb72 {padding-bottom: 7.2rem !important;}
.pb80 {padding-bottom: 8rem !important;}
.pb100 {padding-bottom: 10rem !important;}
.pb120 {padding-bottom: 12rem !important;}
.pb140 {padding-bottom: 14rem !important;}
.pb160 {padding-bottom: 16rem !important;}
.pb200 {padding-bottom: 20rem !important;}

.pl0 {padding-left: 0 !important;}
.pl4 {padding-left: .4rem !important;}
.pl5 {padding-left: .5rem !important;}
.pl8 {padding-left: .8rem !important;}
.pl10 {padding-left: 1rem !important;}
.pl12 {padding-left: 1.2rem !important;}
.pl14 {padding-left: 1.4rem !important;}
.pl15 {padding-left: 1.5rem !important;}
.pl16 {padding-left: 1.6rem !important;}
.pl20 {padding-left: 2rem !important;}
.pl24 {padding-left: 2.4rem !important;}
.pl30 {padding-left: 3rem !important;}
.pl32 {padding-left: 3.2rem !important;}
.pl40 {padding-left: 4rem !important;}
.pl48 {padding-left: 4.8rem !important;}
.pl50 {padding-left: 5rem !important;}
.pl56 {padding-left: 5.6rem !important;}
.pl60 {padding-left: 6rem !important;}
.pl64 {padding-left: 6.4rem !important;}
.pl72 {padding-left: 7.2rem !important;}
.pl80 {padding-left: 8rem !important;}
.pl100 {padding-left: 10rem !important;}
.pl120 {padding-left: 12rem !important;}
.pl140 {padding-left: 14rem !important;}
.pl160 {padding-left: 16rem !important;}

.pr0 {padding-right: 0 !important;}
.pr4 {padding-right: .4rem !important;}
.pr5 {padding-right: .5rem !important;}
.pr8 {padding-right: .8rem !important;}
.pr10 {padding-right: 1rem !important;}
.pr12 {padding-right: 1.2rem !important;}
.pr14 {padding-right: 1.4rem !important;}
.pr15 {padding-right: 1.5rem !important;}
.pr16 {padding-right: 1.6rem !important;}
.pr20 {padding-right: 2rem !important;}
.pr24 {padding-right: 2.4rem !important;}
.pr30 {padding-right: 3rem !important;}
.pr32 {padding-right: 3.2rem !important;}
.pr34 {padding-right: 3.4rem !important;}
.pr40 {padding-right: 4rem !important;}
.pr48 {padding-right: 4.8rem !important;}
.pr50 {padding-right: 5rem !important;}
.pr56 {padding-right: 5.6rem !important;}
.pr60 {padding-right: 6rem !important;}
.pr64 {padding-right: 6.4rem !important;}
.pr72 {padding-right: 7.2rem !important;}
.pr80 {padding-right: 8rem !important;}
.pr100 {padding-right: 10rem !important;}
.pr120 {padding-right: 12rem !important;}
.pr140 {padding-right: 14rem !important;}
.pr160 {padding-right: 16rem !important;}

.fs10 {font-size: 1rem !important;}
.fs11 {font-size: 1.1rem !important;}
.fs12 {font-size: 1.2rem !important;}
.fs13 {font-size: 1.3rem !important;}
.fs14 {font-size: 1.4rem !important;}
.fs15 {font-size: 1.5rem !important;}
.fs16 {font-size: 1.6rem !important;}
.fs17 {font-size: 1.7rem !important;}
.fs18 {font-size: 1.8rem !important;}
.fs20 {font-size: 2rem !important;}
.fs24 {font-size: 2.4rem !important;}
.fs28 {font-size: 2.8rem !important;}
.fs32 {font-size: 3.2rem !important;}
.fs40 {font-size: 4rem !important;}
.fs48 {font-size: 4.8rem !important;}
.fs56 {font-size: 5.6rem !important;}
.fs64 {font-size: 6.4rem !important;}
.fs72 {font-size: 7.2rem !important;}
.fs80 {font-size: 8rem !important;}

.fw300 {font-weight: 300 !important;}
.fw400 {font-weight: 400 !important;}
.fw500 {font-weight: 500 !important;}
.fw600 {font-weight: 600 !important;}
.fw700 {font-weight: 700 !important;}
.fw800 {font-weight: 800 !important;}

.lh0 {line-height: 0rem !important;}
.lh16 {line-height: 1.6rem !important;}
.lh20 {line-height: 2rem !important;}
.lh22 {line-height: 2.2rem !important;}
.lh24 {line-height: 2.4rem !important;}
.lh28 {line-height: 2.8rem !important;}
.lh30 {line-height: 3rem !important;}
.lh32 {line-height: 3.2rem !important;}
.lh34 {line-height: 3.4rem !important;}
.lh35 {line-height: 3.5rem !important;}
.lh36 {line-height: 3.6rem !important;}
.lh38 {line-height: 3.8rem !important;}
.lh40 {line-height: 4rem !important;}
.lh48 {line-height: 4.8rem !important;}

.t-left {text-align: left !important;}
.t-right {text-align: right !important;}
.t-center {text-align: center !important;}

.v-top {vertical-align: top !important;}
.v-middle {vertical-align: middle !important;}
.v-bottom {vertical-align: bottom !important;}

.f-clear:after {content: ''; height: 0; display: block; visibility: hidden; clear: both;}
* html .f-clear {height: 1%;}
.f-clear {display: block; min-height: 1%;}
.clear {clear: both;}
.f-left {float: left;}
.f-right {float: right;}
.astbl {display: table; width: 100%; height: 100%; overflow: hidden;}
.inbl {display: inline-block;}
.indent {text-indent: -1.1em; padding-left: 1.1em;}

.scroll {overflow: scroll;}
.scroll-x {overflow-x: scroll;}
.scroll-y {overflow-y: scroll;}
.scroll-auto {overflow: auto;}

.scrollbar::-webkit-scrollbar {width: .8rem; height: .8rem;}
.scrollbar::-webkit-scrollbar-thumb {background: var(--Subbody_02); border-radius: .4rem;}
.scrollbar::-webkit-scrollbar-track {background: var(--BG_subbody); border-radius: .4rem;}

.scrollbar2::-webkit-scrollbar {width: .1rem; height: .1rem;}
.scrollbar2::-webkit-scrollbar-thumb {background: transparent;}
.scrollbar2::-webkit-scrollbar-track {background: transparent;}


.flex-row {display: flex; flex-direction: row !important;}
.flex-col {display: flex; flex-direction: column !important;}
.gap0 {gap: 0 !important;}
.gap2 {gap: .2rem !important;}
.gap4 {gap: .4rem !important;}
.gap8 {gap: .8rem !important;}
.gap12 {gap: 1.2rem !important;}
.gap16 {gap: 1.6rem !important;}
.gap24 {gap: 2.4rem !important;}
.gap28 {gap: 2.8rem !important;}
.gap32 {gap: 3.2rem !important;}
.gap40 {gap: 4rem !important;}
.gap48 {gap: 4.8rem !important;}
.gap56 {gap: 5.6rem !important;}
.gap64 {gap: 6.4rem !important;}
.gap72 {gap: 7.2rem !important;}
.gap80 {gap: 8rem !important;}
.sb {justify-content: space-between !important;}
.ac {align-items: center !important;}
.as {align-items: start !important;}
.ae {align-items: end !important;}
.jc {justify-content: center !important;}
.js {justify-content: start !important;}
.je {justify-content: end !important;}
.flex-wrap {flex-wrap: wrap !important;}
.flex-nowrap {flex-wrap: nowrap !important;}
.flex1 {flex: 1 !important;}
.flex0 {flex: 0 !important;}

.mo, .mo-block, .mo-flex, .mo-block-1024 {display: none !important;}
.pc, .pc-block {display: block !important;}
.pc-flex {display: flex !important;}
.hide {display: none !important;}

/* form */
input[type=text], input[type=password], input[type=file], input[type=email], input[type=number], input[type=tel], input[type=search], input[type=url] {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); padding: 1.6rem; line-height: 2.2rem; font-size: 1.5rem; font-weight: 500; box-sizing: border-box; vertical-align: middle; color: var(--Black);}
input[type=text]:disabled, input[type=password]:disabled, input[type=file]:disabled, input[type=email]:disabled, input[type=number]:disabled, input[type=tel]:disabled, input[type=search]:disabled, input[type=url]:disabled,
input[type=text]:read-only, input[type=password]:read-only, input[type=file]:read-only, input[type=email]:read-only, input[type=number]:read-only, input[type=tel]:read-only, input[type=search]:read-only, input[type=url]:read-only {background: var(--BG_subbody, #F1F3F5); color: var(--Subbody_03, #B1B1B1); font-weight: 500;}
input[type=text]:focus, input[type=password]:focus, input[type=file]:focus, input[type=email]:focus, input[type=number]:focus, input[type=tel]:focus, input[type=search]:focus, input[type=url]:focus {border: 1px solid var(--Black);}

input[type=text].lg, input[type=password].lg, input[type=file].lg, input[type=email].lg, input[type=number].lg, input[type=tel].lg, input[type=search].lg, input[type=url].lg {font-size: 1.8rem; line-height: 2.2rem; padding: 2rem;}

input[type=text].sm, input[type=password].sm, input[type=file].sm, input[type=email].sm, input[type=number].sm, input[type=tel].sm, input[type=search].sm, input[type=url].sm {font-size: 1.4rem; font-weight: 500;; line-height: 2.2rem; padding: 1.2rem 1.4rem;}

input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type="number"] {-moz-appearance: textfield;}
input.nobo {border-color: transparent !important;}

input.valid:not(:placeholder-shown):not(:focus):valid {background: url(../images/valid.svg) no-repeat calc( 100% - 2.3rem ) 50%;}

.inp-inlabel {position: relative; width: 100%;}
.inp-inlabel.row-type {display: flex;gap: 1.6rem;align-items: center;}
.inp-inlabel input {transition: all 0.3s ease; background-repeat: no-repeat; background-position: calc( 100% - 2.3rem ) 50%; width: 100%; padding: 1.6rem;}
.inp-inlabel label {position: absolute; top: 2rem; left: 1.6rem; font-size: 1.6rem; line-height: 2rem; color: #aaa; transition: all 0.3s ease; pointer-events: none;}
.inp-inlabel input.lg {padding: 2rem;}
.inp-inlabel input.lg + label {left: 2rem; top: 2rem; font-size: 1.7rem;}
.inp-inlabel input:focus {padding-top: 3rem; padding-bottom: 1rem;}
.inp-inlabel input.lg:focus {padding-top: 3.4rem; padding-bottom: 1.2rem;}
.inp-inlabel input:focus + label, .inp-inlabel input:not(:placeholder-shown) + label {top: 1rem; font-size: 1rem;}
.inp-inlabel input.lg:focus + label, .inp-inlabel input.lg:not(:placeholder-shown) + label {top: 1.2rem;}
.inp-inlabel small {display: none; font-size: 1.3rem; font-weight: 500; margin-top: 0.5rem; text-align: left; padding-left: 5px;}
.inp-inlabel small.show {display: inline-block !important;}
.inp-inlabel .error-message {color: var(--Red-400, #FF5252);}
.inp-inlabel .guide-message {color: var(--Subbody_01, #848484);}
.inp-inlabel .success-message {color: var(--Green_400, #259671);}
form.submitted .inp-inlabel input:invalid {border-color: var(--Red_400, #FF5252); background-image: url(../images/invalid.svg);}
form.submitted .inp-inlabel input:invalid + label ~ .error-message {display: block;}
/* form.submitted .inp-inlabel input:valid + label ~ .success-message {display: block;} */
.inp-inlabel input:focus:invalid + label + .error-message {display: none;}
.inp-inlabel input:not(:placeholder-shown):not(:focus) {border-color: var(--Line_Default, #DEDEDE);}
.inp-inlabel input:not(:placeholder-shown):not(:focus) + label {display: none;}
.inp-inlabel input:not(:placeholder-shown):not(:focus):valid {background-image: url(../images/valid.svg);}

/* 기존 CSS가 강제로 배경을 넣지 못하도록 우선순위를 높인 커스텀 클래스 */

/* 1. 일치하지 않을 때: 빨간색 테두리와 X 아이콘(invalid.svg) */
input.lg.is-invalid {
    border-color: var(--Red_400, #FF5252) !important;
    background: url(../images/invalid.svg) no-repeat calc( 100% - 2.3rem ) 50% !important;
}

/* 2. 일치할 때만 초록색 체크 표시 */
input.lg.is-valid {
    border-color: #28a745 !important; /* 원하는 초록색 계열 */
    background: url(../images/valid.svg) no-repeat calc( 100% - 2.3rem ) 50% !important;
}

/* 3. 아무것도 입력 안 했을 때는 아이콘 삭제 */
input.lg.no-status {
    background-image: none !important;
}

/* 비밀번호 유효성 및 일치 확인 메시지 스타일 */
.impo_txt {
    color: var(--Red_400, #FF5252); /* 기존 CSS에 정의된 빨간색 변수 사용, 없으면 #FF5252 */
    font-weight: 500;
    margin-top: 0.5rem;
    display: none; /* 기본적으로 숨김 (JS에서 제어) */
}

/* 추가로 '비밀번호가 일치합니다'는 초록색으로 보여주는 게 좋겠죠? */
#pw_re_chk_true {
    color: #28a745; /* 성공 시 초록색 */
}

.inp-inlabel2 {position: relative; width: 100%;}
.inp-inlabel2 label {position: absolute; top: 2rem; left: 1.6rem; font-size: 1.6rem; line-height: 1.6rem; color: #aaa; transition: all 0.3s ease; pointer-events: none;}
.inp-inlabel2 input {text-align: right; font-weight: 700; width: 100%; padding: 1.6rem 4.5rem 1.6rem 1.6rem; line-height: 2.2rem;}
.inp-inlabel2 input.lg {padding: 2rem 3.3rem 2rem 2rem;}
.inp-inlabel2 input.lg + label {left: 2rem; top: 2.4rem; font-size: 1.8rem;}
.inp-inlabel2 input:focus, .inp-inlabel2 input:not(:placeholder-shown) {border: 1px solid var(--Black);}
.inp-inlabel2 small {display: none; font-size: 1.4rem; margin-top: 1.2rem; text-align: left;}
.inp-inlabel2 small.show {display: inline-block !important;}
.inp-inlabel2 .error-message {color: var(--Red-400, #FF5252);}
.inp-inlabel2 .guide-message {color: var(--Subbody_01, #848484);}
.inp-inlabel2 .success-message {color: var(--Green_400, #259671);}
.inp-inlabel2 input:not(:placeholder-shown):not(:focus) {border-color: var(--Line_Default, #DEDEDE); text-align: right;}
.inp-inlabel2 .unit {position: absolute; top: 1.6rem; right: 1.6rem; font-size: 1.6rem; font-weight: 600; pointer-events: none;}

.inp-inlabel2 input.sm {padding: 1.2rem 2.8rem 1.2rem 1.4rem;}
.inp-inlabel2 input.sm + label {left: 1.4rem; top: 1.7rem; font-size: 1.5rem;}
.inp-inlabel2 input.sm ~ .unit {top: 1.2rem; right: 1.4rem; font-size: 1.6rem; font-weight: 500;}

.inp-inlabel2 input.md {padding: 1.2rem 2.8rem 1.2rem 1.4rem;}
.inp-inlabel2 input.md + label {left: 1.4rem; top: 1.7rem; font-size: 1.5rem;}
.inp-inlabel2 input.md ~ .unit {top: 1.2rem; right: 1.4rem; font-size: 1.6rem; font-weight: 500;}

.inp-inlabel2 input.lg ~ .unit {top: 1.85rem; right: 1.8rem; font-size: 1.7rem;}
/* .inp-inlabel2 input.lg:not(:placeholder-shown):not(:focus) {padding: 2rem !important;} */
/* .inp-inlabel2 input:focus + label {display: none;} */
/* .inp-inlabel2 input:not(:placeholder-shown):not(:focus) + label {display: none;} */

.inp-file {display: flex; gap: 1.6rem;}
.inp-file input {display: none;}
.file-name {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); padding: 1.6rem; line-height: 2.2rem; font-size: 1.6rem; font-weight: 600; box-sizing: border-box; vertical-align: middle; color: var(--Black); width: 100%; height: 6.4rem; text-align: left;}
.inp-file .btn.gray {font-size: 1.6rem; font-weight: 600; line-height: 2.2rem; padding: 2rem 2.3rem; height: 6.4rem;}

.inp-search-wrap {position: relative;}
.inp-search-wrap .inp-search {padding-right: 4.6rem !important; width: 100%;}
.inp-search-wrap .btn-search {background: url(../images/ic_search.svg) no-repeat center / 2rem 2rem; font-size: 1px; overflow: hidden; text-indent: -200px; display: inline-block; position: absolute; top: .4rem; right: .4rem; width: 4rem; height: 4rem; z-index: 1;outline: none; border: none; cursor: pointer;}
.inp-search-wrap .inp-search.lg ~ .btn-search {top: 1.3rem;}

input.datepicker {background: url(../images/ic_calendar2.svg) no-repeat calc( 100% - 1.6rem ) 50% / 2rem 2rem;}
/* 모바일 사이즈 (보통 768px 이하 또는 더 좁은 480px 이하) */
@media (max-width: 480px) {
    input.datepicker {
        /* 아이콘 제거 */
        background-image: none !important;
        
        /* 아이콘이 사라진 만큼 텍스트가 중앙에 오도록 패딩 조정 (선택 사항) */
        padding-right: 0.8rem !important; 
        text-align: center;
    }
}

.inp-gray {}

.checkbox {display: inline-flex; padding: .8rem 0; align-items: center;}
.checkbox input {position: absolute; opacity: 0; pointer-events: none;}
.checkbox span {display: inline-flex; align-items: start; gap: .8rem; cursor: pointer; color: var(--Subbody_05, #78909d); line-height: 2.2rem; font-size: 1.4rem;}
.checkbox span::before {content: ''; display: inline-block; width: 2.2rem; height: 2.2rem; background: url('../images/check.svg') no-repeat center / 100% 100%; transition: all 0.2s ease; flex: 0 0 2.2rem;}
.checkbox input:checked + span::before {background-image: url('../images/checked.svg');}

.checkbox2 {display: inline-flex; padding: .8rem 0; align-items: center;}
.checkbox2 input {position: absolute; opacity: 0; pointer-events: none;}
.checkbox2 span {display: inline-flex; align-items: start; gap: .8rem; cursor: pointer; color: var(--Subbody_05, #78909d); line-height: 2.4rem; font-size: 1.5rem;}
.checkbox2 span::before {content: ''; display: inline-block; width: 2.2rem; height: 2.2rem; background: url('../images/check2.svg') no-repeat center / 100% 100%; transition: all 0.2s ease; flex: 0 0 2.2rem;}
.checkbox2 input:checked + span::before {background-image: url('../images/checked2.svg');}

.checkbox3 {line-height: 2.4rem; display: inline-flex;}
.checkbox3 input {position: absolute; opacity: 0; pointer-events: none;}
.checkbox3 span {display: inline-flex; align-items: start; gap: .8rem; cursor: pointer; color: var(--Subbody_05, #78909d); line-height: 2.4rem;}
.checkbox3 span::before {content: ''; display: inline-block; width: 2.4rem; height: 2.4rem; background: url('../images/ic_radio_off.svg') no-repeat center / 100% 100%; transition: all 0.2s ease; flex: 0 0 2.4rem;}
.checkbox3 input:checked + span::before {background-image: url('../images/ic_radio_on.svg');}

.checkbox_all {display: inline-flex; padding: .8rem 0; align-items: center;}
.checkbox_all input {position: absolute; opacity: 0; pointer-events: none;}
.checkbox_all span {display: inline-flex; align-items: start; gap: .8rem; cursor: pointer; color: var(--Subbody_05, #78909d); line-height: 2.4rem;}
.checkbox_all span::before {content: ''; display: inline-block; width: 2.2rem; height: 2.2rem; background: url('../images/check_all.svg') no-repeat center / 100% 100%; transition: all 0.2s ease; flex: 0 0 2.2rem;}
.checkbox_all input:checked + span::before {background-image: url('../images/checked_all.svg');}

.radio {line-height: 2.4rem; display: inline-flex;}
.radio input {position: absolute; opacity: 0; pointer-events: none;}
.radio span {display: inline-flex; align-items: start; gap: .8rem; cursor: pointer; color: var(--Subbody_05, #78909d); line-height: 2.4rem; font-size: 1.5rem;}
.radio span::before {content: ''; display: inline-block; width: 2.2rem; height: 2.5rem; background: url('../images/check.svg') no-repeat center / 100% 100%; transition: all 0.2s ease; flex: 0 0 2.2rem;}
.radio input:checked + span::before {background-image: url('../images/checked.svg');}

textarea {border-radius: .8rem; border: 1px solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); min-height: 10rem; padding: 2rem; box-sizing: border-box; color: var(--Black); resize: none; font-size: 1.6rem; line-height: 2.4rem; text-align: left; color: var(--Black); width: 100%;}
textarea:focus {border: 1px solid var(--Black);}
textarea:disabled {background: var(--BG_subbody, #F1F3F5); color: var(--Subbody_03, #B1B1B1);}

.select {position: relative; display: inline-block; min-width: 14.6rem; color: var(--Black);}
.select select {display: none;}
.select::after {content: ''; position: absolute; top: 50%; right: 1.6rem; transform: translateY(-50%); pointer-events: none; background: url(../images/ic_select_arrow.svg) no-repeat center; width: 1.6rem; height: 1.6rem;}
.select div.selected-display {border: .1rem solid var(--Line_Default, #DEDEDE); padding: 1.2rem 4rem 1.2rem 1.6rem; cursor: pointer; background-color: #fff; border-radius: .8rem; font-size: 1.6rem; line-height: 2.2rem;}
.select div.selected-display.active {color: var(--Black, #263238);}
.select div.select-list {position: absolute; list-style: none; padding: 0; margin: 0; border: .1rem solid var(--Line_Default, #DEDEDE); width: 100%; overflow-y: auto; background-color: #fff; z-index: 10; border-radius: .8rem; margin-top: .2rem; box-shadow: 0 1.2rem 1.6rem -.4rem rgba(16, 24, 40, 0.08), 0 .4rem .6rem -.2rem rgba(16, 24, 40, 0.03); pointer-events: none; visibility: hidden; transition: all .3s ease-in-out; opacity: 0;}
.select div.select-list.show {pointer-events: all; visibility: visible; opacity: 1;}
.select ul {display: block; max-height: 22rem; padding: .4rem 0;}
.select ul li {padding: 1rem 4rem 1rem 1.6rem; cursor: pointer; line-height: 2.4rem; position: relative; white-space: nowrap;}
.select ul li:hover {background: var(--BG_body, #F7F7F7);}
.select .dropdown-list li.selected {background: var(--BG_body, #F7F7F7);}
.select .dropdown-list li.selected::after {content: ''; position: absolute; top: 50%; right: 1.6rem; width: 2rem; height: 2rem; background: url(../images/ic_select_check.svg) no-repeat center / 100% 100%; transform: translateY(-50%);}
.select.h64 div.selected-display {height: 6.4rem; font-size: 1.8rem; line-height: 2.8rem; padding: 1.6rem 1.9rem;}
.select.h56 div.selected-display {height: 5.6rem; font-size: 1.6rem; line-height: 2.4rem; padding: 1.6rem;}
.select.h48 div.selected-display {height: 4.8rem; font-size: 1.5rem; line-height: 1.4rem; padding: 1.6rem;}
.select .bs-head {display: none; gap: .8rem; justify-content: space-between; align-items: center; height: 7.2rem; border-bottom: .1rem solid var(--Line_Default, #DEDEDE); padding: 2.4rem;}
.select .tit {display: block; font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; text-align: left;}
.select .btn-close {display: block; width: 2.1rem; height: 2.1rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem;}

.select.type1 div.selected-display {border: .2rem solid var(--Gray); border-radius: 1rem; font-size: 1.6rem; line-height: 2.4rem; color: var(--Black); font-weight: 600; min-width: 16rem; background-color: var(--Gray);}
.select.type1::after {background: url(../images/ic_select_arrow2.svg) no-repeat center;}
.select.type1 div.select-list {border: .1rem solid var(--Gray); border-radius: 0;}
.select.type1 ul li {color: var(--Black); font-weight: 500; font-size: 1.6rem; letter-spacing: 0.3px;}

.select.type2 div.selected-display {border: .2rem solid var(--Gray); border-radius: 0; font-size: 1.6rem; line-height: 2.4rem; color: var(--Black); font-weight: 600; min-width: 18rem;}
.select.type2::after {background: url(../images/ic_select_arrow2.svg) no-repeat center;}
.select.type2 div.select-list {border: .1rem solid var(--Gray); border-radius: 0;}
.select.type2 ul li {color: var(--Black); font-weight: 500; font-size: 1.6rem; letter-spacing: 0.3px;}

.select.type3 {min-width: 10.4rem;}
.select.type3 div.selected-display {border: none; padding: 1.2rem 3.4rem 1.2rem 2rem; border-radius: 0; font-size: 1.4rem; line-height: 2.4rem; color: var(--Black); font-weight: 400;}
.select.type3::after {background: url(../images/ic_select_arrow2.svg) no-repeat center / 1.6rem 1.6rem;}
.select.type3 ul li {color: var(--Black); font-weight: 600; font-size: 1.4rem;}

.placeholder2::placeholder {color: var(--Subbody_04) !important;}
.placeholder2::-webkit-input-placeholder {color: var(--Subbody_04) !important;}
.placeholder2:-ms-input-placeholder {color: var(--Subbody_04) !important;}


/* button */
button[type=button], input[type=submit] input[type=button] {cursor: pointer; border: 0; transition: all .2s;}
button[type=button]:disabled, input[type=submit]:disabled, input[type=button]:disabled {cursor: default; pointer-events: none;}
.btn, .btn.primary {display: inline-flex; padding: .8rem 1.3rem; justify-content: center; align-items: center; gap: .8rem; border-radius: .8rem; border: .1rem solid var(--Red_200, #FFCCCC); background: var(--Red_200, #FFCCCC); color: var(--White); font-size: 1.4rem; text-align: center; font-weight: 600; line-height: 2.2rem; font-style: normal; white-space: nowrap; vertical-align: middle; height: 4rem; cursor: pointer;}
.btn:hover, .btn.primary:hover {border-color: var(--Red_400, #FF5252); background: var(--Red_400, #FF5252); color: var(--White);}
.btn:focus, .btn.primary:focus {border-color: var(--Red_500, #FF5252); background: var(--Red_500, #FF5252); color: var(--White);}
.btn:disabled, .btn.primary:disabled {border-color: var(--Red_200, #FFCCCC); background: var(--Red_200, #FFCCCC); color: var(--White);}
.btn.ssm {font-size: 1.2rem; font-weight: 500; line-height: 2rem; padding: .4rem .8rem; height: 2.8rem; min-width: 5.6rem;}
.btn.sm {font-size: 1.2rem; font-weight: 500; line-height: 1.6rem; padding: .7rem .9rem; height: 3.2rem;}
.btn.smd {font-size: 1.3rem; font-weight: 500; line-height: 1.6rem; padding: 2.1rem 2.3rem; height: 4.2rem;}
/* 모바일 - 상품 상세내역 참고서류 버튼 전용 */
@media (max-width: 768px) {
    .btn, .btn.primary {
      height: 4.4rem;
    }
    .btn.smd {
        font-size: 1.3rem;
        font-weight: 500;
        padding: 1.6rem 1.8rem;
        height: 5.2rem;
        max-width: 50%;
    }
}
.btn.md {font-size: 1.4rem; font-weight: 600; line-height: 2.2rem; padding: .8rem 1.3rem; height: 4rem;}
.btn.xl48 {font-size: 1.6rem; font-weight: 600; line-height: 2rem; padding: 1.3rem 1.7rem; height: 4.8rem;}
.btn.xl56 {font-size: 1.6rem; font-weight: 600; line-height: 2rem; padding: 1.7rem 2.1rem; height: 5.6rem;}
.btn.xl64 {font-size: 1.8rem; font-weight: 600; line-height: 2.2rem; padding: 2rem 2.3rem; height: 6.4rem;}
.btn.xl72 {font-size: 2rem; font-weight: 600; line-height: 2.4rem; padding: 2.3rem 2.7rem; height: 7.2rem;}
.btn.xl80 {font-size: 2rem; font-weight: 600; line-height: 2.4rem; padding: 2.7rem 3.5rem; height: 8rem;}
.btn.black {border: 1px solid var(--Black, #263238); background: var(--Black, #263238); color: var(--White) !important;}
.btn.black:hover {border-color: #000; background: #000;}
.btn.black:focus {border-color: var(--Black, #263238); background: var(--Black, #263238);}
.btn.black:disabled {border-color: var(--BG_disable, #EAEAEA); background: var(--BG_disable, #EAEAEA); color: var(--White);}
.btn.red {border: 1px solid var(--Red_200, #ff7b7b); background: var(--Red_200, #ff7b7b); color: var(--White) !important;}
.btn.red:hover {border-color: #ff5252; background: #ff5252;}
.btn.red:focus {border-color: var(--Red_400, #ff5252); background: var(--Red_400, #ff5252);}
.btn.red:disabled {border-color: var(--BG_disable, #EAEAEA); background: var(--BG_disable, #EAEAEA); color: var(--White);}
.btn.gray {border: 1px solid var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg, #E7ECEF); color: var(--Black, #263238);}
.btn.gray:hover {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg, #E7ECEF); color: var(--Black, #263238);}
.btn.gray:focus {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg, #E7ECEF); color: var(--Black, #263238);}
.btn.gray:disabled {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg, #E7ECEF); color: var(--Subbody_04, #CCC);}
.btn.outline {border: 1px solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); color: var(--Black, #263238);}
.btn.outline:hover {border-color: var(--Black, #263238); color: var(--Black, #263238);}
/* .btn.outline:focus {border-color: var(--Black, #263238); background: var(--Black, #263238); color: #fff;} */
.btn.outline:disabled {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); color: var(--Subbody_04, #CCC);}

.btn.outline2 {border: 1px solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); color: var(--Black, #263238);}
.btn.outline2:hover {border-color: var(--Violet_600); background: var(--Violet_100); color: var(--Violet_600);}
.btn.outline2:focus {border-color: var(--Violet_600); background: var(--Violet_100); color: var(--Violet_600);}
.btn.outline2:disabled {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); color: var(--Subbody_04, #CCC);}

.btn.outline-v {border: 1px solid #f5f5f5; background: rgb(238, 238, 238); color: rgb(90, 90, 90); font-weight: 500;}
.btn.outline-v:hover {border: 1px solid var(--Gray_400); background-color: var(--Gray_400); color: #fff;}
.btn.outline-v:focus {border: 1px solid var(--Gray_400); background-color: var(--Gray_400); color: #fff;}
.btn.outline-v:disabled {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); color: var(--Subbody_04, #CCC);}

.btn.outline-black {border: 1px solid var(--Black); background: var(--White, #FFF); color: var(--Black);}
.btn.outline-black:hover {border-color: var(--Violet_600); color: var(--Violet_600);}
.btn.outline-black:focus {border-color: var(--Violet_600); background: var(--Violet_100); color: #fff;}
.btn.outline-black:disabled {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); color: var(--Subbody_04, #CCC);}

.btn.darkgray {border: 1px solid var(--Subbody_01); background: var(--Subbody_01); color: #fff;}
.btn.darkgray:hover {border-color: var(--Subbody_02); background: var(--Subbody_02); color: #fff;}

.btn.lightgray {border: 1px solid var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); color: var(--Black);}

.btn.blue {border: 1px solid var(--Blue_400); background: var(--Blue_400); color: #fff;}
.btn.blue:hover {border-color: var(--Blue_400); background: var(--Blue_200);}
.btn.blue:focus {border-color: var(--Blue_400); background: var(--Blue_200);}

.tbl-basic .btn {margin: -.6rem 0;}

.btn.round {border-radius: 8rem;}
.btn .ico {width: 1.4rem; height: 1.4rem;}
.btn-go {display: flex; gap: .4rem; align-items: center; font-size: 1.4rem;}
.btn-go::after {content: ''; width: 1.2rem; height: 1.2rem; flex: 0 0 1.2rem; background: url(../images/ic_arrow_right3.svg) no-repeat center / contain;}
.btn-go.black::after {background: url(../images/ic_arrow_right2_w.svg);}
.btn-txt {color: var(--Subbody_01, #848484); text-decoration: underline; white-space: nowrap; padding: 0 1.2rem; line-height: 2.4rem;}
.btn-txt2 {color: #fff; position: relative;}
.btn-txt2::after {content: ''; display: block; width: 100%; height: .1rem; background: #fff; position: absolute; bottom: -.4rem; left: 0;}

.btn-txt-go {color:#828282; text-decoration: underline; white-space: nowrap; padding: 0 .8rem; line-height: 1.8rem; background: transparent; display: flex; gap: .8rem; align-items: center; font-size: 1.4rem; font-weight: 500;}
.btn-txt-go::after {content: ''; display: block; width: 1.2rem; height: 1.2rem; flex: 0 0 1.2rem; background: url(../images/ic_arrow_right3.svg) no-repeat center / contain;}
.btn-txt-go-w {color: #fff; text-decoration: underline; white-space: nowrap; padding: 0 .8rem; line-height: 1.8rem; background: transparent; display: flex; gap: .8rem; align-items: center; font-size: 1.5rem; font-weight: 500;}
.btn-txt-go-w::after {content: ''; display: block; width: 1.2rem; height: 1.2rem; flex: 0 0 1.2rem; background: url(../images/ic_arrow_right3.svg) no-repeat center / contain; filter:invert();}
.btn-refresh {border-radius: 1rem; background: var(--Red_200, #FF7B7B) !important; color: var(--White, #FFFFFF) !important; padding: .8rem !important;}
.btn-emtpy {border-radius: 1rem;  color: var(--Black, #263238) !important; padding: .8rem !important;}
.btn-outline-w {display: flex; min-width: 20rem; padding: 1.6rem 2rem; justify-content: space-between; align-items: center; text-align: center; margin: 0 auto; border: .1rem solid var(--White, #FFF) !important; background: transparent; color: var(--White, #FFF); color: var(--White, #FFF); font-size: 1.8rem; font-weight: 400; line-height: 2.2rem;}
.btn-outline-w::after {content: ''; width: 2rem; height: 2rem; display: block; background: url(../images/ic_arrow_right_w.svg) no-repeat center / contain;}

.btn-more {border-radius: .8rem; background-color: #f5f5f5;  padding: 1rem 1rem; display: flex; gap: 1.6rem; align-items: center; font-size: 1.4rem; font-weight: 400;}
.btn-more::after {content: ''; display: block; width: 2rem; height: 2rem; background: url(../images/ic_arrow_down5.svg) no-repeat center / contain;}
.btn-more.active::after {transform: rotate(180deg);}
.btn-more2 {display: flex; width: 30%; max-width: 32rem; height: 4.8rem; padding: 1.4rem 1.8rem; justify-content: center; align-items: center; gap: .8rem; border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE) !important; background: var(--White, #FFF); color: var(--Black, #263238); text-align: center; font-size: 1.6rem; font-weight: 600; line-height: 2rem; margin: 0 auto;}
.btn-more2::after {display: block; content: ''; width: 1.6rem; height: 1.6rem; background: url(../images/ic_add.svg) no-repeat center / contain;}

.btn-more3 {border-radius: .8rem; border: 1px solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); display: flex; width: 100%; padding: 2rem 2.4rem 2rem 2.8rem; justify-content: center; align-items: center; gap: 8px; color: var(--Black, #263238); text-align: center; font-size: 1.8rem; font-weight: 600; line-height: 2.2rem;}
.btn-more3::after {display: block; content: ''; width: 2rem; height: 2rem; background: url(../images/ic_add.svg) no-repeat center / contain;}

.btn-more4 {width: 2rem; height: 2rem; display: flex; justify-content: center; align-items: center; background: #fff; font-size: 1px; text-indent: -200px; overflow: hidden;}
.btn-more4::after {content: ''; display: block; flex: 0 0 2rem; width: 2rem; height: 2rem; background: url(../images/ic_arrow_down5.svg) no-repeat center / 100% 100%;}
.btn-more4.active::after {transform: rotate(180deg);}
.btn-calendar {width: 2.4rem; height: 2.4rem; display: inline-block; border: .06rem solid var(--Line_Default) !important; border-radius: 1.2rem; overflow: hidden; text-indent: -200px; font-size: 1px; background: url(../images/ic_calendar.svg) no-repeat center / 2.4rem 2.4rem #fff;}
.btn-calendar2 {width: 2.4rem; height: 2.4rem; display: inline-block; overflow: hidden; text-indent: -200px; font-size: 1px; background: url(../images/ic_calendar2.svg) no-repeat center / 2rem 2rem #fff; margin-left: -4.4rem; margin-right: 1.2rem;}
.btn-filter {display: inline-block; border-radius: 1.6rem; border: 1px solid var(--Line_Default) !important; width: 3.2rem; height: 3.2rem; background: url(../images/ic_filter.svg) no-repeat center / 1.6rem 1.6rem; overflow: hidden; font-size: 1px; text-indent: -200px;}
.btn-viewtable, .btn-viewtable-m {width: 2.4rem; height: 2.4rem; background: url(../images/ic_download.svg) no-repeat center / 100% 100%; overflow: hidden; font-size: 1px; text-indent: -200px; display: inline-block;}
.btn-download2 {width: 2.4rem; height: 2.4rem; background: url(../images/ic_download2.svg) no-repeat center / 2rem auto; overflow: hidden; font-size: 1px; text-indent: -200px; display: inline-block;}
.btn img.gray {opacity: .7;}

/* popup */
.pop {position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: var(--Black_bg); z-index: 10; display: flex; align-items: center; justify-content: center; visibility: hidden; opacity: 0; pointer-events: none; transition: opacity .3s; padding: 2rem;}
.pop.show {visibility: visible; opacity: 1; pointer-events: all;}
.pop-container {display: flex; width: 100%; max-width: 43rem; padding: 5.8rem 3.2rem; flex-direction: column; justify-content: center; align-items: center; border-radius: .8rem; background: var(--White, #FFF);}
.pop h3 {font-size: 2.0rem; font-weight: 700; line-height: 3.4rem; margin-bottom: 1.8rem; color: var(--Black)}
.pop p {text-align: center; font-size: 1.7rem; font-weight: 400; line-height: 2.4rem; color: #757575;}
.pop .btn-wrap {margin-top: 3rem; display: flex; gap: .8rem; width: 100%; justify-content: center;}
.pop .btn-wrap .btn {max-width: 24rem; width: 100%;}

.pop-b .pop-container {max-width: 64rem; border-radius: 1.6rem;}
.pop-b .pop-head {display: flex; justify-content: space-between; width: 100%;}
.pop-b .pop-head h3 {font-size: 3.2rem;}
.pop-b .pop-close {display: block; width: 2.4rem; height: 2.4rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; border: 0;}
.pop-b .pop-body {display: flex; flex-direction: column; width: 100%; height: calc( 100% - 8.2rem ); padding-top: 2.4rem;}

.pop-c .pop-container {max-width: 56rem; border-radius: .8rem; padding: 0; overflow: hidden; max-height: 90%; position: relative;}
.pop-c .pop-head {display: flex; justify-content: space-between; width: 100%;  padding: 1.5rem 4rem; align-items: center;}
.pop-c .pop-head h3 {font-size: 1.6rem; line-height: 3.4rem; margin-bottom: 0; font-weight: 600; letter-spacing: 0.03rem; color: var(--Black)}

.tit-wrap2 {display: flex; flex-direction: row; gap: 1.6rem; margin: 1.6rem 0; flex: 1; padding-right: 3.2rem; justify-content: space-between; align-items: center; margin-bottom: 3.6rem; position: absolute; top: 0; left: 4rem; width: calc(100% - 5rem); height: 9.2rem;}
.tit-wrap2 .tit {gap: .4rem; flex-direction: column; align-items: start;}
.tit-wrap2 .tit h3 {margin-top: 0.2rem; margin-bottom: 0; font-size: 19px;}
.tit-wrap2 .tit p {text-align: left;}

.pop-c .pop-close {display: block; width: 2.1rem; height: 2.1rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; border: 0; margin-left: auto;}
.pop-c .pop-body {padding: 2rem 4rem; width: 100%; height: calc( 100% - 10.4rem ); overflow: auto;}
.pop-c .pop-body h4 {margin-bottom: 1.4rem; font-size: 1.7rem; letter-spacing: 0.1px;}
.pop-c .pop-body h4 small {font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: var(--Subbody_01);}
.pop-c .pop-body h5 {margin-bottom: 1.6rem; font-size: 1.6rem; line-height: 2rem; font-weight: 600; display: flex; gap: .8rem; align-items: center; letter-spacing: 0.1px;}
.pop-c .pop-body h5 img {width: 2.4rem;}

.pop-c .pop-btn-wrap {display: flex; gap: 1.6rem; width: 100%; padding: 4rem 0 0;}
.pop-c .pop-btn-wrap > * {flex: 1;}
.pop-c .pop-footer {padding: 3.2rem 4rem 4rem; width: 100%;}
.pop-c .pop-footer .pop-btn-wrap {padding: 0;}
/* .pop-c .pop-footer .pop-btn-wrap button {min-width: calc( 50% - 1.6rem );} */

.pop-progress .pop-container { width: calc( 100% - 8rem ); max-width: 33.8rem; margin: 4rem;}
.pop-progress .pop-body {padding: 0; width: 100%;}
.pop-progress h4 {font-weight: 600; font-size: 1.6rem; line-height: 2.2rem; margin-bottom: 1.8rem;}

.progressbar {
    background: linear-gradient(90deg, #ff7b7b, #FFD9D9);
    height: 100%;
}

.progress-text {
    text-align: right; /* 오른쪽 끝 정렬 */
    color: #ff7b7b;
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0.2rem 0 0 0; /* progress bar와 간격 조절 */
}

.progressbar-box {
  width: 100%; /* 전체 폭의 95%만 사용 */
  height: 0.6rem;
  background: #EEEEEE;
  border-radius: 5px;
  overflow: hidden;
  margin: 0rem auto 0.7rem; /* 자동 좌우 정렬 */
}

.progressbar-box95 {
  width: 95%; /* 전체 폭의 95%만 사용 */
  height: 0.6rem;
  background: #EEEEEE;
  border-radius: 5px;
  overflow: hidden;
  margin: 3rem auto 0.7rem; /* 자동 좌우 정렬 */
}

.progressbar {
  /* background: linear-gradient(90deg, #ff7b7b, #FFD9D9); */
  background: #ff7b7b;
  height: 100%;
}

.progress-labels {
  display: flex;
  justify-content: space-between; /* 양 끝 배치 */
  margin-top: 1.3rem; /* bar와의 간격 */
  width: 95%; /* bar 폭과 맞추기 */
  margin-left: auto;
  margin-right: auto;
}

.left-text {
    color: #848484;
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0;
}

.right-text {
    color: #909090;
    font-size: 1.4rem;
    font-weight: 400;
    margin: 0;
}

.pop-detail {padding: 2rem;}
.pop-detail .pop-container {max-width: 64rem; border-radius: 1.6rem; overflow: hidden; max-height: 90%; padding: 0;}
.pop-detail .pop-head {display: flex; justify-content: space-between; width: 100%; background: var(--White, #FFF); padding: 2.4rem 3.2rem 1.6rem; align-items: center;}
.pop-detail .pop-head h3 {font-size: 3.2rem;}
.pop-detail .pop-close {display: block; width: 2.4rem; height: 2.4rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; border: 0; margin-left: auto;}
.pop-detail .pop-body {padding: 0 3.2rem 3.2rem; width: 100%; height: calc( 100% - 7.2rem ); overflow: auto;}
.pop-detail .review-card {width: 100%; border: none; padding: 0;}
.pop-detail .review-card .badges span {padding: .4rem .8rem; min-width: 5.8rem;}
.pop-detail .review-card .badges span::before,
.pop-detail .review-card .badges span::after {display: none;}

.pop-main {padding: 2rem;}
.pop-main .pop-container {max-width: 56.5rem; border-radius: 20; padding: 0; overflow: hidden; max-height: 90%;}
.pop-main .pop-head {background: #f4f4f4; color: #263238; display: flex; flex-direction: column; align-items: start; gap: 2.4rem; width: 100%; padding: 3rem 4rem;}
.pop-main .pop-head img {width: 1.6em;}
.pop-main .pop-head h3 {font-size: 1.7rem; font-weight: 500; line-height: 3.2rem; margin-bottom: .1rem;}
.pop-main .pop-head p {font-size: 2rem; font-weight: 500; line-height: 3rem; text-align: left;}
.pop-main .pop-body {padding: 4rem; width: 100%; height: calc( 100% - 10.4rem ); overflow: auto; text-align: left; font-size: 2rem; font-weight: 500; line-height: 3rem;}
.pop-main .pop-body > * {text-align: left; font-size: 1.6rem; font-weight: 500; line-height: 2.5rem;}
.pop-main .pop-body h4 {font-size: 1.5rem; line-height: 2.2rem; color: #3E3E3E; font-weight:}
.pop-main .pop-body .link-wrap {text-align: right !important; font-size: 1.4rem; line-height: 1.8rem;}
.pop-main .pop-footer {width: 100%; border-top: .1rem solid var(--Line_Default, #DEDEDE); display: flex; padding: 0 2rem;}
.pop-main .pop-footer button {padding: 2rem 2.4rem; flex: 1; background: #fff;}
.pop-main .pop-footer button:nth-of-type(1) {text-align: left; color: var(--Subbody_03, #B1B1B1); font-size: 1.6rem; font-weight: 500; line-height: 2.2rem; border-right: .1rem solid var(--Line_Default, #DEDEDE); text-decoration: underline;}
.pop-main .pop-footer button:last-of-type {text-align: right;}
.pop-main .pop-footer .btn-close {text-align: right; font-size: 1.8rem; font-weight: 600; line-height: 2.2rem; color: var(--Black) !important; border-right: none !important;}

/* 공시 팝업 전용 */
#popup_layer .pop-head {
    flex-direction: row;
    align-items: center;
    gap: 12px;
}

#popup_layer .pop-head img {
    width: 48px;
    height: 48px;
    flex-shrink: 0;
}

#popup_layer .pop-head h3 {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 0;
}

#popup_layer .pop-head p {
    font-size: 1.4rem;
    font-weight: 400;
    color: #999999;
}

/* tooltip */
.tooltip {position: absolute; background-color: var(--Black); color: #fff; padding: .8rem 1.6rem; border-radius: .8rem; font-size: 1.4rem; pointer-events: none; transform: translateX(-50%); opacity: 0; transition: opacity 0.2s ease; font-weight: 400; text-align: center; transition: all .3s ease; width: max-content; max-width: 36.2rem; left: 50%; bottom: calc(100% + 1rem); z-index: 1;}
.btn-help:hover ~ .tooltip {opacity: 1;}
.tooltip::after {content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: .8rem .8rem 0 .8rem; border-color: var(--Black) transparent transparent transparent; position: absolute; left: 50%; top: 100%; transform: translate(-50%);}
.tooltip.right {left: auto; right: -1rem; transform: none;}
.tooltip.right::after {left: auto; right: .6rem;}
.tooltip.left {left: -1rem; transform: none;}
.tooltip.left::after {left: 2.2rem;}

.toast {position: absolute; background-color: var(--Black); color: #fff; padding: 1.2rem 1.6rem; border-radius: .8rem; font-size: 1.4rem; pointer-events: none; transform: translateX(-50%); opacity: 0; transition: opacity 0.2s ease; font-weight: 400; text-align: center; transition: all .3s ease; width: max-content; max-width: 36.2rem; left: 50%; bottom: calc(100% + 1rem); z-index: 1;}
.toast.show {opacity: 1;}

/* table */
.tbl-basic {border-collapse: collapse; table-layout: auto; border: 0; padding: 0; border-top: .1px solid var(--Line_Default, #DEDEDE); width: 100%; background:var(--White, #fff); margin-bottom: 5.6rem;}
.tbl-basic th {background: var(--BG_body, #F7F7F7); border-bottom: 1px solid var(--Line_Default, #DEDEDE); font-weight: 600; vertical-align: middle; padding: 1.8rem .8rem; text-align: center; font-size: 1.5rem; line-height: 2rem;}
.tbl-basic td {background: var(--White, #fff); border-bottom: 1px solid var(--Line_Default, #DEDEDE); font-weight: 400; vertical-align: middle;  padding: 1.8rem .8rem; text-align: center; font-size: 1.5rem; line-height: 2.4rem; color: #5a5a5a;}
.tbl-basic tbody th {background: var(--White, #fff);}
.tbl-basic.min th, .tbl-basic.min td {font-size: 1.4rem; padding: 1.6rem .4rem;}
.tbl-basic.v2 th {background: var(--BG_subbody);}

.tbl-basic2 {border-collapse: collapse; table-layout: auto; border: 0; padding: 0; border-top: .2rem solid var(--Subbody_01, #848484); width: 100%; background:var(--White, #fff); margin-bottom: 5.6rem;}
.tbl-basic2 th {background: var(--BG_body, #F7F7F7); border-bottom: 1px solid var(--Line_Default, #DEDEDE); font-weight: 600; vertical-align: middle; padding: 2.4rem 1.6rem; text-align: left; font-size: 1.5rem; line-height: 2rem;}
.tbl-basic2 td {background: var(--White, #fff); border-bottom: 1px solid var(--Line_Default, #DEDEDE); font-weight: 400; vertical-align: middle;  padding: 2.2rem 2.4rem; text-align: left; font-size: 1.5rem; line-height: 2.4rem;}
.tbl-basic2.v2 th {background: var(--BG_subbody);}

.tbl-list {margin-bottom: 2.4rem; border-collapse: separate;}
.tbl-list th {font-size: 1.5rem; font-weight: 600; line-height: 2rem; padding: .4rem 0; text-align: left;}
.tbl-list td {color: var(--Subbody_01, #848484); font-size: 1.5rem; font-weight: 400; line-height: 2.4rem; padding: 1.2rem 0;}
.tbl-list tr:first-child th, .tbl-list tr:first-child td {padding-top: 0;}
.tbl-list tr:last-child td {padding-bottom: 0;}
.graybox .tbl-list {margin: 0;}

.tbl-simple {border-top: .1rem solid var(--Black, #263238); width: 100%; margin-bottom: 1.6rem;}
.tbl-simple tbody {border-bottom: 1px solid var(--Line_Default, #DEDEDE);}
.tbl-simple th {font-size: 1.4rem; font-weight: 400; line-height: 2.4rem; text-align: left;}
.tbl-simple td {font-size: 1.4rem; font-weight: 400; line-height: 2.4rem; text-align: right;}
.tbl-simple th.strong, .tbl-simple td.strong {font-size: 1.6rem; font-weight: 600; line-height: 2rem; padding-bottom: .6rem;}
.tbl-simple tr:first-child th, .tbl-simple tr:first-child td {padding-top: 1.6rem;}
.tbl-simple tr:last-child th, .tbl-simple tr:last-child td {padding-bottom: 1.6rem;}

.tbl-simple2 {width: 100%; margin-bottom: 1.6rem;}
.tbl-simple2 tbody {border-bottom: 1px solid var(--Line_Default, #DEDEDE);}
.tbl-simple2 th {color: var(--Black, #263238); font-size: 1.6rem; font-weight: 600; line-height: 2.2rem; text-align: left;}
.tbl-simple2 td {color: var(--Black, #263238); text-align: right; font-size: 1.6rem; font-weight: 600; line-height: 2.2rem; padding: 3.4px 0;}
.tbl-simple2 tr:first-child th, .tbl-simple2 tr:first-child td {padding-top: 1.5rem;}
.tbl-simple2 tr:last-child th, .tbl-simple2 tr:last-child td {padding-bottom: 1rem;}
.tbl-simple2 .sub {color: #5a5a5a; font-size: 1.5rem; font-weight: 400; line-height: 2.4rem; padding-left: 1rem; position: relative;}
.tbl-simple2 .sub::before {display: inline-block; width: .3rem; height: .3rem; border-radius: .2rem; background: var(--Subbody_01); position: absolute; top: .8rem; left: .8rem;}

.tbl-simple3 {width: 100%;}
.tbl-simple3 tbody {border-bottom: 1px solid var(--Line_Default, #DEDEDE);}
.tbl-simple3 th {color: var(--Subbody_01, #848484); font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; text-align: left; padding: .8rem 0;}
.tbl-simple3 td {color: var(--Black, #263238); text-align: right; font-size: 1.8rem; font-weight: 500; line-height: 2.2rem; padding: .8rem 0;}
.tbl-simple3 tr:first-child th, .tbl-simple3 tr:first-child td {padding-top: 1.6rem;}
.tbl-simple3 tr:last-child th, .tbl-simple3 tr:last-child td {padding-bottom: 1.6rem;}
.tbl-simple3 tbody:first-of-type tr:first-child th, .tbl-simple3 tbody:first-of-type .tbl-simple3 tr:first-child td {padding-top: 0 !important;}

.tbl-a {table-layout: auto; border: 0; padding: 0; width: 100%; background: var(--White, #fff);}
.tbl-a th {border-top: .1px solid var(--Gray_200); font-weight: 500; vertical-align: top; padding: 2.4rem 3.8rem 2.4rem .8rem; text-align: left; font-size: 1.5rem; line-height: 2.4rem; position: relative;}
.tbl-a td {border-top: .1px solid var(--Gray_200); font-weight: 400; vertical-align: middle;  padding: 2.4rem .8rem 6.4rem; text-align: left; font-size: 1.5rem; line-height: 2.4rem; position: relative;}
/* .tbl-a th::before, .tbl-a td::before {content: ''; width: 100%; height: .1px; background: var(--Gray_200); display: block; position: absolute; top: 0; left: 0;}
.tbl-a th::before {width: calc( 100% - 3rem );} */

.tbl-b-wrap {overflow: hidden; border-radius: 1.6rem; border: .1rem solid var(--Line_Default, #DEDEDE);}
.tbl-b {border-collapse: collapse; table-layout: auto; border: 0; padding: 0; width: 100%; background: var(--White, #fff); border-radius: 1.6rem;}
.tbl-b thead th {font-size: 1.6rem; font-weight: 600; line-height: 2rem; border-bottom: 1px solid var(--Line_Default, #DEDEDE); background: var(--BG_subbody, #F1F3F5); text-align: center; padding: 1.8rem .8rem; color: var(--Black);}
.tbl-b td {font-weight: 400; padding: 1.8rem .8rem; text-align: center; font-size: 1.6rem; line-height: 2.4rem; color: var(--Black);}

.tbl-c {border-collapse: collapse; table-layout: auto; border: 0; padding: 0; border-top: .2rem solid var(--Subbody_01, #848484); width: 100%; background: var(--White, #fff);}
.tbl-c thead th {font-size: 1.6rem; font-weight: 600; line-height: 2rem; border-bottom: 1px solid var(--Line_Default, #DEDEDE); background: var(--BG_body, #F7F7F7); text-align: center; padding: 1.8rem .8rem; color: var(--Black); font-size: 1.4rem;}
/* .tbl-c tbody tr {border-top: 1.6rem solid #fff;} */
.tbl-c td {font-weight: 400; padding: 1.0rem .8rem; text-align: center; font-size: 1.4rem; line-height: 2.4rem; color: var(--Black); background: var(--BG_body, #F7F7F7); vertical-align: middle;}
.tbl-c td:first-child {border-top-left-radius: 1.6rem; border-bottom-left-radius: 1.6rem;}
.tbl-c td:last-child {border-top-right-radius: 1.6rem; border-bottom-right-radius: 1.6rem;}
.tbl-c .space {background: #fff; height: 1.6rem; padding: 0;}



.tbl-head {display: flex; justify-content: space-between; margin-bottom: 1.6rem;}
.tbl-head h3 {color: var(--Black, #263238); font-size: 1.8rem; font-weight: 700; line-height: 2.4rem; display: flex; gap: 0.3rem; align-items: center;}
.tbl-head h3 small {color: var(--Subbody_01, #848484); font-size: 1.2rem; font-weight: 400; line-height: 2rem; margin-top: .2rem;}
.tbl-wrap.mini table tr:nth-child(n+5) {display: none;}


/* pagination */
.pagination {display: flex; gap: 4rem; justify-content: center; align-items: center; padding: 4rem; font-size: 17px; color: #686868;}
.pagination a[class^='btn'] {display: inline-block; width: 2.4rem; height: 2.4rem; line-height: 2.4rem; background-repeat: no-repeat; background-position: center; background-size: 1.6rem auto; overflow: hidden; font-size: 1px; text-indent: -10rem;}
.pagination .btn-prev {background-image: url(../images/arrow-left.svg);}
.pagination .btn-next {background-image: url(../images/arrow-right.svg);}
.pagination ul {display: flex; gap: .4rem; align-items: center;}
.pagination li a {color: var(--darkGray); font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; display: block; padding: .6rem 1.4rem; text-align: center;}
.pagination li a.active,
.pagination > a.active:not([class^='btn']) {color: var(--Red_200, #ff5252) !important; font-weight: 500;}

.page-dot {display: flex; gap: .8rem; position: absolute; right: 0; bottom: 0;}
.page-dot li {width: 1rem; height: 1rem; border-radius: .5rem; background: var(--Subbody_04, #CCC); font-size: 1px; overflow: hidden; text-indent: -10rem;}
.page-dot li.active {background: #263238; width: 2.6rem;}

.page-dot2 {display: flex; gap: .8rem; margin-top: 3rem;}
.page-dot2 li {width: 1rem; height: 1rem; border-radius: .5rem; background: var(--Subbody_04, #CCC); font-size: 1px; overflow: hidden; text-indent: -10rem;}
.page-dot2 li.active {background: #263238; width: 2.6rem;}


/* tabs */
.tabs {margin-bottom: 1.6rem;}
.tabs ul {display: flex; position: relative;}
.tabs li {flex: 1;}
.tabs li a {display: block; padding: 1.5rem; text-align: center; border-radius: .8rem .8rem 0 0; border-bottom: .165rem solid #f3f3f3; background: var(--White); color: var(--Subbody_01, #848484); font-weight: 500; font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; white-space: nowrap;}
.tabs li a.active {background: var(--White); border-bottom: .165rem solid var(--Red_200); color: var(--Red_200); font-weight: 700; font-size: 1.4rem;}
.tab-content {display: none;}
#tab-content1 {display: block;}
.tab-content7 {display: none;}
#tab-content7 {display: block;}

.tabs1 {margin-bottom: 1.6rem;}
.tabs1 ul {display: flex; position: relative;}
.tabs1 li {flex: 1;}
.tabs1 li a {display: block; padding: 1.6rem; text-align: center; border-radius: .8rem .8rem 0 0; border-bottom: .1rem solid var(--Line_Default); background: #fff; color: var(--Black); font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; white-space: nowrap;}
.tabs1 li a.active {background: var(--Red_100); border-bottom: 1px solid var(--Red_500); color: var(--Red_500); font-weight: 700;}

.tabs2 {}
.tabs2 ul {display: flex; position: relative; gap: 3rem;}
.tabs2 li {flex: 1; white-space: nowrap;}
.tabs2 li a {display: block; padding: 1.4rem 0; text-align: center; font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; color: #848484;}
.tabs2 li a.active {border-bottom: 2.1px solid var(--Black); color: var(--Black); font-weight: 700;}
.tabs2.v2 ul {gap: 4rem; overflow: auto;}
.tabs2.v2 li {flex: 0;}

.tabs3 {}
.tabs3 ul {display: block; position: relative; width: 100%; border-bottom: 0.1px solid var(--Line_Default, #DEDEDE);}
.tabs3 li {flex: 1; white-space: nowrap;}
.tabs3 li a {display: block; padding: 1.4rem 4rem; text-align: center; font-weight: 400; font-size: 1.6rem; line-height: 2.4rem;}
.tabs3 li a.active {border-bottom: 0.2rem solid var(--Red_400); color: var(--Red_200); font-weight: 700; padding: 1.4rem 4rem 1.1rem;}
.tabs3 .slick-next {width: 2.4rem; height: 5.4rem; background: url(../images/ic_tab_arrow_next.svg) no-repeat center / 2.5rem 5.2rem #fff; border: none !important; border-radius: 0; border-top-right-radius: .4rem; border-bottom-right-radius: .4rem; margin-top: -1rem; right: 0;}
.tabs3 .slick-prev {width: 2.4rem; height: 5.4rem; background: url(../images/ic_tab_arrow_prev.svg) no-repeat center / 2.5rem 5.2rem #fff; border: none !important; border-radius: 0; border-top-left-radius: .4rem; border-bottom-left-radius: .4rem; margin-top: -1rem; left: 0;}
.tabs3 .slick-next:hover {background-image: url(../images/ic_tab_arrow_next_on.svg);}
.tabs3 .slick-prev:hover {background-image: url(../images/ic_tab_arrow_prev_on.svg);}
.tabs3 .slick-disabled {display: none !important;}

.tabs4 {background: #fff; padding: .8rem; border-radius: 1.6rem; margin-bottom: 2.6rem;}
.tabs4 ul {display: flex; gap: .6rem;}
.tabs4 li {flex: 1;}
.tabs4 li a {display: flex; padding: 1.8rem .8rem 1.8rem 1.6rem; justify-content: center; align-items: center; border-radius: 1.6rem; background: var(--BG_subbody, #F1F3F5); font-size: 1.6rem; line-height: 2.4rem; font-weight: 500; color: #5a5a5a;}
.tabs4 li a.active {background: var(--Red_100); color: var(--Red_400);}

.tabs5 {margin-bottom: 5.4rem;}
.tabs5 ul {display: flex; position: relative; gap: .8rem;}
.tabs5 li {flex: 1;}
.tabs5 li a {display: block; padding: 1.6rem; text-align: center; border-radius: 1.6rem; border: 1px solid var(--Violet_500, #6D35DE); background: var(--Violet_100, #F8F5FF); color: var(--Violet_500, #6D35DE); font-weight: 500; font-size: 1.8rem; line-height: 2.2rem; white-space: nowrap;}
.tabs5 li a.active {background: var(--Red_400); border-bottom: .1rem solid var(--Violet_600, #6D35DE); color: #fff; font-weight: 700;}

.tabs6 {margin-bottom: 3.2rem;}
.tabs6 ul {display: flex; position: relative; gap: .8rem;}
.tabs6 li {}
.tabs6 li a {display: block; padding: 1.3rem; text-align: center; border-radius: .8rem; border: 1px solid var(--Violet_500, #6D35DE); background: var(--Violet_100, #F8F5FF); color: var(--Violet_500, #6D35DE); font-weight: 500; font-size: 1.6rem; line-height: 2rem; white-space: nowrap; min-width: 12rem;}
.tabs6 li a.active {background: var(--Violet_600, #6D35DE); border-bottom: .1rem solid var(--Violet_600, #6D35DE); color: #fff; font-weight: 700;}

.tabs7 {border-bottom: 1px solid var(--Line_Default);}
.tabs7 ul {display: flex; position: relative; gap: 3.6rem;}
.tabs7 li {flex: 0; white-space: nowrap;}
.tabs7 li a {display: block; padding: 1.4rem 0; text-align: left; font-weight: 500; font-size: 1.6rem; line-height: 2.2rem; width: auto; color: #828282;}
.tabs7 li a.active {border-bottom: .3rem solid var(--Black); color: var(--Black); font-weight: 600; font-size: 1.6rem;}
.tabs7.v2 ul {gap: 4rem; overflow: auto;}
.tabs7.v2 li {flex: 0;}

.tabs8 {padding-bottom: 5rem;}
.tabs8 ul {display: flex; position: relative; gap: 4rem;}
.tabs8 li {flex: 1; white-space: nowrap;}
.tabs8 li a {display: block; padding: 1.4rem 0; text-align: center; font-weight: 500; font-size: 1.6rem; line-height: 2.2rem;}
.tabs8 li a.active {border-bottom: .3rem solid var(--Violet_600, #5221B5); color: var(--Violet_600, #5221B5); font-weight: 700;}
.tabs8.v2 ul {gap: 4rem; overflow: auto;}
.tabs8.v2 li {flex: 0;}

/* badge */
/* [class^='badge-'] {display: inline-block; padding: .4rem .8rem; border-radius: .4rem; text-align: center; vertical-align: middle; font-size: 1.1rem !important; line-height: 2rem !important; font-weight: 600 !important; justify-content: center; align-items: center; white-space: nowrap;} */
/* 공통 스타일 수정 */
[class^='badge-'] {
    display: inline-flex !important; /* flex로 변경하여 내부 정렬 최적화 */
    justify-content: center;
    align-items: center;
    padding: .5rem 1.2rem; 
    border-radius: .4rem; 
    font-size: 1.2rem !important; 
    line-height: 2rem !important; 
    font-weight: 600 !important; 
    white-space: nowrap; /* 글자 줄바꿈 절대 방지 */
    
    /* 너비 관련 설정 */
    width: auto !important; /* 고정 너비 해제 */
    min-width: 4.8rem; /* 최소 너비는 유지 */
}

/* 배지들을 감싸는 부모 div (.badge) 설정 */
.badge {
    display: flex !important;
    flex-wrap: nowrap; /* 배지끼리 줄바꿈 방지 */
    gap: .4rem; /* 배지 사이 간격 */
    justify-content: flex-start;
    align-items: center;
}
/* [class^='badge-b'] {min-width: 4.8rem;} */
/* 기존 코드를 이렇게 변경해보세요 */
[class^='badge-b'] {
    min-width: 4.8rem; /* 최소 너비는 유지해서 짧은 글자(대기 등)도 예쁘게 나오게 함 */
    width: auto !important; /* 핵심: 고정 너비를 해제하여 긴 글자가 오면 늘어나게 함 */
}
.badge-a1 {background: var(--BG_body, #F7F7F7) !important; color: var(--Black, #263238) !important;}
.badge-a2 {background: #FFFAEC !important; color: #BF8C00 !important;}
.badge-a3 {background: var(--Green_100, #EDFDF8) !important; color: var(--Green_400, #259671) !important;}
.badge-a4 {background: var(--Surf-Blue_100, #F0F9FF) !important; color: var(--Surf-Blue_400, #026AA2) !important;}
.badge-a5 {background: var(--Violet_100, #F8F5FF) !important; color: var(--Violet_600, #5221B5) !important;}
.badge-a6 {background: var(--Blue-100, #F0F5FF) !important; color: var(--Blue-400, #2F6FED) !important;}
.badge-a7 {background: var(--Orange_100, #FFF3E6) !important; color: var(--Orange_400, #FF8500) !important;}
.badge-a8 {background: var(--Red-100, #FFF1F1) !important; color: var(--Red-400, #FF5252) !important;}
.badge-a9 {background: #fff !important; color: var(--Subbody_01, #848484) !important;}
.badge-b1 {background: var(--Subbody_01, #848484) !important; color: #fff !important;}
.badge-b2 {background: var(--Green_400, #259671) !important; color: #fff !important;}
.badge-b3 {background: var(--Violet_600, #5221B5) !important; color: #fff !important;}
.badge-b4 {background: var(--Blue-400, #2F6FED) !important; color: #fff !important;}
.badge-b5 {background: var(--Gold_400, #D97706) !important; color: #fff !important;}
.badge-b6 {background: var(--Red-400, #FF5252) !important; color: #fff !important;}
.badge-b6_1 {background: #ffe1e1 !important; color: #ff746c !important;}
.badge-b6_2 {background: #FF6961 !important; color: #fff !important;}
.badge-b6_3 {background: #fff !important; color: #1A3DA5 !important;}
.badge-b7 {background: var(--Black, #263238) !important; color: #fff !important;}
.badge-b8 {background: #999999 !important; color: #fff !important;}
.badge-b9 {background: var(--Red_200, #FF7B7B) !important; color: #fff !important;}
.badge-b10 {background: var(--Surf-Blue_400, #026AA2) !important; color: #fff !important;}
.badge-b11 {background: var(--Orange_400, #FF8500) !important; color: #fff !important;}
.badge-b12 {background: #0b5e5e !important; color: #fff !important;}

.product_badge {
font-family: 'Spoqa Han Sans Neo', 'Pretendard', sans-serif;
font-size: 12px;
color: #212121;
font-weight: 600;
border: 0.0625rem solid #fff;
border-radius: 4px;
background: #fff;
padding: .25rem .45rem;
}

.product_badge_location{
position: absolute !important;
left : 30px;
top : 80px;
}

/* list */
.list-dot > li {color: #828282; font-size: 1.5rem; font-weight: 400; line-height: 2.3rem; position: relative; padding-left: 2rem; word-break: keep-all;}
.list-dot > li::before {content: ''; width: .3rem; height: .3rem; border-radius: .2rem; display: inline-block; background: var(--Subbody_01, #848484); position: absolute; top: 1rem; left: .8rem;}

.list-dot2 {padding-left: 2rem; position: relative;}
/* .list-dot2 > li {list-style: disc !important;} */
.list-dot2 > li {color: var(--darkGray); font-size: 1.4rem; font-weight: 500; line-height: 2.4rem; position: relative; padding-left: 2rem; word-break: keep-all;}
.list-dot2 > li::before {content: ''; width: .4rem; height: .4rem; border-radius: .2rem; display: inline-block; background: var(--Black); position: absolute; top: .95rem; left: .8rem;}
.list-dot2 .list-dot {margin-top: .8rem; margin-left: -.8rem;}

.list-bar > li {color: var(--Subbody_01, #848484); font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; position: relative; padding-left: 2rem; word-break: keep-all;}
.list-bar > li::before {content: '-'; width: .4rem; height: .4rem; border-radius: .2rem; display: inline-block; position: absolute; top: 0; left: .8rem;}

.list-star > li {color: var(--Subbody_01, #848484); font-size: 1.4rem; font-weight: 400; line-height: 2.4rem; position: relative; padding-left: 1.2rem; word-break: keep-all;}
.list-star > li::before {content: '*'; display: inline-block; position: absolute; top: 0; left: .4rem;}

.list-num > li {list-style: decimal; margin-left: 1.6rem; padding: .1rem 0;}
.list-num > li:first-child {padding-top: 0;}
.list-num > li:last-child {padding-bottom: 0;}

.list-num2 {display: flex; counter-reset: item; gap: 0.8rem; flex-direction: column;}
.list-num2 > li {list-style: none; display: flex; gap: .8rem; align-items: start; color: #5a5a5a;}
.list-num2 > li::before {counter-increment: item; content: counter(item); color: #fff; width: 2.4rem; height: 2.4rem; flex: 0 0 2.4rem; border-radius: 1.2rem; text-align: center; line-height: 2.4rem; padding: 0; font-size: 1.4rem; font-weight: 500; display: inline-block; background: var(--Pure_blue_400); margin-top: -.1rem;}
.list-num2.no-circle > li::before {
    background: none;
    color: var(--Black);
    font-size: 1.5rem;
    font-weight: 700;
    width: auto;
    height: auto;
    border-radius: 0;
    line-height: inherit;
}

.list-num3 {display: flex; counter-reset: item; gap: 1.6rem; flex-direction: column;}
.list-num3 > li {list-style: none; display: flex; gap: .8rem; align-items: start; color: var(--Black, #263238); font-size: 2rem; font-weight: 500; line-height: 3rem; border-bottom: 1px solid var(--Line_Default, #DEDEDE); padding-bottom: 2.4rem; margin-bottom: 2.4rem;}
.list-num3 > li::before {counter-increment: item; content: counter(item); color: #fff; width: 2.4rem; height: 2.4rem; flex: 0 0 2.4rem; border-radius: 1.2rem; text-align: center; line-height: 2.4rem; padding: 0; font-size: 1.4rem; font-weight: 500; display: inline-block; background: var(--Pure_blue_400); margin-top: .25rem;}
.list-num3.no-circle > li::before {
    background: none;
    color: var(--Black);
    font-size: 1.6rem;
    font-weight: 700;
    width: auto;
    height: auto;
    border-radius: 0;
    line-height: inherit;
}

.list-txt > li {padding: .4rem 0;}
.list-txt > li:first-child {padding-top: 0;}
.list-txt > li:last-child {padding-bottom: 0;}

tr:first-child .list-num li:first-child, tr:first-child .list-txt li:first-child {padding-top: 0;}
tr:last-child .list-num li:last-child, tr:last-child .list-txt li:last-child {padding-bottom: 0;}

.list-a {display: block; width: 100%;}
.list-a > li a {display: block; color: var(--Black, #263238);line-height: 2.8rem; padding: 1.4rem 0; border-bottom: .1rem solid var(--Line_Default);}
.list-a > li:last-child a {border-bottom: none;}

.list-b {display: block; width: 100%;}
.list-b > li {border-bottom: 1px solid var(--Line_Default, #DEDEDE); padding: 1.6rem 0;}
.list-b > li > h5 {margin-bottom: .4rem !important; font-weight: 700 !important;}
.list-b > li > p {font-size: 1.6rem; font-weight: 500; line-height: 2.4rem; text-align: left;}

.list-c {display: flex; flex-direction: column; width: 100%; gap: 1.6rem;}
.list-c > li {display: flex; gap: 1.6rem; justify-content: space-between; align-items: start; flex-wrap: wrap;}
.list-c > li > h5 {font-size: 1.6rem; line-height: 2.4rem; font-weight: 500; text-align: left;}
.list-c > li > p, .list-c > li > div {text-align: right; font-size: 1.8rem; font-weight: 500; line-height: 2.2rem; margin-left: auto;}
.list-c.v2 {gap: 0;}
.list-c.v2 > li > h5, .list-c.v2 > li > p, .list-c.v2 > li > div {font-size: 1.4rem !important; color: var(--darkGray);}

.list-d {display: flex; flex-direction: column; width: 100%; position: relative;}
.list-d > li {text-shadow: 0.1px 0.1px 0px #263238; display: flex; gap: 0 1.6rem; justify-content: space-between; align-items: start; border-bottom: 1px solid var(--Line_Default, #DEDEDE); padding: 1.2rem 0; flex-wrap: wrap; padding-left: 10px; padding-right: 10px;}
.list-d > li.noline {border-bottom: none;}
.list-d > li > h5 {text-shadow: 0.1px 0.1px 0px #909090; color: #909090; font-size: 1.6rem; font-weight: 300 !important; line-height: 2.4rem !important; margin-bottom: 0 !important; letter-spacing: -0.2px;}
.list-d > li > p, .list-d > li > div {color: var(--Black, #263238); text-align: right; font-size: 1.5rem; font-weight: 400 !important; line-height: 2.4rem !important; margin-left: auto;}
.list-d > li > p.fw600 {font-weight: 600 !important;}
.list-d.gra::after {content: ''; display: block; width: 100%; height: 5.4rem; background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 80.5%); position: absolute; bottom: 0; left: 0;}
.list-d > li.more-info {padding: 2rem; background: var(--BG_body); display: none;}
.list-d.v2 {border-top: .1rem solid var(--Black);}
.list-d.v2 > li {padding: 2.4rem 1.6rem;}
.list-d.v2 > li > h5 {font-size: 1.6rem; font-weight: 500 !important; line-height: 2.4rem !important; color: var(--Black); display: flex; gap: 2.4rem; align-items: center; text-align: left; flex: 1;}
.list-d.v2 > li > p {color: var(--Subbody_01, #848484) !important; text-align: right; font-size: 1.6rem; font-weight: 400 !important; line-height: 2.4rem !important;}
.list-d.v2 > li > p.black {color: var(--Black) !important;}
.list-d.v2 > li.detail {background: var(--BG_body, #F7F7F7); padding: 4.8rem 7.2rem; text-align: left; color: var(--Black); line-height: 2.4rem;}
.list-d.v2 > li.more-info {display: none;}
.list-d.v2 > li.active h5 {color: var(--Red-400, #FF5252);}

.list-d.v4 {flex-direction: row; gap: 0 5.6rem; flex-wrap: wrap;}
.list-d.v4 > li {flex: 0 1 calc( (100% - 5.6rem) / 2);}

.list-e {display: flex; flex-direction: column; width: 100%; gap: 0.4rem; border-top: 1px solid var(--Subbody_02); border-bottom: 1px solid var(--Subbody_02); padding: 1.5rem 0;}
.list-e > li {display: flex; gap: 1.6rem; justify-content: space-between; align-items: start;}
.list-e > li > h5 {font-size: 1.4rem !important; line-height: 2.4rem !important; font-weight: 400 !important; text-align: left; color: var(--Subbody_06); margin-bottom: 0 !important;}
.list-e > li > p {text-align: right; font-size: 1.4rem; font-weight: 400; line-height: 2.4rem}

.list-f {display: flex; flex-direction: column; width: 100%; gap: 1.6rem; border-bottom: 1px solid var(--Black, #263238); padding: 3.2rem 0;}
.list-f > li {display: flex; gap: 1.6rem; justify-content: space-between; align-items: start;}
.list-f > li > h5 {font-size: 1.6rem !important; line-height: 2.4rem !important; font-weight: 400 !important; text-align: left; color: var(--Subbody_01); margin-bottom: 0 !important;}
.list-f > li > p {text-align: right; font-size: 1.8rem; font-weight: 500; line-height: 2.2rem}

.list-g {display: flex; flex-direction: column; width: 100%; gap: 1.2rem;}
.list-g > li {display: flex; gap: 3.2rem; justify-content: start; align-items: start;}
.list-g > li > h5 {font-size: 1.5rem !important; line-height: 2.2rem !important; font-weight: 600 !important; text-align: left; color: var(--Black); margin-bottom: 0 !important;}
.list-g > li > p {text-align: left; font-size: 1.4rem !important; font-weight: 400 !important; line-height: 2.4rem}

.list-h {display: flex; gap: .4rem; flex-wrap: wrap;}
.list-h > li {font-size: 1.4rem; color: var(--Subbody_01); }
.list-h > li::after {content: 'ㅣ'; color: var(--Subbody_04); font-weight: 400; margin-left: .4rem;}
.list-h > li:last-child::after {display: none;}



/* etc */
.wrap {display: flex; flex-direction: column; background: var(--BG_subbody, #F1F3F5);}
.dim {position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, .5); z-index: 9; display: none;}
.dim.show {display: block;}
.whitebox {border-radius: .8rem; background: var(--White); display: flex; flex-direction: column; gap: 2.4rem; margin-bottom: 1.6rem;}
.graybox {border-radius: .8rem; background: var(--BG_body, #F7F7F7); padding: 3.4rem 2rem; display: flex; flex-direction: column; gap: 2.4rem; margin-bottom: 1.6rem;}
.graybox2 {border-radius: 1.6rem; background: var(--BG_body, #F7F7F7); border: .1rem solid var(--Line_Default, #DEDEDE); padding: 2.4rem; display: flex; flex-direction: column; gap: 1.4rem; margin-bottom: 1.6rem;}
.violetbox {border-radius: 1.6rem; border: .1rem solid var(--Violet_400, #8B54F7); background: var(--Violet_100, #F8F5FF); padding: 2rem; text-align: left; margin-bottom: 2.4rem;}
.bluebox {border-radius: .8rem; background: var(--Blue-100, #F0F5FF); padding: 2.4rem; display: flex; flex-direction: column; gap: 2.4rem; margin-bottom: 1.6rem;}

.tit-wrap {display: flex; gap: 1.6rem; align-items: center; justify-content: space-between; margin-bottom: 2.4rem;}
.tit-wrap > * {margin-bottom: 0 !important;}

.tip {display: inline-block; padding: .8rem 1.2rem; flex-direction: column; color: #fff; background: var(--Red_200, #FF7B7B); border-radius: .4rem; position: relative; flex: 0; width: fit-content; font-size: 1.2rem;}
.tip::after {content: ''; display: block; width: 85%; height: 85%; background: url(/images/up.svg) no-repeat center / 100% 100%; position: absolute; top: -1.6rem; left: -18%; /*transform: translateX(-50%) rotate(180deg);*/}

.bo-top {border-top: .1rem solid var(--Line_Default, #DEDEDE);}
.bo-bottom {border-bottom: .1rem solid var(--Line_Default, #DEDEDE);}
.bo-top-black {border-top: .1rem solid var(--Black);}
.bo-top-black2 {border-top: .2rem solid var(--Black);}
.bo-bottom-black {border-bottom: .1rem solid var(--Black);}
.bo-bottom-black2 {border-bottom: .2rem solid var(--Black);}
.nobo-top {border-top: none !important;}
.nobo-bottom {border-bottom: none !important;}

.fix-bottom {position: fixed; bottom: 0; left: 0; right: 0; padding: 2rem 2rem; background: #fff; z-index: 2;}
.nowrap {white-space: nowrap;}
.po-rel {position: relative;}


/* 헤더 영역 */
.header {position: fixed; top: 0; left: 0; width: 100%; height: 8rem; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; transition: all .3s ease; top: 0; padding: 0 2rem; background-color: transparent; backdrop-filter: blur(20px); background-color: rgba(255, 255, 255, 0.9);}
.header-container {max-width: 1100px; width: 100%; display: flex; align-items: center; justify-content: space-between;}
.header-container > div {width: 100%; display: flex; align-items: center; justify-content: space-between;}
.header .btn-menu {width: 4rem; height: 4rem; background: url(../images/ic_menu.svg) no-repeat center / 2.4rem 2.4rem; position: fixed; top: .8rem; right: 1.2rem; overflow: hidden; font-size: 1px; text-indent: -10rem; display: none;}
.header .nav-wrap {display: flex; gap: 6rem; align-items: center;}
.header .nav-wrap h1 {font-size: 1.8rem; font-weight: 700; white-space: nowrap;}
.header .nav-wrap h1 a {display: flex; padding: 1rem 0;}
.header .nav-wrap h1 img {width: 7rem;}
.header .nav-wrap .nav {display: flex; gap: .8rem; height: 8rem;}
.header .nav-wrap .nav > li {position: relative;}
.header .nav-wrap .nav > li > a {display: flex; padding: 2.9rem 2.4rem; text-align: center; font-size: 1.6rem; line-height: 2.4rem; transition: all .3s; color: #263238; font-weight: 600; letter-spacing: -0.3px;}
.header .nav-wrap .nav > li > ul {display: flex; width: 14.3rem; padding: .4rem .8rem; flex-direction: column; border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); position: absolute; z-index: 2; left: 50%; top: 6.8rem; transform: translateX(-50%); visibility: hidden; opacity: 0; pointer-events: none; transition: all .3s ease; margin-top: -1rem;}
.header .nav-wrap .nav > li > ul > li {display: block;}
.header .nav-wrap .nav > li:hover > ul {visibility: visible; opacity: 1; pointer-events: all; margin-top: 0;}
.header .nav-wrap .nav > li > ul > li > a {padding: 1.2rem 0; text-align: center; font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; display: block;}
.header .nav-wrap .nav > li a:hover, .header .nav-wrap .nav > li a.active {color: var(--Red_400);}
.header .nav-wrap .nav > li > a.nav-arrow {
    display: flex;
    align-items: center;
    gap: .6rem;
}
.header .nav-wrap .nav > li > a.nav-arrow::after {
    content: '';
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem;
    background: url(../images/ic_arrow_down3.svg) no-repeat center / 1.6rem 1.6rem;
    transition: transform .3s ease;
}
.header .nav-wrap .nav > li:hover > a.nav-arrow::after {
    transform: rotate(180deg);
}
.header .member-wrap {display: flex; gap: 1.6rem; align-items: center; transition: all .3s; position: relative; padding-right: .8rem;}
.header .member-wrap .user-name {display: flex; gap: 1.6rem; align-items: center; transition: all .3s;}
.header .member-wrap .badge {display: inline-block; padding: .55rem 1.6rem; height: 3.2rem; color: var(--White, #FFF); background: var(--Red_400, #FF5252); font-size: 1.2rem; font-weight: 600; line-height: 1.8rem; border-radius: 2rem; border: .16rem solid var(--Red_400, #FF5252);}
.header .member-wrap .btn-user {padding-left: 2.8rem; padding-right: 1rem; background: url(../images/user.svg) no-repeat 0 50% / 2rem auto, url(../images/ic_arrow_down3.svg) no-repeat 100% 50% / 1rem auto; font-weight: 400; height: 3.2rem;}
.header .member-wrap .btn-user strong {font-weight: 600;}
.header .member-wrap .btn-noti {width: 2rem; height: 2rem; text-indent: -10rem; background: url(../images/message.svg) no-repeat center / 100% auto; overflow: hidden;}
.header .member-wrap .btn-noti.active {background-image: url(../images/ic_notification_on.svg);}
.header .member-wrap .member-info {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); display: flex; width: 32.8rem; padding: 2.4rem; flex-direction: column; gap: 1.6rem; position: absolute; top: 3rem; right: 0; opacity: 0; pointer-events: none; visibility: hidden; transition: all .3s;}
.header .member-wrap .member-info.show {visibility: visible; opacity: 1; pointer-events: all; top: 5rem;}
.header .member-wrap .member-info h3 {font-size: 1.8rem; font-weight: 700; line-height: 2.4rem; border-bottom: .1rem dashed var(--Line_Default, #DEDEDE); padding-bottom: 1.2rem;}
.header .member-wrap .member-info ul {display: flex; gap: .8rem; flex-direction: column;}
.header .member-wrap .member-info li {display: flex; gap: .8rem; justify-content: space-between; padding: 0.2rem; margin-left: 0.4rem; margin-right: 0.4rem;}
.header .member-wrap .member-info li .tit {color: var(--Subbody_01, #848484); font-size: 1.4rem; line-height: 2.4rem; font-weight: 400;}
.header .member-wrap .member-info li a, .header .member-wrap .member-info li span {color: var(--Red_400, #FF5252); font-size: 1.6rem; font-weight: 700; line-height: 2rem;}
.header .member-wrap .btn-wrap {padding-top: .8rem; display: flex; gap: .2rem;}
.header .member-wrap .btn-member {border-radius: .8rem; background: var(--BG_subbody, #F1F3F5); font-size: 1.4rem; font-weight: 500; line-height: 2.6; text-align: center; display: block; padding: .8rem; flex: 1; height: 5.4rem;}

.header-subnav {display: flex; gap: 4.8rem; width: 100%; max-width: 1100px;}
.header-subnav::-webkit-scrollbar {width: .1rem; height: .1rem;}
.header-subnav::-webkit-scrollbar-thumb {background: transparent;}
.header-subnav::-webkit-scrollbar-track {background: transparent;}
.header-subnav li {display: flex; gap: 4.8rem;}
.header-subnav li a {color: var(--Subbody_02, #999); font-size: 1.5rem; font-weight: 500; line-height: 2.4rem; display: block; padding: .8rem .4rem; transition: all .3s ease;}
.header-subnav li a.active {color: var(--Black, #263238); font-weight: 600; line-height: 2rem; border-bottom: .3rem solid var(--Black, #263238); padding: 1rem .4rem .7rem;}
.login-txt {text-align: left; width: 100%; font-size: 1.5rem; line-height: 2.4rem; display: none; font-weight: 400; padding-top: 2rem; color: #9ca5ad;}

.pre-login {display: flex; gap: .8rem;}
/* .pre-login .btn {padding: .8rem 2.4rem; font-weight: 400;} */
.pre-login .btn {font-weight: 400;}
.pre-login .btn.btn-join {color: var(--Subbody_01);}
.pre-login .btn.btn-join:focus {color: #fff;}
.pre-login .btn.btn-login {}
.btn-nav-back {height: 4rem; background: url(../images/ic_arrow_left.svg) no-repeat left center / 2.4rem 2.4rem; padding-left: 3.2rem; margin-left: -.8rem; font-size: 1.4rem; line-height: 2.4rem; position: fixed; top: .8rem; left: 2rem; font-weight: 500; display: none;}

.header.subnav {height: 13rem;}
.header.float.subnav {height: 5.6rem;}
.header.float.subnav .header-container {margin-top: -9rem;}
.header.float.subnav .header-container.menushow {margin-top: 5.6rem;}
.header.float .header-subnav li a {padding: 1.6rem .4rem;}
.header.float .header-subnav li a.active {padding: 1.8rem .4rem 1.5rem;}

/* 헤더 메인 공통 */
.header.header-main_G,
.header.header-main_E,
.header.header-main_Y {
    transition: background .3s ease, box-shadow .3s ease;
}

/* 상태별 배경색 */
.header.header-main_G { background: #fa3c4c; }
.header.header-main_E { background: #4169E1; }
.header.header-main_Y { background: #4169E1; }

/* 스크롤 시 흰 배경 */
.header.header-main_G.scrolled,
.header.header-main_E.scrolled,
.header.header-main_Y.scrolled {
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* 스크롤 전 텍스트/로고/버튼 흰색 */
.header.header-main_G:not(.scrolled) .nav-wrap .nav > li > a,
.header.header-main_E:not(.scrolled) .nav-wrap .nav > li > a,
.header.header-main_Y:not(.scrolled) .nav-wrap .nav > li > a {
    color: #fff;
}

.header.header-main_G:not(.scrolled) .nav-wrap h1 img,
.header.header-main_E:not(.scrolled) .nav-wrap h1 img,
.header.header-main_Y:not(.scrolled) .nav-wrap h1 img {
    filter: brightness(0) invert(1);
}

.header.header-main_G:not(.scrolled) .pre-login .btn,
.header.header-main_E:not(.scrolled) .pre-login .btn,
.header.header-main_Y:not(.scrolled) .pre-login .btn {
    border-color: rgba(255,255,255,0.6);
    background: rgba(255,255,255,0.15);
    color: #fff;
}

/* 스크롤 후 원래 색으로 복귀 */
.header.header-main_G.scrolled .nav-wrap .nav > li > a,
.header.header-main_E.scrolled .nav-wrap .nav > li > a,
.header.header-main_Y.scrolled .nav-wrap .nav > li > a {
    color: var(--Black, #263238);
}

.header.header-main_G.scrolled .nav-wrap h1 img,
.header.header-main_E.scrolled .nav-wrap h1 img,
.header.header-main_Y.scrolled .nav-wrap h1 img {
    filter: none;
}

.header.header-main_G.scrolled .pre-login .btn,
.header.header-main_E.scrolled .pre-login .btn,
.header.header-main_Y.scrolled .pre-login .btn {
    border-color: var(--Line_Default, #DEDEDE);
    background: revert;
    color: revert;
}

/* 모바일 border 제거 */
@media screen and (max-width: 768px) {
    .header.header-main_G:not(.scrolled),
    .header.header-main_E:not(.scrolled),
    .header.header-main_Y:not(.scrolled) {
        border-bottom: none;
    }
}

.header .member-card {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.header .member-type-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    width: fit-content;
    height: 3.2rem;
    padding: 0 1.6rem;
    border-radius: 1.6rem;
    background: #ff5252;
    color: #fff;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 2rem;
    white-space: nowrap;
    margin-bottom: 1.6rem;
}

.header .member-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    padding-bottom: 1.6rem;
    margin-bottom: 2.4rem;
    border-bottom: 1px solid var(--Line_Default, #DEDEDE);
}

.header .member-name-wrap {
    display: flex;
    align-items: center;
    gap: .4rem;
    min-width: 0;
}

.header .member-card-head strong {
    color: var(--Black, #263238);
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 2.4rem;
    white-space: nowrap;
}

.header .member-setting {
    display: inline-block;
    width: 1.6rem;
    height: 1.6rem;
    flex: 0 0 1.6rem;
    background: url(/images/ic_setting.svg) no-repeat center / 100% auto;
    opacity: 1;
    filter: invert(45%) sepia(8%) saturate(300%) hue-rotate(170deg) brightness(90%) contrast(90%);
    cursor: pointer;
}

.header .member-email {
    display: none;
}

/* .text-logo {
  height: 50px;
  width: auto;
} */

.header .btn-logout {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: .6rem;
    color: var(--Subbody_02, #999);
    font-size: 1.3rem;
    font-weight: 500;
    line-height: 2rem;
    white-space: nowrap;
}

.header .btn-logout::before {
    content: '';
    width: 1.6rem;
    height: 1.6rem;
    flex: 0 0 1.6rem;
    background: url(../images/ic_logout.svg) no-repeat center / 100% auto;
    opacity: .45;
}

.header .btn-my-invest {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 4.4rem;
    padding: 0 1.6rem;
    border-radius: .8rem;
    background: #ffe1e1;
    color: #ff5252;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 2rem;
}

/* 알림창 */
.noti-wrap {position: fixed; top: 0; right: -52rem; width: 52rem; height: 100vh; background: var(--White, #fff); border-left: 1px solid var(--Line_Default, #DEDEDE); padding: 0; padding-top: 7.2rem; transition: right .5s ease; z-index: 8;}
.noti-wrap.show {right: 0;}
.noti-head {position: absolute; width: 100%; top: 0; left: 0; background: #fff; z-index: 2; padding: 2.4rem; display: flex; justify-content: space-between;}
.noti-head h2 {font-size: 1.8rem; line-height: 2.4rem; text-align: left;}
.noti-head .btn-close {width: 2.4rem; height: 2.4rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; border: 0;}
.noti-content {padding: 2.4rem; height: calc(100vh - 9.6rem); overflow: auto;}
.noti-cate {display: flex; gap: 1.6rem; justify-content: space-between; align-items: center; margin-bottom: 1.6rem;}
.noti-cate .cate {display: flex; gap: .8rem;}
.noti-cate .cate a {color: var(--Subbody_01, #848484); font-size: 1.4rem; font-weight: 500; line-height: 1.8rem; padding: 1.2rem 2.4rem; border-radius: 2.1rem; background: var(--BG_body, #F7F7F7); text-align: center;}
.noti-cate .cate a.active {color: var(--White, #fff); background: var(--Violet_600, #5221B5); font-weight: 600;}
.noti-cate .btns {display: flex; gap: .4rem;}
.noti-cate .btns .btn-txt {padding: 0 .8rem; color: var(--Black, #263238);}
.noti-list {line-height: 2.4rem; font-weight: 400;}
.noti-list li {border-bottom: .1rem solid var(--Line_Default, #DEDEDE); padding: 1.6rem 0 1.6rem 3.6rem; position: relative;}
.noti-list li::before {content: ''; width: 2.4rem; height: 2.4rem; display: block; position: absolute; top: 1.6rem; left: 0; background: url(../images/ic_noti.svg) no-repeat center / 100% 100%;}
.noti-list .info {display: flex; gap: .8rem; margin-bottom: .8rem; font-size: 1.4rem;}
.noti-list .info strong {color: var(--Black, #263238); font-weight: 400;}
.noti-list .info small {color: var(--Subbody_01, #848484);}


/* 콘텐츠 영역 */
.content-wrap {display: flex; flex-direction: column; align-items: center; margin-top: 8rem;position: relative;}
.header.subnav ~ .content-wrap {margin-top: 13rem;}
.header.float.subnav ~ .content-wrap {margin-top: 8.6rem;}


/* 푸터 영역 */
.footer {padding: 3.2rem 2rem; background: var(--BG_body, #F7F7F7);}
.footer-container {max-width: 1100px; width: 100%; margin: 0 auto; position: relative;}
.btn-top {width: 4rem; height: 4rem; border-radius: 2rem; background: url(../images/ic_top.svg) no-repeat var(--Black) center / contain; position: fixed; right: 2rem; bottom: 0; opacity: 0; overflow: hidden; text-indent: -10rem; transition: all .3s ease; z-index: 1;}
.btn-top.show {bottom: 2rem; opacity: 1;}
.footer.pb200 .btn-top.show {bottom: 18rem;}

.footer h2 {font-size: 2rem; font-weight: 700; line-height: 2.4rem; margin-bottom: 1.4rem;}

.footer-link {display: flex; gap: 5.6rem; font-size: 1.5rem; font-weight: 400; line-height: 2.6rem;}
.footer-link > li {position: relative;}
.footer-link > li a {color: #848484; font-weight: 500;}
.footer-link > li a.btn-term {display: inline-flex; gap: 1.6rem; align-items: center;}
.footer-link > li a.btn-term::after {display: inline-block; content: ''; width: 1.6rem; height: 1.6rem; background: url(../images/ic_arrow_down3.svg) no-repeat center / 1.6rem 1.6rem; vertical-align: middle;}
.footer-link > li ul {position: absolute; border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); background: var(--White, #FFF); width: 17.4rem; right: -2rem; bottom: 4rem; padding: .2rem 0; z-index: 2; display: none;}
.footer-link > li ul li a {display: flex; padding: 1rem 1.4rem; font-size: 1.5rem; line-height: 2.6rem; white-space: nowrap;}
.footer-link > li ul li a:hover {background: var(--BG_body, #F7F7F7);}
.footer-link > li a.btn-term.show::after {transform: rotate(-180deg);}
.footer-link > li a.btn-term.show ~ ul {display: block;}
.footer-link > li:nth-child(1) a {color: #848484; font-weight: 700;}

.btn-detail {width: 2.4rem; background: url(../images/ic_arrow_more.svg) no-repeat center / 100% 100% #b1b1b1; overflow: hidden; font-size: 1px; text-indent: -10rem; border-radius: 1.2rem; transform: rotate(180deg);}
.btn-detail.show {visibility: hidden; transform: none;}
.btn-detail.v2 {background-image: url(../images/ic_arrow_down5.svg); background-color: #fff;}

.footer-detail {border-top: .1rem solid var(--Line_Default, #DEDEDE); margin-top: 1rem; padding-top: 1rem; display: none;}
.btn-detail.show ~ .footer-detail {display: block;}

.footer-detail h3 {color: #848484; font-size: 1.6rem; font-weight: 700; line-height: 2.6rem; margin-bottom: 0.5rem; padding-top: 2rem;}
.footer-detail .com-info {display: flex; margin-bottom: 3.8rem;}
.footer-detail .com-info li {color: #848484; font-size: 1.4rem; font-weight: 400; line-height: 2.2rem;}
.footer-detail .com-info li::after {content: 'ㅣ'; display: inline-block; padding-right: 1rem; padding-left: 1rem;}
.footer-detail .com-info li:last-child::after {display: none;}

.footer-detail .com-info2 {display: flex;}
.footer-detail .com-info2 > div {flex: 1;}
.footer-detail .com-info2 h4 {color: #848484; font-size: 1.6rem; font-weight: 700; line-height: 2.4rem; margin-bottom: .6rem;}
.footer-detail .com-info2 p {color: #848484; font-size: 1.4rem; font-weight: 400; line-height: 2.2rem; margin-bottom: .2rem;}
.footer-detail .com-info2 dl {display: flex; gap: 0 1.2rem; font-size: 1.4rem; flex-wrap: wrap; width: 100%; line-height: 2.2rem;}
.footer-detail .com-info2 dt {font-weight: 500; line-height: 2.2rem; white-space: nowrap; flex: 0 0 7.3rem;}
.footer-detail .com-info2 dd {color: #848484; line-height: 2.2rem; flex: 0 0 calc(100% - 10rem);}
.footer-detail .com-info2 > div:nth-of-type(1) dt {flex: 0 0 4.3rem;}

.disclaimer {padding: 2rem 0 0.4rem;}
.disclaimer p {color: var(--Subbody_03, #B1B1B1); font-size: 1.4rem; line-height: 2.2rem;}
.copyright {color: var(--Subbody_03, #B1B1B1); font-size: 1.4rem; line-height: 2.2rem; margin-top: 2rem;}

/* 로그인 */
.login-intro {display: flex; border-radius: 20px; padding: 10rem 9.6rem; flex-direction: column; background: var(--White, #FFF); box-shadow: 0px .4rem 2.4rem 0 rgba(0, 0, 0, 0.05); max-width: 62rem; width: calc( 100% - 4rem ); justify-content: center; margin: 8rem 2rem;}
.login-intro h2 {color: var(--Black, #263238); font-size: 2.4rem; font-weight: 600; line-height: 3.6rem; margin-bottom: 4rem; position: relative;}
.login-intro p {color: var(--Subbody_02); font-size: 1.5rem; font-weight: 400; line-height: 2.4rem; margin-bottom: 1.6rem;}
.login-intro .type {display: flex; gap: 1.6rem; margin-bottom: 5rem;}
.login-intro .type li {flex: 1;}
.login-intro .type li .btn-logintype {display: flex; flex-direction: column; gap: 2.4rem; width: 100%; align-items: center; padding: 3.8rem 2rem; background: #fff; border: 1px solid var(--Line_Default, #DEDEDE); border-radius: .8rem;}
.login-intro .type li .btn-logintype img {height: 8rem; background: transparent; border-radius: 4rem; object-fit: cover;}
.login-intro .type li .btn-logintype span {text-align: center; font-size: 1.6rem; font-weight: 600; color: var(--Black, #263238); line-height: 2.4rem;}
.login-intro .type li .btn-logintype:hover {border: 1px solid var(--Gray, #f4f4f4); background: var(--Gray, #f4f4f4);}
.login-intro .type li .btn-logintype:hover img {width: 8rem;}
.login-intro .type li .btn-logintype:hover span {color: #263238; font-size: 1.6rem;}
.login-intro .link {display: flex; justify-content: center;}
.login-intro .link li {padding: 0 2rem; position: relative;}
.login-intro .link li::after {content: ''; width: .1rem; height: 1.2rem; background: var(--Line_Default, #DEDEDE); display: inline-block; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.login-intro .link li:last-child::after {display: none;}
.login-intro .link li a {display: inline-block; padding: 0; color: #828282; text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 2.4rem; text-decoration-line: underline;}

.login-wrap {display: flex; padding: 10rem 9.6rem; flex-direction: column; border-radius: 1.6rem; background: var(--White, #FFF); box-shadow: 0px .4rem 2.4rem 0 rgba(0, 0, 0, 0.05); max-width: 62rem; width: calc( 100% - 4rem ); justify-content: center; margin: 8rem 2rem;}
/* .login-wrap {display: flex; padding-top: 9rem; padding-bottom: 9rem; padding-left: 11rem; padding-right: 11rem; flex-direction: column; border-radius: 1.6rem; background: var(--White, #FFF); box-shadow: 0px .4rem 2.4rem 0 rgba(0, 0, 0, 0.05); max-width: 62rem; width: calc( 100% - 4rem ); justify-content: center; margin: 8rem 2rem;} */
.login-wrap h2 {color: var(--Black, #263238); font-size: 2.4rem; font-weight: 600; line-height: 3.6rem; margin-bottom: 4rem; position: relative;}
.login-wrap p {color: var(--Subbody_02); font-size: 1.5rem; font-weight: 400; line-height: 2.4rem; margin-bottom: 1.6rem;}
.login-wrap span {color: #828282; font-size: 1.4rem; font-weight: 500; line-height: 2.4rem;;}
.login-wrap .login-box {display: flex; flex-direction: column; gap: .8rem; width: 100%; position: relative; z-index: 1;}
.login-wrap .login-box > li {width: 100%;}
.login-wrap .login-box > li input[type=text], .login-wrap .login-box > li input[type=password] { max-height: 6rem;} 
.login-wrap .login-box > li input[type=tel] {width: 100%;}
.login-wrap .login-box > li:last-child {padding: .4rem  0; display: flex; justify-content: space-between; align-items: center;}
.login-wrap .link {display: flex; align-items: center; justify-content: end; margin-bottom: 5.6rem; position: absolute; z-index: 1; top: -3.5rem; right: 0;}
.login-wrap .link a {color: var(--Subbody_01, #848484); text-decoration: underline; white-space: nowrap; padding: 0 1.2rem; line-height: 2.4rem; font-size: 1.4rem;}
.login-wrap .link li::after {content: ''; display: inline-block; width: .1rem; height: 1.2rem; background: var(--Line_Default, #DEDEDE);}
.login-wrap .link li:last-child::after {display: none;}
.login-bottom {position: relative; padding-top: 3.6rem;}
.login-wrap .btn-wrap {display: flex; flex-direction: column; gap: 0.8rem;}
.login-wrap .txtonly {color: var(--Subbody_01, #848484); font-size: 2rem; line-height: 3rem; font-weight: 500;}


/* 약관 동의 */
.term-agree {}
.term-agree li.all {border-bottom: 1px solid var(--Line_Default, #DEDEDE); padding-bottom: 1.6rem;}
.term-agree li.all label span {color: var(--Black, #263238); font-weight: 600; font-size: 1.5rem;}
.term-agree li:nth-child(2) {padding-top: 1.6rem;}
.term-agree li {display: flex; gap: 0 .8rem; align-items: center; justify-content: space-between; flex-wrap: wrap;}
.term-agree li .checkbox2 label span {font-size: 1.6rem;}
.term-agree li .btn-arrow {display: inline-block; width: 2.4rem; height: 2.4rem; background: url(../images/ic_arrow_down4.svg) no-repeat 1rem 50% / 1.2rem 1.2rem; font-size: 1px; overflow: hidden; text-indent: -10rem; flex: 0 0 2.4rem; transition: none;}
.term-agree li .btn-arrow.active {transform: rotate(180deg); background-position: 0 50%;}
.term-cont {background: var(--BG_body, #F7F7F7); height: 33.5rem; flex: 0 0 100%; width: 100%; font-size: 1.4rem; line-height: 2.4rem; font-weight: 400; position: relative; margin-bottom: .8rem; display: none; padding: 3rem 1rem 0 2.4rem;}
.term-cont::after {display: block; content: ''; background: linear-gradient(180deg, rgba(250, 250, 250, 0.00) 0%, #FAFAFA 67.41%); height: 6.4rem; width: 100%; position: absolute; bottom: 0; left: 0;}
.term-cont .term-inner {padding: 0 1.4rem 5rem 0; width: 100%; height: 100%; overflow: auto;}
.term-cont .term-inner::-webkit-scrollbar {width: .2rem; height: .2rem;}
.term-cont .term-inner::-webkit-scrollbar-thumb {background: var(--Subbody_03); border-radius: 0;}
.term-cont .term-inner::-webkit-scrollbar-track {background: transparent; border-radius: 0;}
.btn-arrow.active ~ .term-cont {display: block;}
.pop .term-cont {height: 16rem; padding: 1.6rem 1rem 0 2rem;}
.pop .term-cont .term-inner {padding: 0 1rem 5rem 0;}
.pop .term-agree .checkbox2 {padding: .4rem 0;}
.graybox .term-cont {flex: 0 0 20rem; margin-right: -1rem; width: calc(100% + 1rem); padding: 0;}
.graybox .term-cont .term-inner {padding: 0 1rem 3rem 0; color: var(--Subbody_01);}
.graybox .term-cont::after {background: linear-gradient(180deg, rgba(247, 247, 247, 0.00) 0%, #F7F7F7 100%); height: 3rem;}


/* 회원가입 */
.grade-cont {display: none;}
#grade1 {display: block;}


/* 업종코드 검색 */
.codesearch {display: flex; gap: 1.6rem; height: 37rem;}
.codesearch-box {width: 50%; overflow-y: auto; height: 100%; padding: .8rem .8rem .8rem 0;}
.codesearch-box .list-a {padding-right: .8rem;}


/* 약관 */
.term-wrap {display: flex; padding: 9.6rem; flex-direction: column; background: var(--White, #FFF); box-shadow: 0px .4rem 2.4rem 0 rgba(0, 0, 0, 0.05); max-width: 111rem; width: calc( 100% - 4rem ); justify-content: center; margin: 8rem 2rem; position: relative;}
.term-wrap h2 {color: var(--Black, #263238); font-size: 2.8rem; font-weight: 700; line-height: 4rem; text-align: center; margin-bottom: 6rem;}
.term-head .btn-close {display: none; width: 2.4rem; height: 2.4rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; border: 0; position: absolute; top: 1.6rem; right: 2rem;}
.term-wrap .tabs li {flex: 0 0 20%;}
.term-wrap .tab-content h3 {margin-bottom: 1rem; color: var(--Black, #263238); font-size: 1.5rem; font-weight: 700; line-height: 2rem;}
.term-wrap .tab-content p {margin-bottom: 4rem; color: var(--Subbody_01, #848484); font-size: 1.4rem; font-weight: 400; line-height: 2.4rem;}
.term-wrap .term-select {width: 14.6rem;}
.term-wrap .tab-content p:nth-last-of-type(1) {margin-bottom: 0;}

/* 카카오 배너 */
.kakao-banner {
  position: relative;
  margin: 6rem auto;
  padding: 4rem 2rem;
  max-width: 1200px;
  border-radius: 16px;
  overflow: hidden;
  text-align: center;
  background: linear-gradient(135deg, #f78ca0, #fe9a8b);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.kakao-banner .banner-container {
  position: relative;
  z-index: 1;
}

.kakao-banner .pattern-overlay,
.kakao-banner .diagonal-stripes {
  position: absolute;
  inset: 0;
  opacity: 0.15;
  z-index: 0;
}

.kakao-banner .floating-elements .floating-circle {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 180, 180, 0.4);
  animation: float 6s ease-in-out infinite;
}
.kakao-banner .circle-1 { top: 10%; left: 15%; width: 80px; height: 80px; }
.kakao-banner .circle-2 { top: 70%; right: 10%; width: 60px; height: 60px; animation-delay: 2s; }
.kakao-banner .circle-3 { top: 40%; left: 60%; width: 100px; height: 100px; animation-delay: 1s; }

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-15px); }
}

.kakao-banner .badge {
  background: #ff7b7b;
  color: white;
  display: inline-block;
  padding: 0.6rem 1.2rem;
  border-radius: 999px;
  font-weight: 600;
  letter-spacing: 1px;
  font-size: 0.9rem;
}

.kakao-banner .headline {
  font-size: 1.9rem;
  font-weight: 700;
  margin: 1.4rem 0;
  color: #fff;
}
.kakao-banner .headline span {
  color: #ff7b7b;
}

.kakao-banner .description {
  color: #fff;
  max-width: 700px;
  margin: 0 auto 2rem;
  font-size: 1.47rem;
}

.kakao-banner .timer-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 2rem;
}

.kakao-banner .timer-box {
  background: #fff;
  padding: 0.8rem 1.2rem;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.kakao-banner .timer-number {
  font-size: 1.6rem;
  font-weight: 700;
}
.kakao-banner .timer-label {
  font-size: 0.8rem;
  color: #888;
}

.kakao-banner .cta-container {
  display: flex;
  justify-content: center;
  gap: 1rem;
}
.kakao-banner .cta-primary,
.kakao-banner .cta-secondary {
  padding: 0.8rem 2rem;
  border: none;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
}
.kakao-banner .cta-primary {
  background: #ff7b7b;
  color: white;
}
.kakao-banner .cta-primary:hover {
  background: #ff4c4c;
}
.kakao-banner .cta-secondary {
  background: white;
  border: 1px solid #ddd;
  color: #444;
}
.kakao-banner .cta-secondary:hover {
  background: #f9f9f9;
}

/* 대출 신청 */
.loaninfo-wrap {width: 100%; overflow: hidden;}

.loaninfo-section0 {background-color: var(--Violet_100); padding: 13.4rem 2rem; display: flex; justify-content: center;}
.loaninfo-section0 .inner {max-width: 106.2rem; width: 100%; display: flex; justify-content: space-between; align-items: start; gap: 0;}
.loaninfo-section0 h3 {color: var(--Black, #263238); font-size: 4.2rem; font-weight: 700; line-height: 5.8rem; margin-bottom: 2.4rem;}
.loaninfo-section0 .txt1 {color: var(--Black, #263238); font-size: 2.4rem; font-weight: 500; line-height: 3.6rem; margin-bottom: 3.2rem;}

/* .loaninfo-section1 {background: #fff; position: relative; overflow: hidden; background-image: url("../images/loan_card-bg.png"); background-image: no-repeat; background-size: 100% 100%;} */
.loaninfo-section1 {background: #fff; position: relative; overflow: hidden;}
/* .loaninfo-section1 {background-image: url("/images/loan_card-bg.png"); position: relative; overflow: hidden; height: 100%;} */
.loaninfo-section1 .inner {background-image: linear-gradient(45deg, #ee9ca7 0%, #ffdde1 100%); display: flex; flex-direction: column; align-items: center; margin: 0 auto;}
.loaninfo-section1 h2 {text-align: left; letter-spacing: .1rem; display: flex; flex-direction: column; gap: 0; margin-bottom: 1.2rem;}
.loaninfo-section1 h2 span {text-align: center; color: var(--White, #fff); font-size: 1.6rem; font-weight: 600; line-height: normal; margin-bottom: 0.6rem; display: flex; flex-direction: column; align-items: center;}
.loaninfo-section1 h2 strong {text-align: center; color: var(--White, #fff); font-size: 4.2rem; font-weight: 600; line-height: normal; margin-top: 7rem; margin-bottom: 28px; letter-spacing: 0.16rem;}
.loaninfo-section1 h3 {text-align: left; letter-spacing: .1rem; display: flex; flex-direction: column; gap: 0; margin-bottom: 1.6rem;}
.loaninfo-section1 h3 span {color: var(--White, #fff); font-size: 1.8rem; font-weight: 500; line-height: normal; margin-bottom: 1.2rem;}

.loaninfo-section1 .inner .notice {display: flex; justify-content: center;}
.loaninfo-section1 .inner .notice li {padding: 0 2rem; position: relative; font-size: 1.5rem; color: var(--White, #fff); font-weight: 500; text-align: center;}
.loaninfo-section1 .inner .notice li div {font-size: 3.6rem; font-weight: 600; padding: 0.4rem; color: var(--White, #fff)}
.loaninfo-section1 .inner .notice li::after {content: ''; width: .1rem; height: 1.2rem; background: var(--Line_Default, #DEDEDE); display: inline-block; position: absolute; right: 0; top: 50%; transform: translateY(-50%);}
.loaninfo-section1 .inner .notice li:last-child::after {display: none;;}
.loaninfo-section1 .inner .notice li a {display: inline-block; padding: 0; color: #FBFCF8; text-align: center; font-size: 1.5rem; font-weight: 500; line-height: 2.4rem; text-decoration: under;}


.loaninfo-wrap .btn-inquery {background-color: var(--Red_200); padding: 2.0rem 5.6rem; border: .1rem solid var(--Red_200); border-radius: 3px; color: var(--White); font-size: 1.6rem; font-weight: 600; text-align: center; margin-bottom: 4rem;}
.loaninfo-section1 .man {max-width: 40rem; width: 31.67%; min-width: 22.8rem; margin-left: 3%;}
.loaninfo-section1 .img-list {text-align: center; position: absolute; bottom: 25%; left: 50%; width: 100%; padding: 0 2rem; max-width: 126.3rem; transform: translateX(-50%); max-width: 1263px;}
.loaninfo-section1 .img-list > div:nth-of-type(1) {display: flex; justify-content: space-between; position: relative; width: 100%;}
.loaninfo-section1 .img-list > div:nth-of-type(1) img:nth-of-type(1) {width: 24.78%; min-width: 15.7rem;}
.loaninfo-section1 .img-list > div:nth-of-type(1) img:nth-of-type(2) {width: 28.18%; min-width: 17.8rem;}
.loaninfo-section1 .img-list > div:nth-of-type(2) {display: flex; justify-content: space-between; position: relative; width: 100%;}
.loaninfo-section1 .img-list > div:nth-of-type(2) img:nth-of-type(1) {width: 14.72%; margin-left: 21.7%; min-width: 9.32rem;}
.loaninfo-section1 .img-list > div:nth-of-type(2) img:nth-of-type(2) {width: 16.86%; margin-right: 19.8%; min-width: 10.66rem;}

.loaninfo-section2 {padding: 8rem 2rem 9.8rem; background: var(--White, #fff);}
.loaninfo-section2 .inner {display: flex; flex-direction: column; align-items: center;}
.loaninfo-section2 h2 {display: flex; flex-direction: column; align-items: center; margin-bottom: 1.6rem;}
.loaninfo-section2 h2 span {font-size: 3.6rem; font-weight: 700; line-height: normal; letter-spacing: 0.1rem;}
.loaninfo-section2 h2 strong {font-size: 5.6rem; font-weight: 700; line-height: normal;}
.loaninfo-section2 .txt1 {color: var(--Subbody_01, #848484); font-size: 1.5rem; font-weight: 400; line-height: 2.8rem; margin-bottom: 1.8rem; margin-top: 3rem;}
.loaninfo-section2 .txt2 {color: var(--Subbody_06); font-size: 1.5rem; font-weight: 500; line-height: 3.4rem; letter-spacing: 0.1;}
.loaninfo-section2 .txt3 {color: var(--Black); font-size: 3.8rem; font-weight: 600; margin-top: 0.6rem;}
.loaninfo-section2 .txt3 strong {color: var(--Black);}
.loaninfo-section2 .txt4 {color: var(--Black); font-size: 2.0rem; font-weight: 600; margin-top: 0.6rem;}
.loaninfo-section2 .txt4 strong {color: var(--Black);}
.section2-info {width: 100%; max-width: 91rem; background-color: var(--White); border: 1px solid #e6e6e6; border-radius: 6px; display: flex; flex-direction: row; align-items: center; padding: 2.5rem 8rem; justify-content: space-between; overflow: hidden;}

.section2-info li {text-align: center; color: #fff;} 
.section2-info .line {width: .1rem; height: 12.4rem; background: var(--Gray_200); opacity: 0.2;}

.loaninfo-section3 {background-color: var(--White); padding: 10.4rem 2rem; display: flex; justify-content: center;}
.loaninfo-section3 .inner {max-width: 106.2rem; width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 0;}
.loaninfo-section3 h3 {color: var(--Black, #263238); font-size: 3.6rem; font-weight: 700; line-height: 5.3rem; margin-bottom: 2.8rem; letter-spacing: 0.1rem;}
.loaninfo-section3 .txt1 {color: var(--Black, #263238); font-size: 1.6rem; font-weight: 500; line-height: 3.0rem; margin-bottom: 0.6rem; letter-spacing: 0.02rem;}
.loaninfo-section3 .txt2 {color: var(--Blue_200, #5971d6); font-size: 1.4rem; font-weight: 600; line-height: 2.2rem; letter-spacing: 0.02rem;}
.loaninfo-section3 p {color: var(--Black, #263238); font-size: 3.2rem; font-weight: 500; line-height: 3.6rem; margin-bottom: 3.2rem;}
.loaninfo-section3 .img {max-width: 54rem; width: 50%; margin-top: -1.6rem;}

.txt-noti {display: flex; gap: .8rem; align-items: start;}
.txt-noti img {width: 2.4rem;}
.txt-noti span {color: var(--Blue_200, #5971d6); font-size: 1.5rem; line-height: 2.8rem; text-align: left;}

.txt-noti2 {display: flex; gap: .4rem; align-items: start;}
.txt-noti2 img {width: 2rem; margin-top: .0rem;}
.txt-noti2 span {color: var(--Red_400); font-size: 1.4rem; line-height: 2rem; text-align: left;}

.txt-noti3 {display: flex; gap: .8rem; align-items: start;}
.txt-noti3 img {width: 2.4rem;}
.txt-noti3 span {font-size: 1.6rem; line-height: 2rem; text-align: left; color: var(--Black, #263238); font-weight: 600; padding-top: .25rem; display: inline-block;}

.loaninfo-section4 {background-color: var(--White); padding: 10.4rem 2rem; display: flex; justify-content: center;}
.loaninfo-section4 .inner {max-width: 106.2rem; width: 100%; display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: 0;}
.loaninfo-section4 h3 {color: var(--Black, #263238); font-size: 3.6rem; font-weight: 700; line-height: 5.3rem; margin-bottom: 4.8rem;}
.loaninfo-section4 .txt1 {color: var(--Black, #263238); font-size: 1.6rem; font-weight: 500; line-height: 3.0rem; margin-bottom: 0.6rem; letter-spacing: 0.02rem;}
.loaninfo-section4 .txt2 {color: var(--Blue_200, #5971d6); font-size: 1.4rem; font-weight: 600; line-height: 2.2rem; letter-spacing: 0.02rem;}
.loaninfo-section4 p {color: var(--Black, #263238); font-size: 3.2rem; font-weight: 500; line-height: 3.6rem; margin-bottom: 3.2rem;}
.loaninfo-section4 .img {max-width: 54rem; width: 50%; margin-top: -1.6rem;}

.loaninfo-section5 {background-color: var(--White); padding: 10.4rem 2rem; display: flex; justify-content: center;}
.loaninfo-section5 .inner {max-width: 106.2rem; width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 0; margin-left: 5rem;}
.loaninfo-section5 h3 {color: var(--Black, #263238); font-size: 3.6rem; font-weight: 700; line-height: 5.3rem; margin-bottom: 4.8rem;}
.loaninfo-section5 .txt1 {color: var(--Black, #263238); font-size: 1.6rem; font-weight: 500; line-height: 3.0rem; margin-bottom: 0.6rem; letter-spacing: 0.02rem;}
.loaninfo-section5 .txt2 {color: var(--Blue_200, #5971d6); font-size: 1.4rem; font-weight: 600; line-height: 2.2rem; letter-spacing: 0.02rem;}
.loaninfo-section5 p {color: var(--Black, #263238); font-size: 2.4rem; font-weight: 500; line-height: 3.6rem; margin-bottom: 3.2rem;}
.loaninfo-section5 .img {max-width: 54rem; width: 50%; margin-top: -1.6rem;}

.loaninfo-section6 {background-color: var(--White, #fff); padding: 10.4rem 2rem 16rem; display: flex; justify-content: center;}
.loaninfo-section6 .inner {max-width: 1100px; width: 100%;}

.address {display: flex !important; flex-direction: column; gap: .4rem;}
.address span {font-size: 1.45rem; font-weight: 500; line-height: 2.4rem;}
.address small {color: var(--Subbody_01, #848484); font-size: 1.3rem; line-height: 1.5rem;}

.btn-callcenter {background: var(--BG_subbody, #F1F3F5); padding: 1.6rem 2.4rem; border-radius: 4.4rem; position: fixed; right: 2rem; bottom: 2rem; text-align: left; overflow: hidden; width: 23.5rem; height: 8.8rem; box-sizing: border-box; transition: all .3s ease; z-index: 1;}
.btn-callcenter.float {bottom: 8rem;}
.btn-callcenter > .inner {display: inline-flex; align-items: center; gap: .8rem; width: 19rem;; white-space: nowrap;}
.btn-callcenter img {display: inline-block; width: 5.6rem; height: 5.6rem; border-radius: 2.8rem;}
.btn-callcenter .tel {font-size: 2rem; font-weight: 700; line-height: 2.4rem;}
.btn-callcenter li {font-size: 1.2rem; line-height: 2rem; white-space: nowrap;}
.btn-callcenter.min {width: 5.6rem; height: 5.6rem; padding: 0; border-radius: 2.8rem;}
.btn-callcenter.float.min {bottom: 8rem; right: 1.27rem;}
.btn-callcenter.min ul {opacity: 0;}
.btn-callcenter.min img {border: .4rem solid #F1F3F5;}


/* 대출후기 */
.loanreview-wrap {width: 100%; background: #fff; padding-bottom: 11.2rem;}
.loanreview-head {height: 48rem; background: url(../images/review_head.jpg) no-repeat 50% 35% / cover #000; display: flex; justify-content: center; align-items: center;}
.loanreview-head h2 {color: var(--White, #FFF); text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 5.8rem;}
.loanreview-body {}
.loanreview-best {padding: 6.4rem 0; background: var(--Violet_100, #F8F5FF);}
.loanreview-best h3 {text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 4rem; margin-bottom: 1.6rem; padding: 0 2rem;}
.loanreview-best > p {text-align: center; font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; margin-bottom: 5.6rem; padding: 0 2rem;}

.general-review-wrap {max-width: 1100px; width: 100%; margin: 0 auto; display: flex; gap: 5.6rem 3rem; justify-content: center; flex-wrap: wrap; margin-bottom: 5.6rem; padding: 0 2rem;}
.review-card {border-radius: 1.6rem; background: var(--White, #FFF); display: flex; width: calc( (100% - 6rem) / 3 ); padding: 3.2rem; flex-direction: column; align-items: center; gap: 2.4rem; border: 1px solid var(--Line_Default, #DEDEDE); box-sizing: border-box;}
.review-card .feature {display: flex; flex-direction: row; gap: 1.2rem; align-items: center; width: 100%;}
.review-card .feature > div {display: flex; flex-direction: column; gap: .4rem;}
.review-card .feature .profile {width: 6.4rem;}
.review-card .feature .name {text-align: left; font-size: 1.8rem; font-weight: 700; line-height: 2.4rem;}
.review-card .badges {display: flex; gap: .4rem;}
.review-card .badges span {min-width: auto; font-size: 1.2rem !important; line-height: 2rem !important; padding: 0; background: transparent;}
.review-card .badges span::before {content: '#';}
.review-card .badges span::after {content: ', ';}
.review-card .review-cont-wrap {margin-top: -.8rem;}
.review-card .review-cont {font-size: 1.4rem; font-weight: 400; line-height: 2.4rem; margin-bottom: 1.9rem;}
.review-card .review-cont-wrap .date {color: var(--Subbody_01, #848484); font-size: 12px; font-weight: 400; line-height: 2rem;}
.review-card .tags {display: flex; gap: .4rem; width: 100%;}
.review-card .tag {display: flex; padding: .4rem .8rem; justify-content: center; align-items: center; gap: .8rem; border-radius: .8rem; background: var(--Orange_100, #FFF3E6); color: var(--Orange_400, #FF8500); font-size: 1.2rem; font-weight: 600; line-height: 2rem;}
.review-card .btn-go {margin-right: auto;}
.general-review-wrap .review-card .badges span {background: transparent !important;}
.review-card:nth-last-of-type(1) {margin-right: auto;}

.best-review-wrap {max-width: 1100px; width: 100%; margin: 0 auto; display: block; padding: 0 .5rem;}
.best-review-wrap .review-card {border: none; width: 100%;}
.best-review-wrap .review-card .feature {gap: 1.6rem; flex-direction: column;}
.best-review-wrap .review-card .feature > div {gap: 1.6rem;}
.best-review-wrap .review-card .feature .profile {width: 9.6rem;}
.best-review-wrap .review-card .feature .name {text-align: center; font-size: 2rem;}
.best-review-wrap .review-card .badges span {padding: .4rem .8rem; border-radius: .8rem; text-align: center; vertical-align: middle; font-size: 1.2rem !important; line-height: 2rem !important; font-weight: 600 !important;}
.best-review-wrap .review-card .badges span::before {display: none;}
.best-review-wrap .review-card .badges span::after {display: none;}
.best-review-wrap .review-card .review-cont-wrap {margin-top: 0;}
.best-review-wrap .slick-slide {margin: 0 1.5rem;}


/* 투자 - 투자 HOME */
.investhome-wrap {width: 100%; background: #fff;}
.investhome-section1 {height: 42rem;}
.investhome-slider1-wrap {position: relative;}
.investhome-slider1 {height: 52rem;}
.slide-item {height: 100%; overflow: hidden;}
.slide-item .inner {height: 100%;}

.slick-prev {width: 3.2rem; height: 3.2rem; border-radius: 2.4rem; border: .08rem solid var(--Line_Default, #DEDEDE) !important; background: url(../images/ic_arrow_left.svg) no-repeat center / 1.6rem 1.6rem var(--White, #FFF); overflow: hidden; font-size: 1px; text-indent: -300px; position: absolute; top: calc( 50% - 1.6rem ); left: .4rem; z-index: 1;}
.slick-next {width: 3.2rem; height: 3.2rem; border-radius: 2.4rem; border: .08rem solid var(--Line_Default, #DEDEDE) !important; background: url(../images/ic_arrow_right.svg) no-repeat center / 1.6rem 1.6rem var(--White, #FFF); overflow: hidden; font-size: 1px; text-indent: -300px; position: absolute; top: calc( 50% - 1.6rem ); right: .4rem; z-index: 1;}

.slick-list, .slick-track {height: 100%;}

.investhome-slider-type1 {background: url(../images/investhome_slider1_1.jpg) no-repeat 50% 40% / cover; height: 100%; display: flex; justify-content: center; color: var(--White, #FFF); text-align: center; padding-top: 9.1rem;}
.investhome-slider-type1 .txt1 {font-size: 2rem; font-weight: 500; line-height: 3rem; margin-bottom: 2.4rem;}
.investhome-slider-type1 .txt2 {font-size: 5.6rem; font-weight: 700; line-height: 140%; margin-bottom: 2.4rem;}
.investhome-slider-type1 .txt3 {font-size: 1.8rem; font-weight: 400; line-height: 2.2rem; margin-bottom: 4rem;}

.investhome-slider-type2 {background: #44AEFF; height: 100%; padding: 0 2rem;}
.investhome-slider-type2 .inner {display: flex; justify-content: center; gap: 21.4%; color: #fff; height: 100%; align-items: center; max-width: 1440px; margin: 0 auto; position: relative;}
.investhome-slider-type2 .inner .info-wrap {display: flex; flex-direction: column; gap: 4.8rem; padding-left: 24%;}
.investhome-slider-type2 .inner .info1 dl {display: flex; flex-direction: column; justify-content: center; gap: 0; align-items: center;}
.investhome-slider-type2 .inner .info1 dt {font-size: 2rem; line-height: 3rem; font-weight: 500; padding-left: 1.4rem; white-space: nowrap;}
.investhome-slider-type2 .inner .info1 dd {font-size: 16rem; font-weight: 600; line-height: 1;}
.investhome-slider-type2 .inner .info2 {display: flex; gap: 4rem;}
.investhome-slider-type2 .inner .info2 dl {display: flex; flex-direction: column; gap: 1rem; align-items: center;}
.investhome-slider-type2 .inner .info2 dt {font-size: 2rem; line-height: 3rem; font-weight: 500; white-space: nowrap;}
.investhome-slider-type2 .inner .info2 dd {font-weight: 700; font-size: 4.8rem; line-height: 1;} 
.investhome-slider-type2 .inner img {width: 50%; flex: 0 0 50%; min-width: 285px; max-width: 490px; margin-right: 7.1%;}

.investhome-slider-type3 {background: #44AEFF; height: 100%; padding: 0 2rem;}
.investhome-slider-type3 .inner {display: flex; justify-content: center; gap: 6.66%; color: #fff; height: 100%; align-items: center; max-width: 1440px; margin: 0 auto; position: relative;}
.investhome-slider-type3 .inner .txt-wrap {padding-left: 1.2rem;}
.investhome-slider-type3 .inner .txt1 {font-size: 2rem; line-height: 3rem; font-weight: 500; white-space: nowrap; margin-bottom: 8.8rem;}
.investhome-slider-type3 .inner .txt2 {font-size: 7.2rem; font-weight: 700; line-height: 1; margin-bottom: 2.6rem;}
.investhome-slider-type3 .inner .txt3 {font-weight: 500; font-size: 1.8rem; line-height: 2.4rem; margin-bottom: 10rem;} 
.investhome-slider-type3 .inner img {width: 50%; flex: 0 0 50%; min-width: 285px; max-width: 490px;}

/* .investhome-slider-type4 {background: url(../images/investhome_slider1_3.png) no-repeat center / auto 100% #A1BCE2; height: 100%; padding: 0 2rem; color: #fff;}
.investhome-slider-type4 .inner {display: flex; gap: 0; align-items: center; max-width: 1100px; margin: 0 auto;}
.investhome-slider-type4 .inner .txt-wrap {width: 50%; flex: 0 0 50%;}
.investhome-slider-type4 .inner .badge-wrap {display: flex; gap: .4rem; padding: 0; margin-bottom: 1.6rem; justify-content: start;}
.investhome-slider-type4 .inner .txt1 {font-size: 4.2rem; line-height: 5.8rem; font-weight: 600; margin-bottom: .8rem;}
.investhome-slider-type4 .inner .txt2 {font-size: 2rem; line-height: 3.8rem; margin-bottom: 1.6rem;}
.investhome-slider-type4 .inner ul {display: flex; margin-bottom: 4.8rem;}
.investhome-slider-type4 .inner li {font-size: 2rem; line-height: 3rem;;}
.investhome-slider-type4 .inner li::after {content: '/'; display: inline-block; margin: 0 1.6rem; opacity: .3;}
.btn-go3 {display: inline-flex; min-width: 20rem; padding: 1.6rem 2rem; justify-content: space-between; align-items: center; background: var(--Violet_600, #5221B5); color: #fff; color: var(--White, #FFF); text-align: center; font-size: 1.8rem; font-weight: 400; line-height: 22px;}
.btn-go3::after {content: ''; width: 1.6rem; height: 1.6rem; display: inline-block; background: url(../images/ic_arrow_right_w.svg) no-repeat center / 100% auto; flex: 0 0 1.6rem;}
.investhome-slider-type4 .inner li:last-child::after {display: none;}
.invest-chart {width: 20rem; height: 20rem; margin-left: 15%;}
.invest-chart text {font-size: .7rem; font-weight: 500;}
.investhome-slider-type4.bg1 {background-color: #D8807D !important;}
.investhome-slider-type4.bg2 {background-color: #8AC7D8 !important;}
.investhome-slider-type4.bg3 {background-color: #89B998 !important;}
.investhome-slider-type4.bg4 {background-color: #71B1C9 !important;}
.investhome-slider-type4.bg5 {background-color: #CC9260 !important;}
.investhome-slider-type4.bg6 {background-color: #956FE0 !important;}
.investhome-slider-type4.bg7 {background-color: #B75665 !important;}
.investhome-slider-type4.bg8 {background-color: #789EDC !important;}
.investhome-slider-type4.bg9 {background-color: #ABA85F !important;}
.investhome-slider-type4.bg10 {background-color: #E03954 !important;} */

.investhome-slider-type4 {background: no-repeat center / auto 100% #A1BCE2; background-color: #000; height: 100%; padding: 0 2rem; color: #fff;}
.investhome-slider-type4 .inner {display: flex; gap: 0; align-items: center; max-width: 930px; margin: 0 auto;}
.investhome-slider-type4 .inner .txt-wrap {width: 50%; flex: 0 0 50%;}
.investhome-slider-type4 .inner .badge-wrap {display: flex; gap: .4rem; padding: 0; margin-bottom: 1.6rem; justify-content: start;}
.investhome-slider-type4 .inner .txt1 {font-size: 3.5rem; line-height: -5.8rem; font-weight: 600; margin-bottom: .1rem;}
.investhome-slider-type4 .inner .txt2 {font-size: 1.8rem; font-weight: 500; margin-bottom: 2rem;}
.investhome-slider-type4 .inner ul {display: flex; margin-bottom: 0rem;}
.investhome-slider-type4 .inner li {font-size: 3.4rem; line-height: 3rem; font-weight: 500;}
/* .btn-go3 {display: inline-flex; min-width: 18rem; padding: 1.5rem 2rem; justify-content: space-between; align-items: center; background: var(--White, #FFFFFF); color: var(--Black, #263238); text-align: center; font-size: 1.3rem; font-weight: 500; line-height: 12px; border-radius: 3%;} */
/* .btn-go3::after {content: ''; width: 1.8rem; height: 1.8rem; display: inline-block; background: url(../images/right.svg) no-repeat center / 100% auto; flex: 0 0 1.6rem;} */
.btn-go3 {display: inline-flex; padding: 1.8rem 5.5rem; justify-content: space-between; align-items: center; background: var(--White, #FFFFFF); color: var(--Black, #263238); text-align: center; font-size: 1.35rem; font-weight: 500; line-height: 12px; border-radius: 3%;}
.investhome-slider-type4 .inner li:last-child::after {display: none;}
.invest-chart {width: 18rem; height: 18rem; justify-content: center; background: transparent;}
.invest-chart text {font-size: .6rem; font-weight: 600;}
.chart-box {position: relative;
  width: 32rem;   /* 박스 크기 */
  height: 32rem;
  background: url('../images/3d-house.jpg') no-repeat center / cover; 
  border-radius: 1rem; /* 네모 박스 둥글림 */
  display: flex;
  align-items: center;
  justify-content: center;}
.chart-box2 {
  position: relative;
  width: 32rem;   /* 박스 크기 */
  height: 32rem;
  border-radius: 1rem; /* 네모 박스 둥글림 */
  display: flex;
  align-items: center;
  justify-content: center;}
/* 새로 추가할 CSS: SVG를 이미지 위에 완벽히 중앙에 겹치도록 설정 */
.chart-overlay {
    position: absolute;
    /* SVG가 부모(.chart-box2)의 중앙에 위치하도록 조정 (선택 사항) */
    /* 현재 .chart-box2에 flex가 있으므로, 필요에 따라 SVG의 크기를 조정 */
    z-index: 10; /* 이미지보다 위에 오도록 */
}  
/* .investhome-slider-type4.bg1 {background-color: #D8807D !important;} */
.investhome-slider-type4.bg1 {background-color: #a34e4e !important;}
.investhome-slider-type4.bg2 {background-color: #8AC7D8 !important;}
.investhome-slider-type4.bg3 {background-color: #89B998 !important;}
.investhome-slider-type4.bg4 {background-color: #71B1C9 !important;}
.investhome-slider-type4.bg5 {background-color: #CC9260 !important;}
.investhome-slider-type4.bg6 {background-color: #956FE0 !important;}
.investhome-slider-type4.bg7 {background-color: #B75665 !important;}
.investhome-slider-type4.bg8 {background-color: #789EDC !important;}
.investhome-slider-type4.bg9 {background-color: #ABA85F !important;}
.investhome-slider-type4.bg10 {background-color: #E03954 !important;}

.slider1-pagination-wrap {background-color: #ffffffe0; padding: 0;}
.slider1-pagination-wrap .inner {max-width: 1100px; width: 100%; margin: 0 auto;}
.slider1-pagination {display: flex; justify-content: space-between; gap: 0; align-items: center;}
.slider1-pagination .thumb {display: flex; flex-direction: column; gap: .4rem; font-size: 1.2rem; font-weight: 600; line-height: 1.6rem; padding: 1.6rem 1rem; flex: 0 0 auto; /*width: auto !important;*/}
.slider1-pagination .thumb .badge {font-size: 1.2rem; font-weight: 500; line-height: 2rem; border-radius: .8rem; padding: .2rem .4rem; border: .1rem solid var(--Black, #263238);}
.slider1-pagination .thumb.slick-current {color: var(--Black); font-weight: 600; opacity: 80%; font-size: 1.3rem;}
.slider1-pagination .thumb.slick-current .badge {border: .1rem solid var(--Violet_500);}
.slider1-pagination .slick-list {width: 100%;}
.slider1-pagination .slick-track {display: flex; justify-content: space-between; width: 100%; align-items: center;}
/* .slider1-pagination .slick-track {
  margin-left: 0;
  text-align: left; 
}
.slider1-pagination .slick-slide {
    cursor: pointer;
} */
/* .investhome-slider1-wrap .btns {position: absolute; bottom: 0; left: 50%; width: 100%; max-width: 1140px; padding: 0 2rem; display: flex; z-index: 1; transform: translateX(-50%); justify-content: end;}
.investhome-slider1-wrap .btn-prev {width: 4rem; height: 4rem; background: url(../images/ic_arrow_left.svg) no-repeat center / 50% 50% #fff; border: none; text-indent: -200px; overflow: hidden;}
.investhome-slider1-wrap .btn-next {width: 4rem; height: 4rem; background: url(../images/ic_arrow_right.svg) no-repeat center / 50% 50% #fff; border: none; text-indent: -200px; overflow: hidden;}
.investhome-slider1-wrap .btns button:hover {background-color: #fafafa;}
.investhome-slider1-wrap .btns button {cursor: pointer;}  */

/* .investhome-slider1-wrap .btns {
    position: absolute;
    top: 50%; 
    left: 17%;
    width: 66%;
    display: flex;
    justify-content: space-between; 
    padding: 0 1rem; 
    z-index: 10;
    transform: translateY(-50%); 
} */
.investhome-slider1-wrap .btns {
  position: absolute;
  bottom: 21rem;
  left: 50%;
  width: 100%;
  max-width: 1180px;
  padding: 0 2rem;
  display: flex;
  justify-content: space-between; /* 좌우로 퍼지게 */
  transform: translateX(-50%);
  z-index: 1;
}
/* 모바일에서는 버튼 숨김 */
@media (max-width: 1100px) {
  .investhome-slider1-wrap .btns {
    display: none;
  }
}
.slider-btns-blur {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* height: 40px; */
  /* background: rgba(255, 255, 255, 0.3); */
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  z-index: 1;
}
.investhome-slider1-wrap .btn-prev,
.investhome-slider1-wrap .btn-next {
  width: 4rem;
  height: 4rem;
  background-color: #fff;
  opacity: 60%;
  border: none;
  text-indent: -200px;
  overflow: hidden;
  color: #fff;
  mask-size: 80% 80%;
  mask-repeat: no-repeat;
  mask-position: center;
  cursor: pointer;
}

.investhome-slider1-wrap .btn-prev {
  mask-image: url(../images/ic_arrow_left.svg);
}

.investhome-slider1-wrap .btn-next {
  mask-image: url(../images/ic_arrow_right.svg);
}

.investhome-slider1-wrap .btns button:hover {
  background-color: #fff;
  opacity: 100%;
}


/* .investhome-section2 {padding: 5.6rem 2rem 8.8rem;}
.investhome-section2 .inner {height: 11.6rem; display: flex; justify-content: center; max-width: 1100px; width: 100%; margin: 0 auto; overflow: hidden;  box-shadow: 0 .4rem .8rem 0 rgba(0, 0, 0, 0.05);}
.investhome-section2 .inner > div:nth-of-type(1) {flex: 1; width: 50%; display: flex; background: var(--Black, #263238); color: #fff;}
.investhome-section2 .inner > div:nth-of-type(2) {flex: 1; width: 50%; display: flex; border: .1rem solid var(--BG_disable, #EAEAEA); background: var(--White, #FFF); padding-right: 4rem;}
.investhome-section2 .inner > div {display: flex;}
.investhome-section2 .inner > div dl {display: flex; width: 25.6rem; height: 11.6rem; padding: 1.4rem .8rem; flex-direction: column; justify-content: center; align-items: center; gap: 8px; position: relative;}
.investhome-section2 .inner > div:nth-of-type(1) dl:nth-of-type(1) {border-right: .1rem solid var(--Black_bg, rgba(0, 0, 0, 0.50));} */

/* ========================================================================= */
/* [최종 확정] investhome-section2 슬라이더 버튼 위치 해결 (HTML 구조 유지) */
/* ========================================================================= */

.investhome-section2 {
    padding: 13rem 1rem 4.8rem;
}

/* 1. 버튼의 기준점인 .investhome-slider2-wrap 에 회색 박스와 동일한 제약 적용 */
.investhome-slider2-wrap {
    position: relative;
    /* ******** [핵심 수정 1] ******** */
    max-width: 1100px; /* 회색 박스(.notice)와 동일한 최대 너비 적용 */
    margin: 0 auto;    /* 중앙 정렬 */
    /* ******** ************** ******** */
}

/* 2. 공지사항 카드 전체 (회색 박스, a.notice) */
.investhome-section2 .notice {
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    height: 5.5rem; 
    
    /* [수정] 부모(.investhome-slider2-wrap)가 이미 max-width를 가졌으므로 100%로 변경 */
    max-width: 100%; 
    
    width: 100%; 
    /* .investhome-slider2-wrap 내부에서 중앙 정렬할 필요 없음 */
    margin: 0; 
    
    /* 버튼이 .investhome-slider2-wrap 기준으로 움직이므로 relative 불필요 (삭제 또는 주석 처리) */
    /* position: relative; */ 
    
    /* [유지] 버튼 공간 확보를 위해 padding-right 5rem 유지 */
    padding: 0 1.5rem 0 1.5rem; 
    background-color: #f1f3f5; 
    border-radius: 1.2rem; 
    text-decoration: none; 
    color: inherit;
}
.investhome-section2 .notice:hover {cursor: pointer;}


/* 3. 버튼 위치 정의 (기준점인 .investhome-slider2-wrap 의 right 끝을 기준으로 2rem) */
.investhome-slider2-wrap .btn-prev {
    position: absolute; 
    width: 2.4rem; 
    height: 2.4rem; 
    top: .8rem; 
    /* ******** [핵심 수정 2] ******** */
    right: 2rem; /* .notice의 padding-right(5rem) 안으로 들어오도록 right: 2rem 유지 */
    /* ******** ************** ******** */
    background: url(../images/ic_arrow_up.svg) no-repeat center / 100% 100% transparent; border: none; text-indent: -200px; overflow: hidden; z-index: 1;
}
.investhome-slider2-wrap .btn-next {
    position: absolute; 
    width: 2.4rem; 
    height: 2.4rem; 
    bottom: .8rem; 
    /* ******** [핵심 수정 2] ******** */
    right: 2rem; /* .notice의 padding-right(5rem) 안으로 들어오도록 right: 2rem 유지 */
    /* ******** ************** ******** */
    background: url(../images/ic_arrow_down.svg) no-repeat center / 100% 100% transparent; border: none; text-indent: -200px; overflow: hidden; z-index: 1;
}
.investhome-slider2-wrap button {cursor: pointer;} 
.investhome-slider2-wrap button:hover {background-color: #fafafa;}


/* 4. 기타 스타일 유지 */
.investhome-section2 .notice > div:nth-of-type(1) 
{
    flex: 1; 
    max-width: 100%; 
    overflow: hidden; 
    white-space: nowrap; 
    text-overflow: ellipsis; 
    display: flex; 
    justify-content: space-between; 
    color:#263238; 
    font-size: 1.6rem; 
    font-weight: 500; 
    opacity: 70%;
}
.investhome-section2 .notice > div:nth-of-type(2) {
    flex: 1; 
    width: 50%; 
    display: flex; 
    border: .1rem solid var(--BG_disable, #EAEAEA); 
    background: var(--White, #FFF); 
    padding-right: 4rem;
}
.investhome-section2 .notice > div {display: flex;}

/* ... 나머지 스타일 ... */

.investhome-slider2-wrap .notice-left {
    display: flex;
    justify-content: space-between; 
    align-items: center;
}

.investhome-slider2-wrap .notice-right {
  text-decoration: underline;
    font-size: 14px;
    color: #263238;
    width: 100px; 
    flex-shrink: 0;
    text-align: right;
}

/* 5. 미디어 쿼리 수정 (모바일에서는 right: 1rem으로 다시 변경) */
@media (max-width: 767px) {
    .investhome-slider2-wrap .btn-prev,
    .investhome-slider2-wrap .btn-next {
        right: 1rem; /* 모바일에서는 여백을 줄여 1rem로 조정 */
    }
    .investhome-slider2-wrap .notice-right {
        display : none;
    }
}

@media screen and (max-width: 768px) {
    .investhome-slider2 .notice {
        display: block;
        padding: 1.6rem;
        height: auto;
        border-radius: 1.2rem;
        background: var(--BG_subbody, #F1F3F5);
    }

    .investhome-slider2 .notice-left {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: .8rem;
    }

    .investhome-slider2 .notice-left > div:first-child {
        margin-left: 0 !important;
        font-size: 1.5rem !important;
        line-height: 2.2rem;
        font-weight: 600;
        color: var(--Black, #263238);
    }

    .investhome-slider2 .notice-right {
        display: block !important;
        margin: 0 0 0 1.6rem !important;
        padding: 0 !important;
        text-align: left !important;
        align-self: flex-start !important;
        font-size: 1.3rem !important;
        line-height: 2rem;
        font-weight: 400;
        color: var(--Subbody_02, #999);
    }

    .investhome-slider2 .notice .notice-left .notice-right {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
        align-self: flex-start !important;
        font-size: 1.3rem !important;
        line-height: 2rem;
        font-weight: 400;
        color: var(--Subbody_02, #999);
    }
}

.loan-row {
  display: flex;
  justify-content: center; /* 전체 페이지 중앙 정렬 */
  gap: 40px; /* 항목 사이 간격 */
  margin-top: 4.8rem;
  margin-bottom: 3rem;
  padding: 0 34px; /* 카드 패딩과 동일 */
  flex-wrap: wrap; /* 화면 좁아지면 줄 바꿈 가능 */
}

.loan-info {
  display: flex;
  flex-direction: row; /* 기본: 좌우 */
  align-items: baseline;
  gap: 0.8rem;
}

/* 레이블/값 기본 스타일 */
.loan-info .label {
  font-weight: 400;
  font-size: 15px;
  color: #828282;
}

.loan-info .value {
  font-weight: 600;
  font-size: 25px;
  text-align: right;
}

.loan-info .unit {
  font-size: 16px;
  font-weight: 600;
}

/* 반응형: 화면이 좁으면 카드처럼 위/아래 정렬 */
@media (max-width: 640px) {
  .loan-info {
    flex-direction: column; /* 레이블 위, 값 아래 */
    align-items: flex-start; /* 왼쪽 정렬 */
  }
  .loan-info .value {
    text-align: left; /* 값도 왼쪽 정렬 */
  }
}

.investhome-section3 {padding: 0 2rem 2.8rem; text-align: center;}
.investhome-section3 .inner {max-width: 1100px; width: 100%; margin: 0 auto;}
.investhome-section3 h2 {text-align: center; font-size: 2.8rem; font-weight: 700; line-height: 4rem; margin-bottom: 4.8rem;}
.investhome-section3 h3 {text-align: center; font-size: 2.3rem; font-weight: 600; line-height: 8rem; margin-bottom: -1.4rem;}
.investhome-section3 h3-1 {text-align: center; font-size: 1.5rem; font-weight: 500; color: #828282;}
.investhome-section3 h4 {text-align: center; font-size: 1.3rem; font-weight: 400; line-height: 0.1rem; color: #999999; margin-bottom: 4rem;}
/* .investhome-section3 table {width: 75%; border-collapse: collapse; box-shadow: 0 0 6px rgba(0, 0, 0, 0.15); border-radius: 3px; overflow: hidden; align-items: center; margin: 0 auto;} */
.investhome-section3 table {width: 60%; border-collapse: separate; border-radius: 10px; overflow: hidden; align-items: center; margin: 0 auto; border: 1px solid #e6e6e6;}
.investhome-section3 table thead {border-right: 1px solid #e6e6e6;}
.investhome-section3 table tbody {border-left: 1px solid #e6e6e6;}

.investhome-section3 table th {font-size: 15px; padding: 35px 10px 0px; text-align: center; font-weight: 400; background-color: #fff; color: #848484;}
.investhome-section3 table td {font-size: 24px; padding: 0px 10px 35px; text-align: center; font-weight: 600; background-color: #fff;}
.investhome-section3 table span {font-size: 14px; text-align: center; font-weight: 600;}
.investhome-section3 a div {text-align: center; color: #848484; font-weight: 500; font-size: 15px; margin-bottom: 4rem;}
.investhome-section3 a div hr {width: 30%; margin-top: 4.2rem; margin-bottom: 1.4rem; border: 0.2px solid #D7DBDE;}
/* .investhome-section3 table thead {background-color: #f4f4f4;} */

.investhome-section4 {margin-bottom: 6.4rem;}
.investhome-section4 .inner {max-width: 1100px; width: 100%; margin: 0 auto;}
.investhome-section4 h2 {text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 4rem; margin-bottom: 4.8rem;}

.box-gray {background: #F6F6F6; display: flex; padding: 8.2rem 2rem 8.2rem; justify-content: center; flex-direction: column; align-items: center; gap: 3.2rem;}
.box-gray img {width: 10.4rem;}
.box-gray p {text-align: center; font-size: 1.7rem; font-weight: 500; line-height: 3rem; color: #686868;}

.investhome-section5 {padding: 0 2rem 6.4rem;}
.investhome-section5 .inner {border-radius: 1.6rem; background: url(../images/ic_opennoti.png) no-repeat #FEE738 90% 1rem / auto 23.9rem; max-width: 1100px; margin: 0 auto; padding: 4.8rem 6.1rem;}
.investhome-section5 p {color: #311D16; font-size: 1.4rem; line-height: 2.4rem; margin-bottom: 1.6rem;}
.investhome-section5 h2 {color: #311D16; font-size: 3.2rem; font-weight: 700; line-height: 4rem; margin-bottom: 2.4rem;}
.investhome-section5 button {font-size: 1.4rem; line-height: 2.4rem;}
                
.investhome-section6 {padding: 2.4rem 2rem 0;}
.investhome-section6 .inner {max-width: 1100px; width: 100%; margin: 0 auto;}
.investhome-section6 h2 {text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 4rem; margin-bottom: 4.8rem;}

/* 목록타입 설정버튼 */
.list-type {display: flex; width: 100%; max-width: 1100px; margin: 0 auto; justify-content: end; align-items: center; gap: 1.6rem; padding: 0 2rem;}
.list-type .tit {font-size: 1.4rem; font-weight: 500; line-height: 2.4rem;}
.btn-list-normal {width: 2.4rem; height: 2.4rem; overflow: hidden; font-size: 1px; text-indent: -200px; background: url(../images/ic_list_normal.svg) no-repeat center / contain #fff; opacity: .2;}
.btn-list-simple {width: 2.4rem; height: 2.4rem; overflow: hidden; font-size: 1px; text-indent: -200px; background: url(../images/ic_list_simple.svg) no-repeat center / contain #fff; opacity: .2;}
.btn-list-normal.active, .btn-list-simple.active {opacity: 1;}

/* 투자상품 목록 아이템 1 */
.recruit-list {width: 100%; display: flex; gap: 4.8rem; flex-wrap: wrap;}
.recruit-item {flex: 0 0 calc( (100% - 9.6rem ) / 3 ); transition: transform .1s ease; background-color: #F5F5F5; border-radius: 5%;}
.recruit-item .thumb {width: 100%; padding-top: 66.27%; position: relative; overflow: hidden; border-radius: .8rem;}
.recruit-item .thumb img {width: 100%; position: absolute; top: 0; left: 0; height: 100%; object-fit: cover; transition: transform .5s;}
.recruit-item .thumb p {position: absolute; z-index: 1; border-radius: .8rem; background: rgba(0, 0, 0, 0.50); display: inline-flex; color: #fff; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 1.6rem; gap: .4rem; flex-direction: column; align-items: center; text-align: center; white-space: nowrap;}
.recruit-item .thumb p span {font-size: 1.4rem; font-weight: 500; line-height: 2.4rem;}
.recruit-item .thumb p strong {font-size: 1.8rem; font-weight: 500; line-height: 2.2rem;}
.recruit-item:hover {transform: translateY(-1rem);}
.recruit-item:hover .thumb img {transform: scale(1.15);}
.recruit-item .tit-wrap {display: flex; gap: 1.6rem; justify-content: space-between; padding: 0 0 0; align-items: start; margin-bottom: 2rem; flex-direction: column; align-items: center; text-align: center;}
.recruit-item .tit-wrap > div {display: flex; gap: .4rem; flex-direction: column; background-color: var(--White); text-align: center; padding: 0.5rem 0.5rem; margin: 1rem 0; border-radius: 1rem;}
.recruit-item .tit-wrap > div .tit {font-size: 1.6rem; font-weight: 600; line-height: 2.4rem; text-align: left;}
.recruit-item .tit-wrap > div .stit {color: var(--Subbody_01, #848484); font-size: 1.3rem; font-weight: 300; line-height: 1.8rem; text-align: left; margin-bottom: 2rem;}
.recruit-item .tit-wrap [class^='badge-'] {min-width: 4.8rem; height: 4.8rem; display: flex; align-items: center; margin-top: .2rem;}
.recruit-item .info1-wrap {display: flex; gap: 1.6rem; justify-content: space-between; margin-bottom: 1.6rem; align-items: end;}
.recruit-item .info1-wrap dl {display: flex; gap: .4rem; flex-direction: column;}
.recruit-item .info1-wrap dt {color: var(--Subbody_02, #999); font-size: 1.2rem; font-weight: 600; line-height: 2rem;}
.recruit-item .info1-wrap dd {font-size: 1.6rem; font-weight: 500; line-height: 2.4rem;}
.recruit-item .info1-wrap dd strong {font-size: 2rem; font-weight: 600; line-height: 2.4rem;}
.recruit-item .info1-wrap .line {background-color: var(--Line_Default); height: 1rem; flex: 0 0 .2rem; margin-bottom: .7rem; display: none;}

.recruit-item .info2-wrap {margin-top: .8rem; display: flex; justify-content: space-between; align-items: center;}
.recruit-item .info2-wrap dl {display: flex; gap: .8rem; align-items: center;}
.recruit-item .info2-wrap dt {color: var(--Subbody_01, #848484); font-size: 1.2rem; font-weight: 500; line-height: 2rem;}
.recruit-item .info2-wrap dd {font-size: 1.4rem; font-weight: 600; line-height: 2.2rem;}

/* 투자상품 목록 아이템 2 */
.recruit-list2 {display: flex; gap: 4.8rem 3.8rem; flex-wrap: wrap; margin-bottom: 4.8rem;}
.recruit-item2 {position: relative; width: calc( (100% - 11.4rem) / 4 ); transition: transform .1s ease;}
.recruit-item2 .thumb {position: relative; color: var(--White, #FFF); margin-bottom: 1.6rem; width: 100%; padding-top: 66.27%; border-radius: .8rem; overflow: hidden;}
.recruit-item2 .thumb img {border-radius: .8rem; width: 100%; position: absolute; top: 0; left: 0; height: 100%; object-fit: cover; transition: transform .5s ease;}
.recruit-item2:hover {transform: translateY(-1rem);}
.recruit-item2:hover .thumb img {transform: scale(1.15);}
.recruit-item2 .thumb .date {position: absolute; top: 0; right: 0; text-align: right; font-size: 1.2rem; font-weight: 500; line-height: 2rem; border-radius: .8rem; background: var(--Black, #263238); padding: .4rem .8rem;}
.recruit-item2 .thumb .status-wrap {position: absolute; bottom: 0; left: 0; width: 100%; display: flex; justify-content: space-between; padding: .5rem 1.2rem;}
.recruit-item2 .thumb .status-wrap .status {display: flex; font-size: 1.4rem; line-height: 2.4rem; gap: .4rem; align-items: center;}
.recruit-item2 .thumb .status-wrap .status i {width: 1.2rem; height: 1.2rem; border-radius: .6rem; display: inline-block; background: #ccc;}
.recruit-item2 .thumb .status-wrap .status i.inprogress {background: var(--Green_200);}
.recruit-item2 .thumb .status-wrap .status i.completed {background: var(--Red_400);}
.recruit-item2 .thumb .status-wrap .install {font-size: 1.4rem; line-height: 2.4rem;}
.recruit-item2 .tit-wrap {display: flex; gap: 1.2rem; flex-direction: column; width: 100%; margin: 0; padding-top: 0; margin-bottom: .2rem;}
.recruit-item2 .tit-wrap .badges {width: 100%; display: flex; flex-wrap: wrap; gap: .4rem;}
.recruit-item2 .tit-wrap .badges span {min-width: 5.8rem;}
.recruit-item2 .tit {font-size: 2rem; font-weight: 500; line-height: 2.4rem; width: 100%;}
.recruit-item2 .stit {color: var(--Subbody_01, #848484); font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; width: 100%;}
.recruit-item2 .info {width: 100%; margin-top: .4rem; line-height: 2.2rem; display: flex; align-items: center; justify-content: start; gap: .5rem;}
.recruit-item2 .info .line {width: .2rem; height: .2rem; border-radius: .1rem; background: var(--Subbody_01);}


/* --- 카드 컨테이너 --- */
.product-list {
  display: grid;
  /* 수정 전: grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); */
  /* 수정 후: auto-fill을 사용합니다. */
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); 
  
  gap: 20px;
  justify-content: start; 
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 47px 0;
}


.product-card {
  width: 100%;
  background: #fff;
  border-radius: 15px 15px 25px;
  /* box-shadow: 0 5px 20px rgba(0,0,0,0.1);   */
  transition: 0.3s;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

/* 모바일 1열 */
@media (max-width: 767px) {
  .product-list {
    grid-template-columns: 1fr; /* 한 줄 1개 */
    padding: 0 2rem;
  }

  .product-card {
    max-width: 100%; /* 카드 폭 부모에 맞춤 */
  }
}

.product-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}
/* hover 비활성화용 클래스 */
.product-card.no-hover:hover {
  transform: none;
  box-shadow: none;
  cursor: default;
}

/* 모집 예정 상품이 없을 때 나타나는 카드를 꽉 채우기 */
.product-list .product-card.no-hover {
    grid-column: 1 / -1; /* 첫 번째 열부터 마지막 열까지 확장 */
    width: 100%;
}

/* --- 배지 --- */
.product-card__badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: linear-gradient(to right, #a90329, #c44848, #aa2238);
  color: #fff;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 10px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
  z-index: 10;
}

/* --- 이미지 --- */
.product-card__image-wrap {
  overflow: hidden;
}

.product-card__image {
  height: 280px;
  overflow: hidden;
}

.product-card__image img {
  width: 100%;
  height: 100%;
  transition: transform 0.5s;
}

.product-card:hover .product-card__image img {
  transform: scale(1.05);
}

/* --- 정보 --- */
.product-card__info {
  padding: 20px;
  background-color: #f6f6f6;
}

.product-card__layer {
  padding: 5px 20px 20px;
  border-radius: 18px;
  background: #fff;
}

.product-subtitle {
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  color: #656565;
  /* /* border-top: 1px solid #f4f4f5; */
  border-bottom: 1px solid #f5f5f5;
  padding-bottom: 21px;
  padding-top: 2px;
  /* margin-bottom: 5px; */
}

.product-card__title {
  /* border-top: 1px solid #f4f4f5; */
  font-size: 18px;
  font-weight: 600;
  /* padding-top: 1px; */
  letter-spacing: -0.2px;
  /* margin: 0 0 10px; */
}

.product-card__subtitle {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  color: #828282;
  font-style: italic;
  /* border-bottom: 1px solid #f4f4f5; */
  padding-bottom: 12px;
}

.product-card__unit {
    font-size: 13px;
    font-weight: 600;
}

.product-card__desc {
  display: grid;
  grid-template-columns: 1fr 1fr; /* 비율 2:1:1 */
  text-align: center;
  font-size: 13px;
  color: #52525b;
  /* margin: 1px 0 12px; */
  /* border-bottom: 1px solid #f4f4f5; */
}

.product-card__desc-item {
  flex: 1; /* 3등분 */
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  text-align: left;
}

.product-card__desc-item .top-text {
  font-weight: 400;
  color: #686868;
  margin-top: 13px;
  margin-bottom: 4px;
  font-size: 13.7px;
}

.product-card__desc-item .bottom-text {
  font-size: 21px;
  font-weight: 600;
  color: #263238;
}

.product-card__desc-item .unit {
  font-size: 12px;
  font-weight: 600;
  color: #263238;
}

/* --- 특징 리스트 --- */
.product-card__features {
  display: flex;
  gap: 6px;
  margin-top: 15px;
  margin-bottom: 15px;
}

.product-card__feature {
  font-size: 13px;
  background: #f1f3f5;
  color: #757575;
  padding: 8px 13px;
  border-radius: 15px;
  font-weight: 600;
}

.product-card__feature--main {
  font-size: 13px;
  line-height: 18px;
  background: #FF5252;
  color: #fff;
  padding: 5px 10px;
  /* margin-left: 8px; */
  border-radius: 5px;
  font-weight: 500;
  letter-spacing: -0.2px;
  justify-items: right;
  align-items: center;
  display: flex;
}

.product-card__feature--sub {
  font-size: 12px;
  background: #fff;
  color: #FF5252;
  padding: 5px 10px;
  border-radius: 5px;
  border: 1px solid #FF5252;
  font-weight: 600;
}

/* --- 하단 --- */
.product-card__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* margin-bottom: 12px; */
}

.product-card__price {
  display: flex;
  flex-direction: column;
}

.product-card__price--title {
  font-size: 13.7px;
  font-weight: 400;
  color: #828282;
  /* margin-top: 15px; */
  margin-top: 21px;
  margin-bottom: 1px;
}

.product-card__price--progress {
  font-size: 12px;
  font-weight: 500;
  color: #a1a1aa;
  /* color: #259671; */
  margin-bottom: 2px;
}

.product-card__price--target {
  font-size: 21px;
  font-weight: 700;
  color: #263238;
}

/* --- 버튼 --- */
.product-card__btn {
  background: linear-gradient(45deg, #18181b, #27272a);
  color: #fff;
  border: none;
  border-radius: 3px;
  padding: 12px 15px;
  font-size: 12.7px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center; /* 가운데 정렬 */
  gap: 6px;
  transition: 0.3s;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
  position: relative;
  width: 100%; /* 카드 가로폭에 맞춤 */
  box-sizing: border-box; /* padding 포함 */
}

.product-card__btn:hover {
  background: linear-gradient(45deg, #27272a, #3f3f46);
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.product-card__btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.1),
    transparent
  );
  transition: 0.5s;
}

.product-card__btn:hover::before {
  left: 100%;
}


.product-card__icon {
  transition: transform 0.3s;
}

.product-card__btn:hover .product-card__icon {
  transform: rotate(-10deg) scale(1.1);
}

/* --- 메타 정보 --- */
.product-card__meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #f4f4f5;
  padding-top: 12px;
}

.product-card__rating {
  display: flex;
  align-items: center;
  gap: 2px;
}

.product-card__review-count {
  margin-left: 6px;
  font-size: 11px;
  color: #71717a;
}

.product-card__stock {
  font-size: 11px;
  font-weight: 600;
  color: #22c55e;
}

/* --- 반응형 --- */
@media (max-width: 1078px) {
  .product-card {
    width: 100%;
  }

  .product-card__title {
    font-size: 17px;
  }

  .product-card__price--target {
    font-size: 19px;
  }

  .product-card__desc-item .bottom-text {
    font-size: 19px;
  }

  .product-card__image {
    height: 180px;
  }

  .product-card__bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .product-card__price {
    margin-bottom: 5px;
  }

  .product-card__btn {
    width: 100%;
    justify-content: center;
  }

  .box-gray p {line-height: 160%; font-size: 1.6rem;}
}



/* 모집완료 (리스트 형태 일괄 적용) */
/* 전체 컨테이너: 중앙 정렬 + 최대 너비 */
.completed-container {
  max-width: 1200px;
  margin: 0rem auto;
  padding: 47px;
}

/* 리스트 영역 */
.completed-list {
  display: flex;
  flex-direction: column;
  gap: 1rem; /* 개별 카드 간 간격 */
}

/* 헤더는 전체 카드가 아닌 첫 카드 상단에만 표시 */
.completed-header {
  display: grid;
  grid-template-columns: .8fr .8fr .8fr 1.5fr 1.5fr .8fr .8fr;
  padding: 1.6rem 2.5rem;
  font-weight: 500;
  font-size: 1.5rem;
  background: #f1f3f5;
  color: #757575;
  border-radius: 8px 8px 3px 3px;
  text-align: left;
}

/* 개별 카드 */
.completed-row {
  display: grid;
  grid-template-columns: .8fr .8fr .8fr 1.5fr 1.5fr .8fr .8fr;
  align-items: center;
  padding: 1.6rem 2.5rem;
  border: 1px solid #eee;
  border-radius: 5px;
  font-size: 1.5rem;
  color: #263238;
  text-decoration: none;
  transition: all 0.2s ease;
  cursor: pointer;
  background: #fff;
}

.completed-row:hover {
  background: #fafafa;
  transform: translateY(-1px);
}

/* 텍스트 스타일 */
.completed-status_inPayment {
  font-size: 1.3rem;
  font-weight: 500;
  color: #fff;
  border-radius: 7px;
  padding: 8px 18px;
  background: #4169E1;
  max-width: 72px;
}

.completed-status_paid {
  font-size: 1.3rem;
  font-weight: 500;
  color: #fff;
  border-radius: 7px;
  padding: 8px 13px;
  background: #363E0A;
  max-width: 72px;
}

.completed-status_late {
  font-size: 1.3rem;
  font-weight: 500;
  color: #fff;
  border-radius: 7px;
  padding: 8px 18px;
  background: #E9C400;
  max-width: 72px;
}

.completed-int_status {
  font-weight: 400;
  color: #3B3938;
}

.completed-category {
  color: #3B3938;
}

.completed-name {
  font-weight: 400;
  color: #3B3938;
}

.completed-amount {
  font-weight: 400;
  color: #3B3938;
}

.completed-period {
  font-weight: 400;
  color: #3B3938;
}

.completed-yield {
  font-weight: 400;
  color: #3B3938;
}


/* 반응형 모바일 */
@media (max-width: 768px) {
  .completed-container {
    padding-inline: 44px;
  }


  .completed-header {
    display: none;
  }

  .completed-row {
    grid-template-columns: 1fr;
    border-radius: 10px;
    padding: 1rem 1.2rem;
  }

  .completed-row span {
    display: block;
    margin-bottom: 0.5rem;
  }

  .completed-name {
    font-size: 1.05rem;
    margin-bottom: 0.6rem;
  }

  .completed-yield {
    font-size: 1rem;
  }
}


/* 투자 - 투자상품 */
.investprod-wrap {width: 100%; background: #fff; padding: 2.4rem 0;}
/* .investprod-wrap .investhome-section5 {padding-bottom: 4rem;} */
/* .investprod-wrap h2 {text-align: left !important; font-size: 2.4rem !important; line-height: 3.4rem !important; margin-bottom: 3.2rem !important;} */
/* .investprod-wrap .investhome-section3 {padding-bottom: 12rem;} */
/* 
.investprod-wrap .investhome-section3 {padding: 1.6rem 2rem 4.2rem !important;}
.investprod-wrap h2 {font-size: 1.8rem !important; line-height: 2.4rem !important; margin-bottom: 1.6rem !important;}
.investprod-wrap .investhome-section5 {padding-bottom: 2.4rem;} */


/* 목록 간소화 타입 */
.investprod-wrap.simple {gap: 0;}
.investprod-wrap.simple .recruit-list {gap: 0 !important;}
.investprod-wrap.simple .recruit-item {padding-top: 2rem; padding-bottom: 2rem; border-bottom: .1rem solid var(--Line_Default);}
.investprod-wrap.simple .recruit-item:nth-of-type(1) {padding-top: 0;}
.investprod-wrap.simple .recruit-item .thumb {display: none;}
.investprod-wrap.simple .recruit-item .info1-wrap dt {display: none;}
.investprod-wrap.simple .recruit-item .tit-wrap {margin-bottom: .8rem; padding-top: 0;}
.investprod-wrap.simple .recruit-item .tit-wrap > div .tit {font-weight: 700;}
.investprod-wrap.simple .recruit-item .info1-wrap dd, .investprod-wrap.simple .recruit-item .info1-wrap dd strong {font-size: 1.4rem !important; font-weight: 500 !important; text-align: center; white-space: nowrap;}
.investprod-wrap.simple .recruit-item .info1-wrap .line {display: block;}
.investprod-wrap.simple .progressbar-box {height: .8rem;}

.investprod-wrap.simple .recruit-list2 {gap: 0;}
.investprod-wrap.simple .recruit-item2 {padding: 2rem 0; border-bottom: .1rem solid var(--Line_Default);}
.investprod-wrap.simple .recruit-item2 .thumb {padding-top: 0; color: var(--Subbody_01); display: flex; width: 100%; justify-content: space-between; flex-direction: row-reverse; align-items: center; margin-bottom: .4rem;}
.investprod-wrap.simple .recruit-item2 .thumb img {display: none;}
.investprod-wrap.simple .recruit-item2 .thumb .date {position: static; background: none; white-space: nowrap;}
.investprod-wrap.simple .recruit-item2 .thumb .status-wrap {position: static; justify-content: start; padding: 0;}
.investprod-wrap.simple .recruit-item2 .thumb .status-wrap .status::after {content: ''; width: .3rem; height: .3rem; border-radius: .2rem; display: inline-block; margin: 0 .6rem 0 .4rem; background: var(--Subbody_01)}
.investprod-wrap.simple .recruit-item2 .tit-wrap {flex-direction: row-reverse;}
.investprod-wrap.simple .recruit-item2 .tit-wrap .badges {justify-content: end;}
.investprod-wrap.simple .recruit-item2 .tit {font-size: 1.6rem; line-height: 2.4rem; font-weight: 700;}
.investprod-wrap.simple .recruit-item2 .stit {font-size: 1.4rem; line-height: 2.2rem;}

.investprod-wrap.simple .recruit-item2 .info { width: 100%; margin-top: .4rem; line-height: 2.2rem; display: flex; align-items: center; justify-content: space-between;}
.investprod-wrap.simple .recruit-item2 .info .line {background-color: var(--Line_Default); height: 1rem; flex: 0 0 .2rem;}

.content-a {display: flex; flex-wrap: wrap; gap: 1.6rem;}
.content-a > div {padding: 2rem 2.4rem; display: flex; flex-direction: column; gap: 1.4rem; border-radius: .8rem; background: var(--Gray, #f4f4f4); flex: 1 1 calc( 50% - 1.6rem );}
.content-a > div h5 {text-align: left; color: var(--Subbody_01, #848484); font-size: 1.4rem !important; font-weight: 400 !important; line-height: 1.4rem !important; margin-bottom: 0 !important;}
.content-a > div p {text-align: right; width: 100%; font-size: 2rem; font-weight: 500; line-height: 1.4rem; margin: 0;}

.content-b {display: flex; flex-wrap: wrap; gap: 1.6rem;}
.content-b > div {padding: 2.8rem; display: flex; flex-direction: column; gap: .3rem; border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); align-items: center; flex: 1 1 calc( (100% - ( 1.6rem * 3 )) / 4 );}
.content-b > div h5 {text-align: center; color: #828282; font-size: 1.5rem; font-weight: 400 !important; line-height: 2.4rem !important; margin-bottom: 0.1rem !important; width: 100%;}
.content-b > div p {text-align: center; width: 100%; font-size: 2rem; font-weight: 500; line-height: 3rem; margin: 0;}


/* 투자 - 투자상품 상세 */
.investproddetail-wrap {width: 100%; background: #fff;}
.investproddetail-wrap .inner {width: 100%; max-width: 1040px; margin: 0 auto; padding: 0; position: relative;}
/* .investproddetail-section1 {background: url(../images/blue-bg.jpg) no-repeat center / cover; color: #fff; padding: 0 2rem; min-height: 46.4rem; margin-bottom: 8rem;} */
/* .investproddetail-section1 {background-color: #8B4411; color: #fff; padding: 0 2rem; min-height: 48rem; margin-bottom: 8rem;} */
.investproddetail-section1 {background-color: #4169E1; color: #fff; padding: 0 2rem; min-height: 48rem; margin-bottom: 8rem;}
.investproddetail-section1 .inner {padding: 6.4rem 0;}
.investproddetail-section1 .group1 {display: flex; justify-content: space-between; gap: 1.6rem;}
.investproddetail-section1 .group1-1 {}
.investproddetail-section1 .group1-1 .badges {margin-bottom: 1.6rem; display: flex; justify-content: start; gap: .8rem; }
.investproddetail-section1 .group1-1 .badges span {}
.investproddetail-section1 .group1-1 h2 {font-size: 3.4rem; line-height: 5.8rem; font-weight: 700; margin-bottom: 0.6rem;}
.investproddetail-section1 .group1-1 p {font-size: 1.7rem; line-height: 2.2rem; font-weight: 400; margin-bottom: 3.2rem;}
.investproddetail-section1 .group1-2 {display: flex; justify-content: space-between; gap: .8rem;}
.investproddetail-section1 .group1-3 {display: flex; justify-content: space-between; gap: .8rem;}
.investproddetail-section1 .group1-4 {display: flex; justify-content: space-between; gap: .8rem;}
/* .investproddetail-section1 .group1-2 .con {background: #AE6E4E; display: flex; width: 16rem; padding: 2.4rem; flex-direction: column; justify-content: center; align-items: flex-start; gap: .8rem; border-radius: .8rem; height: 13.4rem;} */

/* 모집예정 */
.investproddetail-section1 .group1-2 .con {background: #1A3DA5; display: flex; width: 16rem; padding: 2.4rem; flex-direction: column; justify-content: center; align-items: flex-start; gap: .8rem; border-radius: .8rem; height: 13.4rem;}
.investproddetail-section1 .group1-2 .con h4 {font-size: 1.7rem; font-weight: 600; line-height: 2rem;}
.investproddetail-section1 .group1-2 .con p {font-size: 4.0rem; font-weight: 700; line-height: 5.8rem;}
.investproddetail-section1 .group1-2 .con p span {font-size: 2.4rem; font-weight: 500; line-height: 3.6rem;}

/* 모집중 */
.investproddetail-section1 .group1-3 .con {background: #ff443a; display: flex; width: 16rem; padding: 2.4rem; flex-direction: column; justify-content: center; align-items: flex-start; gap: .8rem; border-radius: .8rem; height: 13.4rem;}
.investproddetail-section1 .group1-3 .con h4 {font-size: 1.7rem; font-weight: 600; line-height: 2rem;}
.investproddetail-section1 .group1-3 .con p {font-size: 4.0rem; font-weight: 700; line-height: 5.8rem;}
.investproddetail-section1 .group1-3 .con p span {font-size: 2.4rem; font-weight: 500; line-height: 3.6rem;}

/* 모집완료 */
.investproddetail-section1 .group1-4 .con {background: #0b5e5e; display: flex; width: 16rem; padding: 2.4rem; flex-direction: column; justify-content: center; align-items: flex-start; gap: .8rem; border-radius: .8rem; height: 13.4rem;}
.investproddetail-section1 .group1-4 .con h4 {font-size: 1.7rem; font-weight: 600; line-height: 2rem;}
.investproddetail-section1 .group1-4 .con p {font-size: 4.0rem; font-weight: 700; line-height: 5.8rem;}
.investproddetail-section1 .group1-4 .con p span {font-size: 2.4rem; font-weight: 500; line-height: 3.6rem;}


.investproddetail-section1 .group2 {margin-bottom: 4.8rem;}
.investproddetail-section1 .group2 h3 {font-size: 1.7rem; font-weight: 500; line-height: 2.2rem; margin-bottom: 1.2rem; margin-top: 2.8rem;}
.investproddetail-section1 .group2 .progressbar-box {height: 3.2rem; border-radius: 1.6rem; background: #f5f5f5; margin-bottom: 1.2rem;}
.investproddetail-section1 .group2 .progressbar {height: 100%; background: var(--Flash, #BEF30F); border-radius: 1.6rem;}
.investproddetail-section1 .group2 .progressbar-box p {color: #fff; font-size: 1.6rem; line-height: 2.4rem;}
.investproddetail-section1 .group3 {display: flex; padding: 3.4rem; justify-content: center; align-items: center; gap: 4.8rem; border-radius: .8rem; background: var(--White, #FFF); box-shadow: 0 .8rem 1.6rem 0 rgba(0, 0, 0, 0.10); margin-bottom: 3.4rem; position: absolute; bottom: -10.8rem; left: 0; width: 100%;}
.investproddetail-section1 .group3 ul {display: flex; justify-content: center;}
.investproddetail-section1 .group3 li {display: flex; gap: 1rem; flex-direction: column; align-items: center; border-right: .1rem solid var(--Line_Default, #DEDEDE); flex: 1; padding: 0 6.4rem;}
.investproddetail-section1 .group3 li:last-child {border-right: none;}
.investproddetail-section1 .group3 h5 {color: #828282; text-align: center; font-size: 1.6rem; font-weight: 500; line-height: 2rem;}
.investproddetail-section1 .group3 p {color: var(--Black, #263238); font-size: 1.8rem; font-weight: 600; line-height: 3.8rem; white-space: nowrap; letter-spacing: -0.4px;}

.investproddetail-section2 {margin-bottom: 7.2rem; padding: 0 2rem;}
.investproddetail-section2 .inner {display: flex; gap: 2.4rem;}
.thumb-wrap {width: 44rem; height: 29.2rem; border-radius: .8rem; overflow: hidden; flex: 0 0 50%; max-width: 51rem; position: relative;}
.thumb-wrap .thumb-slider {width: 100%; height: 100%;}
.thumb-wrap .thumb-item {overflow: hidden; width: auto; height: 100%;}
.thumb-wrap .thumb-item img {width: 100%; height: 100%; object-fit: cover;}
.thumb-wrap .btns {position: absolute; bottom: 0; right: 0; color: #fff; display: flex; gap: .1rem;}
.thumb-wrap .btns > * {width: 4.6rem; height: 4.6rem; background: var(--Black); line-height: 4.6rem !important; text-align: center; color: #fff; border: none; overflow: hidden;}
.thumb-wrap .thumb-pagination {font-size: 1.8rem; font-weight: 500; line-height: 2.2rem;}
.thumb-wrap .btns .btn-pause-play {background: url(../images/ic_pause.svg) no-repeat center / 100% auto var(--Black); font-size: 1px; text-indent: -200px; cursor: pointer;}
.thumb-wrap .btns .btn-pause-play.paused {background-image: url(../images/ic_play.svg); background-size: 2rem auto !important;}
.thumb-wrap .btns .btn-prev {background: url(../images/ic_arrow_prev_w.svg) no-repeat center / 2rem 2rem var(--Black); font-size: 1px; text-indent: -200px; cursor: pointer;}
.thumb-wrap .btns .btn-next {background: url(../images/ic_arrow_next_w.svg) no-repeat center / 2rem 2rem var(--Black); font-size: 1px; text-indent: -200px; cursor: pointer;}
.thumb-wrap .btns button {transition: background .3s;}
.thumb-wrap .btns button:hover {background-color: #555;}

.investproddetail-section2 .checkpoint-wrap {border-radius: .8rem; background-color: #f3f3f3; display: flex; height: 29.2rem; padding: 2.4rem 3.2rem; flex-direction: column; align-items: flex-start;}
.investproddetail-section2 .checkpoint-wrap h3 {font-size: 2.0rem; font-weight: 600; line-height: 3.2rem; gap: .8rem; display: flex; align-items: center; margin-bottom: 1.2rem; color: #263238;}
.investproddetail-section2 .checkpoint-wrap h3 img {width: 2.8rem; height: 2.8rem;}
.investproddetail-section2 .checkpoint-wrap .list-check {display: flex; flex-direction: column; gap: 1.2rem; overflow: auto;}
.investproddetail-section2 .checkpoint-wrap .list-check li {position: relative; padding-left: 1.2rem; font-size: 1.6rem; line-height: 2.4rem; font-weight: 400;}
/* .investproddetail-section2 .checkpoint-wrap .list-check li::before {content: ''; width: 2.4rem; height: 2.4rem; background: url(../images/ic_check2.svg) no-repeat center / 100% 100%; display: inline-block; position: absolute; top: 0; left: 0;} */
.investproddetail-section2 .checkpoint-wrap .list-check li::before {content: ''; width: 2.4rem; height: 2.4rem; display: inline-block; position: absolute; top: 0; left: 0;}

.investproddetail-section3 {padding: 3.4rem 2rem;}
.investproddetail-section3 .inner {display: flex; gap: 8rem;}
.investproddetail-section3 .inner > div {flex: 1;}
.investproddetail-section3 .btn-more2 {max-width: none;}

.investproddetail-section4 {padding: 5rem 2rem 5rem;}
.graph-wrap {display: flex; flex-direction: column; gap: 4rem;}
.graph-wrap > div {display: flex; flex-direction: column; gap: 1.6rem;}
.progressbar-box-wrap {padding-right: 16rem;}
.progressbar-box-wrap .progressbar-box {border-radius: 1.6rem; background: transparent; overflow: visible;}
.progressbar-box-wrap p {color: var(--Black); font-weight: 400;}
.progressbar-box-wrap span {position: absolute; left: calc( 100% + 1.6rem ); font-size: 1.6rem; top: .5rem; white-space: nowrap;}
.progressbar-box-wrap .progressbar {position: absolute; border-radius: 1.6rem; top: 0; left: 0; height: 100%; z-index: 1;}
.progressbar-box-wrap .progressbar::after {content: ''; display: block; width: 1px; border-right: 1px dashed var(--Subbody_03); position: absolute; right: 0; top: 100%;}
.progressbar-box-wrap .progressbar2 {position: absolute; border-radius: 1.6rem; top: 0; left: 0; height: 100%; background: var(--BG_body);}
.progressbar-box-wrap .progressbar.c1 {background: var(--Subbody_04);}
.progressbar-box-wrap .progressbar.c1::after {height: 32rem;}
.progressbar-box-wrap .progressbar.c2 {background: var(--Subbody_03);}
.progressbar-box-wrap .progressbar.c2::after {height: 20rem;}
.progressbar-box-wrap .progressbar.c3 {background: var(--Subbody_02);}
.progressbar-box-wrap .progressbar.c3::after {height: 8rem;}
.progressbar-box-wrap .progressbar.c4 {background: var(--Violet_500);}
.progressbar-box-wrap .progressbar.c4::after {display: none;}

.investproddetail-section5 {padding: 0 2rem 8rem;}
.investproddetail-section5 .map-area {height: 32rem; width: 50%; background: #eaeaea; margin-bottom: 8rem;}
/* PC 기본 */
.map-slider-row {
    display: flex;
    gap: 2rem;
    flex-direction: row; /* ← 순서 반전 */
}

.map-slider-row .map-area {
    width: 50%;
    height: 32rem;
    background: #eaeaea;
}

.map-slider-row .thumb-wrap {
    width: 50%;
    height: 32rem;
    display: flex;
    flex-direction: column;
}

/* 모바일 - 세로 배치 */
@media (max-width: 768px) {
    .map-slider-row {
        flex-direction: column; /* 세로로 변경 */
        gap: 1.5rem;
        margin-bottom: 4rem; 
    }

    .map-slider-row .map-area {
        width: 100%;     /* 전체폭 */
        height: 40rem;   /* 모바일에서 높이 조금 줄이면 자연스러움 */
    }

    .map-slider-row .thumb-wrap {
        width: 100%;     /* 전체폭 */
        height: 30rem;
    }
}


.investproddetail-section5 .chart-wrap {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); padding: 1.6rem; display: flex; gap: 4.8rem;}
.investproddetail-section5 .chart-wrap > div {padding: 2.4rem; width: 50%;}

.docu-btn-wrap {display: flex; gap: 2rem .8rem; flex-wrap: wrap; padding-bottom: 2.4rem;}
.tit-wrap3 {display: flex; justify-content: space-between; width: 100%; align-items: center; margin-bottom: 3.2rem;}

.num-v {display: inline-block; width: 2.8rem; height: 2.8rem; text-align: center; line-height: 2.8rem; border-radius: 1.6rem; background: var(--Red_400); color: #fff; font-size: 1.8rem; font-weight: 700; vertical-align: middle; margin-right: .8rem;}
.investproddetail-section5 .tab-content {min-height: 80rem;}
.btn-help-wrap {position: relative; display: inline-block;}
.btn-help {transform: translateY(-3px); display: inline-block; width: 1.5rem; height: 1.5rem; border: none; background: url(../images/question.png) no-repeat center / 100% 100%; overflow: hidden;}


/* 스택 바 차트 */
.stackedbar {display: flex; width: 100%; height: 3.2rem; border-radius: 1.6rem; overflow: hidden; margin: 0 auto; background-color: #e0e0e0;}
.stackedbar .segment {height: 100%; border-radius: 1.6rem; flex: 1;}
.stackedbar .segment:nth-child(1) {z-index: 4; margin: 0 -1.6rem 0 0;}
.stackedbar .segment:nth-child(2) {z-index: 3; margin: 0 -1.6rem; order: 1;}
.stackedbar .segment:nth-child(3) {z-index: 2; margin: 0 -1.6rem;}
.stackedbar .segment:nth-child(4) {z-index: 1; margin: 0 0 0 -1.6rem;}
.legend-item:nth-child(1) { order: 1; }
.legend-item:nth-child(2) { order: 1; }
.legend-item:nth-child(3) { order: 2; }
.legend-item:nth-child(4) { order: 2; }
.stackedbar-wrap .legend {margin-top: 1.6rem; display: flex; justify-content: start; gap: .4rem 1.6rem; flex-wrap: wrap; align-content: flex-start;}
.stackedbar-wrap .legend-item {display: flex; align-items: center; gap: .8rem; color: var(--Subbody_01, #848484); font-size: 1.5rem; line-height: 2rem; white-space: nowrap;}
.legend-circle {width: 1.2rem; height: 1.2rem; border-radius: 1.6rem; flex: 0 0 1.2rem;}

.chart-wrap .cyan { background-color: #498065; } /* 선순위 기타금액 */
.chart-wrap .red { background-color: #4F89D4; } /* 선순위 채권최고액 / 대출잔액 */
.chart-wrap .purple { background-color: #DD496E; } /* 론포인트 대출금액 */
.chart-wrap .blue { background-color: #FECB7F; } /* 담보 여유금액 */

/* 도넛 차트 */
.dnchart-wrap {display: flex; flex-direction: column; align-items: center;}
.chart-container {position: relative; width: 32rem; height: 32rem;}
.chart-center-text {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; font-weight: bold; color: #000;}
.chart-center-text p:first-child {color: var(--Subbody_01, #848484); font-size: 1.65rem; font-weight: 500; line-height: 2.4rem; margin-bottom: 6px;}
.chart-center-text p:last-child {color: var(--Black, #263238); font-size: 1.8rem; font-weight: 700; line-height: 2.4rem;}
.dnchart-wrap .legend {margin-top: 7.2rem; width: 100%; display: flex; flex-direction: column; gap: 1.6rem;}
.dnchart-wrap .legend-item {display: flex; align-items: center; justify-content: space-between; gap: .4rem; color: var(--Subbody_01, #848484); font-size: 1.2rem; line-height: 2rem; white-space: nowrap;}
.dnchart-wrap .legend-item > div {display: flex; justify-content: start; align-items: center; gap: .8rem; width: 20%;}
/* .dnchart-wrap .legend-item > p:nth-of-type(1) {width: 0%; text-align: left;}
.dnchart-wrap .legend-item > p:nth-of-type(2) {width: 30%; text-align: left;} */
.dnchart-wrap .legend-circle {width: 1.2rem; height: 1.2rem; border-radius: 1.6rem;}
@media (max-width: 768px) {
    .dnchart-wrap .legend-item {
        display: flex;
        flex-direction: column !important; 
        align-items: flex-start;
        gap: 0.4rem;
        width: 100%;
    }

    .dnchart-wrap .legend-item > div {
        width: 100% !important;      
        flex: none !important;     
        display: flex;
        align-items: center;
        gap: 0.6rem;
        white-space: normal; 
    }

    /* 오른쪽 금액 텍스트 */
    .dnchart-wrap .legend-item p {
        width: 100% !important;   
        flex: none !important;
        white-space: normal;   
        text-align: left;
    }
}


.chart-tooltip {position: absolute; background-color: var(--Black); color: #fff; padding: .8rem 1.6rem; border-radius: .8rem; font-size: 1.4rem; pointer-events: none; transform: translate(-50%, -100%); opacity: 0; transition: opacity 0.2s ease; font-weight: 400; text-align: center; transition: all .3s ease;}
.chart-tooltip::after {content: ''; display: block; width: 0; height: 0; border-style: solid; border-width: .8rem .8rem 0 .8rem; border-color: var(--Black) transparent transparent transparent; position: absolute; left: 50%; top: 100%; transform: translate(-50%);}
.chart-tooltip strong {font-weight: 600; display: block;}

/* 꺾은선 차트 */
.linechart-wrap canvas {height: 540px !important; width: 100% !important;}


/* 투자 완료 */
.invest-success-wrap {background: #fff; width: 100%; padding: 0 2rem;}
.invest-success-wrap .inner {max-width: 48rem; margin: 0 auto; padding: 8.8rem 0 10rem; text-align: center;}
.invest-success-wrap .ic {width: 8.8rem; margin-bottom: 2.4rem;}
.invest-success-wrap .img {width: 6.8rem; margin-bottom: 2.4rem; margin-top: 1.4rem; display: block; margin: 0 auto;}
.invest-success-wrap .tit {text-align: center; font-size: 2.6rem; font-weight: 700; line-height: 4rem; margin-bottom: .8rem; }
.invest-success-wrap .stxt {color: var(--Subbody_01, #848484); margin-bottom: 2.4rem; text-align: center; font-size: 1.5rem; line-height: 2.4rem;}
.box-bo {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); display: flex; padding: 2.4rem; flex-direction: column; align-items: center;}
.invest-success-wrap .tit2 {font-size: 1.6rem; font-weight: 600; line-height: 2.8rem; text-align: left;}
.invest-success-wrap .stxt2 {color: var(--Gray_400); font-size: 1.4rem; font-weight: 500; line-height: 2.2rem; text-align: left;}
.invest-success-wrap .badge-success {color: #45C9A5; font-size: 1.4rem; font-weight: 600; line-height: 2.2rem; display: flex; width: 4.8rem; height: 4.8rem; justify-content: center; align-items: center; border-radius: 2.4rem; background: #E8F8F3;}
.invest-success-wrap .badge-fail {color: var(--Red-400, #FF5252); font-size: 1.4rem; font-weight: 600; line-height: 2.2rem; display: flex; width: 4.8rem; height: 4.8rem; justify-content: center; align-items: center; border-radius: 2.4rem; background: var(--Red-100, #FFF1F1);}
.invest-success-wrap .content-a {gap: .8rem; width: 100%;}
.invest-success-wrap .content-a > div {background: var(--BG_body, #F7F7F7); padding: 1.4rem 2rem; gap: 0;}
.invest-success-wrap .content-a > div h5 {font-size: 1.4rem !important; line-height: 2.5rem !important; color: var(--Subbody_02); font-weight: 500 !important;}
.invest-success-wrap .content-a > div p {font-size: 1.5rem; line-height: 2.4rem; font-weight: 600 !important;}
.invest-success-wrap .btn-wrap {width: 100%; display: flex; gap: 1.6rem; justify-content: center;}
.invest-success-wrap .btn-wrap .btn {flex: 1; max-width: 23.2rem; font-size: 1.5rem;}



/* 투자 적합성 테스트 */
.invest-compat-wrap {}
.tit-wrap4 {border-bottom: .1rem solid var(--Black); display: flex; justify-content: space-between; gap: 1.6rem; padding: 0 0 1.6rem;}
.tit-wrap4 h2 {font-size: 2rem !important; margin: 0 !important;}
.tit-wrap4 p {font-size: 1.6rem; font-weight: 500; color: var(--Subbody_02);}
.invest-test-list {width: 100%; display: flex; gap: 6.4rem; flex-direction: column;}
.invest-test-list li {width: 100%;}
.invest-test-list .question {font-size: 1.5rem; font-weight: 500; line-height: 2.2rem; display: flex; gap: .8rem; align-items: start; width: 100%; margin-bottom: 2.4rem; text-align: left;}
.invest-test-list .question .num {color: #fff; width: 2.3rem; height: 2.3rem; flex: 0 0 2.3rem; border-radius: 1.2rem; text-align: center; line-height: 2.3rem; padding: 0; font-size: 1.3rem; font-weight: 500; display: inline-block; background: var(--Pure_blue_400);  font-style: normal;}
.answer-wrap {display: flex; flex-direction: column; gap: .8rem;}
.answer-wrap .btn-answer {display: block; width: 100%;}
.answer-wrap .btn-answer input[type=radio] {display: none;}
.answer-wrap .btn-answer input[type=radio] ~  div {border-radius: .8rem; background: var(--BG_body, #F7F7F7); display: flex; padding: 1.6rem 6.4rem 1.6rem 1.6rem; display: flex; gap: .4rem 1.6rem; align-items: start; font-size: 1.5rem; line-height: 2rem; font-weight: 500; border: .1rem solid transparent;}
.answer-wrap .btn-answer input[type=radio] ~  div span {display: flex; gap: .4rem 1.6rem; align-items: center; flex-wrap: wrap; padding-top: .2rem;}
.answer-wrap .btn-answer input[type=radio] ~  div img {width: 1.8rem; padding-top: 3px;}
.answer-wrap .btn-answer input[type=radio]:checked ~  div,
.answer-wrap .btn-answer input[type=radio].correct ~  div {border: .1rem solid var(--Blue_400); background: url(../images/ic_check4.svg) no-repeat calc( 100% - 3.2rem ) 50% / 1.8rem 1.8rem var(--Blue_100);}
.answer-wrap .btn-answer input[type=radio]:disabled ~  div {color: var(--Subbody_04, #CCC);}
.answer-wrap .btn-answer input[type=radio]:disabled ~  div img {filter: grayscale(1); opacity: .3;}
.answer-wrap .btn-answer input[type=radio] ~  div small {color: var(--Blue_200); font-size: 1.4rem; font-weight: 500;}
.btn-test-wrap {text-align: center;}
.btn-test-wrap .btn {margin: 0 auto; width: 100%; max-width: 48rem;}


/* 거래소 */
.invest-sale-wrap {width: 100%; padding: 4.8rem 2rem; background: var(--BG_subbody, #F1F3F5);}
.invest-sale-wrap .inner {width: 100%; max-width: 1100px; margin: 0 auto; padding: 0; position: relative;}

.invest-sale-content {display: flex; gap: 3.2rem;}
.side-section .summary {padding: 2.4rem; width: 26.6rem; background-color: var(--Red_200); border-radius: 1.6rem; display: flex; flex-direction: column; gap: 2.4rem; color: #fff; margin-bottom: 1.6rem;}
.side-section .summary h2 {font-size: 1.6rem; line-height: 2.4rem; display: flex; justify-content: space-between; align-items: center;}
.side-section .summary .box {width: 100%; padding: 1.6rem; display: flex; flex-direction: column; gap: .6rem; border-radius: .8rem; background-color: var(--Red_400);}
.side-section .summary .list-c {}
.side-section .summary .list-c li {gap: .4rem .8rem;}
.side-section .summary .list-c h5 {font-size: 1.4rem; line-height: 2.4rem; font-weight: 500;}
.side-section .summary .list-c p {font-size: 1.4rem; line-height: 2.2rem; font-weight: 600; white-space: nowrap;}

.menu {width: 100%; background-color: var(--White); border-radius: 1.6rem; padding: .8rem;}
.menu ul {display: flex; flex-direction: column;}
.menu ul li {}
.menu ul li a {font-size: 1.4rem; line-height: 2.4rem; color: var(--darkGray); width: 100%; padding: 1.2rem 0.8rem 1.2rem 1.6rem; border-radius: 16px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; cursor: pointer;}
.menu ul li a::after {content: ''; background: url(../images/ic_arrow_right4.svg) no-repeat center / contain; display: block; width: 1.6rem; height: 1.6rem;}
.menu ul li a.active {background-color: var(--Red_100) !important; color: var(--Red_400) !important;}
.menu ul li a.active::after {display: none; content: ''; background: url(../images/ic_arrow_right8.svg) no-repeat center / contain; display: block; width: 1.6rem; height: 1.6rem;}

.invest-sale-content .content-section {background: #fff; padding: 2.4rem; border-radius: 1.6rem; flex: 1;}
.invest-sale-content .content-section .tit {font-size: 2rem; font-weight: 700; line-height: 2.4rem; margin-bottom: 2.4rem;}


/* 공시자료 */
.pubinfo-wrap {width: 100%; background: #fff; padding-bottom: 8rem;}
.pubinfo-head {height: 28rem; background: url(../images/red_background.jpeg) no-repeat 50% 35% / cover #000; display: flex; justify-content: center; align-items: center;}
.pubinfo-head h2 {color: var(--White, #FFF); text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 5.8rem;}
.pubinfo-body {padding: 4rem 2rem; background: #fff;}
.pubinfo-body .inner {max-width: 1100px; margin: 0 auto; width: 100%;;}
.pubinfo-body .guide-img {padding: 4rem;}
.pubinfo-body .guide-img img {max-width: fit-content; width: 100%; margin: 0 auto;}


/* 공지사항 */
.notice-wrap {width: 100%; background: #fff; padding-bottom: 8rem;}
.notice-head {height: 28rem; background: url(../images/red_background.jpeg) no-repeat 50% 35% / cover #000; display: flex; justify-content: center; align-items: center;}
.notice-head h2 {color: var(--White, #FFF); text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 5.8rem;}
.notice-body {padding: 8rem 2rem; background: #fff;}
.notice-body .inner {max-width: 1100px; margin: 0 auto; width: 100%;}
.notice-body .inp-search-wrap {margin: 0 auto;}
.notice-body .more-info {}
/* 공지사항 내용을 우측 정렬 시키기 위해서 추가 : 2025.4.7 by stanley */
.notice-body .more-info p {text-align: left !important;}
.notice-body .list-d.v2 > li.more-info {
    position: relative;
    margin-left: 1.6rem;
    margin-right: 1.6rem;
    width: calc(100% - 3.2rem);
    border-bottom: none;
    color: var(--Black);
    line-height: 2.6rem;
    text-shadow: none !important;
    font-weight: 300 !important;
}

.notice-body .list-d.v2 > li.more-info::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: var(--Line_Default, #DEDEDE);
}

.notice-body .list-d.v2 > li.more-info * {
    text-shadow: none !important;
    font-weight: 300 !important;
}

.notice-body .list-d.v2 > li.more-info {
    color: var(--Black);
    line-height: 2.6rem;
}

.notice-body .list-d.v2 > li.more-info p {
    text-align: left !important;
    font-weight: 300 !important;
}

.notice-body .list-d.v2 > li.active {
    position: relative;
    border-bottom: none !important;
}

.notice-body .list-d.v2 > li.active::after {
    content: '';
    position: absolute;
    left: 1.6rem;
    right: 1.6rem;
    bottom: 0;
    height: 1px;
    background: var(--Line_Default, #DEDEDE);
}

.notice-body .list-d.v2 > li.more-info {
    margin-left: 1.6rem;
    margin-right: 1.6rem;
    width: calc(100% - 3.2rem);
}


/* Q&A */
.qna-wrap {width: 100%; background: #fff; padding-bottom: 8rem;}
.qna-head {height: 28rem; background: url(../images/red_background.jpeg) no-repeat 50% 35% / cover #000; display: flex; justify-content: center; align-items: center;}
.qna-head h2 {color: var(--White, #FFF); text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 5.8rem;}
.qna-body {padding: 8rem 2rem; background: #fff;}
.qna-body .inner {max-width: 1100px; margin: 0 auto; width: 100%;}
.qna-body .inp-search-wrap {margin: 0 auto;}
.qna-body .btn-view {width: 2.4rem; height: 2.4rem; background: url(../images/ic_arrow_down5.svg) no-repeat center / 100% 100% transparent; margin-right: -1.6rem;}
.qna-body .btn-view.active {transform: rotate(180deg);}
.qna-body .list-d.v2 > li.active {
    position: relative;
    border-bottom: none !important;
}

.qna-body .list-d.v2 > li.active::after {
    content: '';
    position: absolute;
    left: 1.6rem;
    right: 1.6rem;
    bottom: 0;
    height: 1px;
    background: var(--Line_Default, #DEDEDE);
}

.qna-body .list-d.v2 > li.more-info {
    position: relative;
    margin-left: 1.6rem;
    margin-right: 1.6rem;
    width: calc(100% - 3.2rem);
    color: var(--Black);
    line-height: 2.6rem;
    text-align: left !important;
    text-shadow: none !important;
    font-weight: 300 !important;
    font-size: 1.6rem !important;
}

.qna-body .list-d.v2 > li.more-info,
.qna-body .list-d.v2 > li.more-info * {
    text-shadow: none !important;
    font-weight: 300 !important;
    font-size: 1.5rem !important;
    line-height: 2.6rem !important;
    /* font-family: 'Pretendard' !important; */
}

.qna-body .list-d.v2 > li.more-info p,
.qna-body .list-d.v2 > li.more-info div,
.qna-body .list-d.v2 > li.more-info span {
    text-align: left !important;
}

/* 회사소개 */
.company-wrap {width: 100%;}
.company-section1 {background: url(../images/corp_head_bg.jpg) no-repeat center / cover; height: 81rem; position: relative; padding: 13rem 2rem 4.2rem;}
.company-section1 .inner {max-width: 1100px; margin: 0 auto; text-align: center; color: #fff;}
.company-section1 .txt1 {text-align: center; font-size: 2.3rem; font-weight: 600; line-height: 3.4rem; margin-bottom: 4rem;}
.company-section1 .txt2 {text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 140%; margin-bottom: 4rem;}
.company-section1 .txt3 {text-align: center; font-size: 1.8rem; font-weight: 500; line-height: 2.8rem; margin-bottom: 4rem;}
.company-section1 .btn-down {width: 2.4rem; height: 2.4rem; background: url(../images/ic_arrow_down6.svg) no-repeat center / 100% 100%; overflow: hidden; font-size: 1px; text-indent: -200px; position: absolute; bottom: 4.2rem; left: 50%; transform: translateX(-50%);}
.company-section2 {background: var(--Black, #263238); padding: 8rem 2rem 11.2rem; position: relative;}
.company-section2 #content {position: absolute; top: -7rem;}
.company-section2 .inner {max-width: 1100px; margin: 0 auto; text-align: center; color: #fff;}
.company-section2 .txt1 {text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 5.8rem; margin-bottom: 2.4rem;}
.company-section2 .txt2 {text-align: center; font-size: 2.1rem; font-weight: 500; line-height: 3.2rem; margin-bottom: 8rem;}
.company-section2 .img img {max-width: fit-content; width: 100%; margin: 0 auto;}
.company-section3 {background: #fff; padding: 16rem 2rem;}
.company-section3 .inner {max-width: 1100px; margin: 0 auto; text-align: center; color: var(--Black); text-align: left; display: flex; flex-direction: column; gap: 14.4rem;}
.company-section3 .group {display: flex; gap: 3.2rem; justify-content: space-between;}
.company-section3 .group:nth-of-type(2) {flex-direction: row-reverse; gap: 5.8rem;}
.company-section3 .group > div {flex: 1;}
.company-section3 .txt1 {font-size: 2.3rem; font-weight: 600; line-height: 4rem; margin-bottom: 2.4rem;}
.company-section3 .txt2 {font-size: 3.2rem; font-weight: 700; line-height: 4.2rem; margin-bottom: 2.4rem;}
.company-section3 .txt3 {color: var(--Subbody_01, #848484); font-size: 1.7rem; font-weight: 400; line-height: 2.8rem; margin-bottom: 4.8rem;}
.company-section3 img {flex: 1;}
.btn-txt-go3 {font-size: 2rem; font-weight: 700; line-height: 2.4rem; padding: 0 9.9rem 1.8rem 0; background: url(../images/ic_arrow_right6.svg) no-repeat 50% 100% / 100% auto; display: inline-block;}
.company-section4 {background: url(../images/orange-background2.jpg) no-repeat center / cover; padding: 12rem 2rem 10rem;}
.company-section4 .inner {max-width: 1100px; margin: 0 auto; text-align: center; color: #fff;}
.company-section4 p {text-align: center; font-size: 4.2rem; font-weight: 700; line-height: 5.8rem; margin-bottom: 7rem;}
.company-section4 .history {position: relative;}
.company-section4 .history::before {content: ''; width: .1rem; height: calc( 100% - 6rem ); background: #fff; display: block; position: absolute; left: calc( 50% - .05rem ); top: 1rem;}
.company-section4 .history dl {text-align: left; padding: 0; position: relative; display: block; width: 50%; margin-bottom: 2.4rem; display: flex; flex-direction: column;}
.company-section4 .history dt {font-size: 2rem; font-weight: 700; line-height: 2.4rem; margin-bottom: 1.6rem; display: flex; gap: 2.8rem;}
.company-section4 .history dt::before {content: ''; width: 1.4rem; height: 1.4rem; border-radius: 1.4rem; display: inline-block; background: #fff; margin-top: .5rem; margin-left: -.7rem;}
.company-section4 .history dd {font-size: 1.8rem; line-height: 2.8rem; position: relative; padding: 0 2rem; position: relative; padding-left: 2rem; margin-left: 3.4rem; margin-right: 2rem;}
.company-section4 .history dd::before {content: ''; display: block; width: .3rem; height: .3rem; border-radius: .3rem; background: #fff; position: absolute; top: 1.2rem; left: .5rem;}
.company-section4 .history dl:nth-of-type(odd) {margin-left: 50%;}
.company-section4 .history dl:nth-of-type(even) {align-items: end;}
.company-section4 .history dl:nth-of-type(even) dt {flex-direction: row-reverse; gap: 3.8rem;}
.company-section4 .history dl:nth-of-type(even) dt::before {margin-right: -.7rem;}
.company-section5 {background: #fff; padding: 16rem 2rem;}
.company-section5 .inner {max-width: 1100px; margin: 0 auto; text-align: center; color: var(--Black);}
.company-section5 .txt1 {text-align: center; font-size: 3.2rem; font-weight: 700; line-height: 4rem; margin-bottom: 8rem;}
.company-section5 ul.link {display: flex; gap: 4.6rem; justify-content: center; flex-wrap: wrap;}
.company-section5 li {}
.company-section5 li img {width: 11.4rem; margin-bottom: 2rem;}
.company-section5 li span {display: block; text-align: center; font-weight: 500;}
.company-section6 {padding: 4rem 2rem 4.8rem; background: #fff;}
.company-section6 .inner {max-width: 1100px; margin: 0 auto;}
.company-section6 .txt1 {font-size: 2rem; line-height: 2.4rem; font-weight: 700; margin-bottom: 3.2rem;}
.company-section6 .txt2 {font-size: 1.6rem; line-height: 2rem; font-weight: 600; margin-bottom: 3.2rem;}
.company-section6 ul.way {font-size: 1.6rem; display: flex; flex-wrap: wrap; gap: 2.2rem 3.2rem; align-items: center;}
.company-section6 ul.way li {display: flex; align-items: center; gap: 3.2rem;}
.company-section6 ul.way li::after {content: ''; display: inline-block; width: 7.2rem; height: 2.4rem; background: url(../images/ic_arrow_right7.svg) no-repeat center / 100% auto;}
.company-section6 ul.way li:nth-child(3)::after,
.company-section6 ul.way li:last-child::after {display: none;}
.company-section7 .map-area {height: 48rem; background: #eaeaea;}           

/**/
.datepick-wrap {display: flex; flex-direction: column; gap: 3.2rem;}
.datepick-wrap .tabs6 {margin-bottom: 0;}
.datepick-wrap .radio-wrap {display: flex; gap: 1.6rem; margin-bottom: -1.6rem;flex-wrap: nowrap;align-items: center;}
.datepick-wrap .radio-wrap label {}
.datepick-wrap .radio-wrap .radio span {
    white-space: nowrap;
}
.datepick-wrap .input-wrap {display: flex; gap: 1.6rem; margin-bottom: 3.2rem; position: relative;}
.datepick-wrap .input-wrap > div {display: flex; gap: .8rem; align-items: center; flex: 3.5;min-width: 0;}
.datepick-wrap .input-wrap > div > input {width: calc( 50% - .6rem );}
.datepick-wrap .input-wrap > div > .line-default {width: 1.2rem; text-align: center;}
.datepick-wrap .input-wrap > .btn-search {flex: 1;}
.datepick-wrap .input-wrap .btn {position: relative;}
.datepick-wrap .input-wrap .toast {bottom: auto; top: 100%;}
/* 1. 전체 컨테이너 높이 통일 */
.datepick-wrap .input-wrap form {
    display: flex;
    align-items: center;
    gap: 0.5rem; /* 간격을 더 좁게 조절 */
    width: 100%;
    box-sizing: border-box; /* 패딩이 너비에 영향을 주지 않도록 */
    overflow: hidden; 
}

/* 두 번째 datepicker와 검색 버튼 사이 간격 */
.datepick-wrap .input-wrap form .datepicker:last-of-type {
    margin-right: 0.8rem; /* 검색버튼과 간격 */
}

.datepick-wrap .input-wrap form .btn {
    flex: 0 0 auto !important;
    height: 4.4rem;
    padding: 0 2.5rem;
    width: auto !important;
    min-width: 0;           /* min-width 제거 */
    white-space: nowrap;
    box-sizing: border-box;
}

/* 2. 날짜 인풋 스타일 조정 */
.datepick-wrap .input-wrap form .datepicker {
    flex: 1 1 0; /* 중요: 공간이 부족하면 0까지도 줄어들 수 있게 허용 */
    min-width: 0; /* flex 환경에서 줄어듦을 보장 */
    height: 4.4rem;
    padding: 0 0.5rem 0 1.4rem; /* 내부 패딩을 줄여 텍스트 공간 확보 */
    font-size: 1.5rem; /* 화면이 작아질 때 글자 크기 조정 */
}

/* 3. 하이픈(-) 수직 중앙 정렬 */
.datepick-wrap .input-wrap form .line-default {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.2rem;
}



/* 모바일 화면에서 좀 더 촘촘하게 */
@media (max-width: 900px) {  /* 800px → 900px으로 늘림 */
    .datepick-wrap .input-wrap form .datepicker,
    .datepick-wrap .input-wrap form .btn {
        height: 4rem;
        font-size: 1.3rem;
    }
    
    /* 버튼 패딩도 함께 줄임 */
    .datepick-wrap .input-wrap form .btn {
        padding: 0 2rem;  /* 3.5rem → 2rem으로 줄임 */
    }
}

@media (max-width: 768px) {
    .datepick-wrap .input-wrap form .datepicker,
    .datepick-wrap .input-wrap form .btn {
        height: 4rem;
        font-size: 1.3rem;
        padding: 0 1.5rem;
    }

    .datepick-wrap .radio-wrap {
        gap: 1.2rem;          /* 모바일에서 더 좁게 */
    }
}



@media (max-width: 380px) {
    .datepick-wrap .input-wrap form .datepicker {
        font-size: 1.1rem;
        letter-spacing: -0.5px; /* 자간을 줄여 가독성 확보 */
    }
    .datepick-wrap .input-wrap form {
        gap: 0.3rem;
    }
}


/* MonthPicker 보정 */
.ui-widget {font-family: unset;}
.month-picker {z-index: 1; box-shadow: 0 .1rem .2rem rgba(0,0,0,.1);}
.month-picker-header {margin: 0; background: #fff; border: 0;}
.month-picker table {border-spacing: 0; width: 28.8rem;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {border: 1px solid var(--Line_Default); border-radius: 0; background: #fff;}
.month-picker .ui-button-text {color: var(--Subbody_02); font-size: 1.6rem; font-weight: 400;}
.month-picker-month-table .ui-button {width: 9.2rem; margin: .6rem .2rem; padding: .8rem;}
.ui-widget.ui-widget-content {border: 1px solid var(--Line_Default); border-radius: 1.6rem; padding: 1rem;}
.month-picker-year-table .month-picker-title {width: 30%; padding: .5rem 1rem 1rem;}
.month-picker-year-table .month-picker-title .ui-button.ui-state-hover, 
.month-picker-year-table .month-picker-title .ui-button.ui-state-active {color: unset !important; border: unset !important;}
.month-picker-year-table .month-picker-title .ui-button-text {color: var(--Black) !important; font-size: 1.8rem !important; line-height: 2.2rem !important; font-weight: 600 !important; height: 2.2rem !important; border-bottom: .15rem solid var(--Black); white-space: nowrap;} 
.month-picker-year-table .ui-button {height: auto; padding-bottom: .8rem !important; border: none !important; font-size: 1.6rem !important; width: auto !important; vertical-align: top; padding-top: 0 !important;}
.month-picker-year-table .ui-button.ui-state-hover {background: unset; color: unset;}
.month-picker-month-table .ui-button.ui-state-active,
.month-picker-month-table .ui-button.ui-state-hover {color: var(--Black) !important; border: 1px solid var(--Black) !important; background: #fff !important;}
.month-picker-month-table .ui-button.ui-state-hover .ui-button-text,
.month-picker-month-table .ui-button.ui-state-active .ui-button-text {color: var(--Black) !important;}
.month-picker-year-table .month-picker-next a {float: none !important; width: 2.4rem !important; height: 2.4rem; border: 1px solid var(--Line_Default) !important; border-radius: 1.2rem; padding: 0; background: url(../images/ic_tab_arrow_next.svg) no-repeat center / 100% auto !important;}
.month-picker-year-table .month-picker-previous {text-align: right;}
.month-picker-year-table .month-picker-previous a {float: none !important; width: 2.4rem !important; height: 2.4rem; border: 1px solid var(--Line_Default) !important; border-radius: 1.2rem; padding: 0; background: url(../images/ic_tab_arrow_prev.svg) no-repeat center / 100% auto !important;}
.month-picker-year-table .month-picker-next a:hover, .month-picker-year-table .month-picker-previous a:hover {border-color: var(--Black) !important;}


/**/
.sch-detail {display: none;}
.sch-detail td {padding: 0;}
.pop-sch-detail {border-radius: 1.6rem; border: .1rem solid var(--Gray); overflow: hidden; position: relative;}
.pop-sch-detail .btn-close {position: absolute; top: 2.8rem; right: 2.4rem; display: block; width: 2.4rem; height: 2.4rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; filter: invert(1)}
.pop-sch-detail .detail-head {background: var(--Red_300); color: #fff; padding: 3.4rem; width: 100%;}
.pop-sch-detail .detail-head .badge {display: flex; gap: .8rem; min-height: 2.8rem; margin-bottom: 1.6rem;}
.pop-sch-detail .detail-head .badge span {height: 2.8rem;}
.pop-sch-detail .detail-head h3 {display: block; text-align: left; color: #fff; font-size: 2.4rem; font-weight: 700; line-height: 3.4rem; margin-bottom: .8rem;}
.pop-sch-detail .detail-head ul {display: flex; gap: 1.1rem;}
.pop-sch-detail .detail-head ul li {font-size: 1.6rem; line-height: 2.2rem; font-weight: 600;}
.pop-sch-detail .detail-head ul li::after {content: '|'; margin-left: 1.1rem; font-weight: 300;}
.pop-sch-detail .detail-head ul li:last-child::after {display: none;}
.pop-sch-detail .detail-head .btn {border: .1rem solid #fff; margin: 0; border-radius: .4rem; padding: .8rem 1.6rem; font-size: 1.4rem; font-weight: 600;}
.pop-sch-detail .detail-head .btn img {width: 2rem;}
.pop-sch-detail .detail-body {}
.pop-sch-detail .detail-body .tbl-basic {margin: 0;}
.pop-sch-detail .detail-body .tbl-basic thead {}
.pop-sch-detail .detail-body .tbl-basic thead th {background: var(--Gray); padding: 1.8rem .8rem;}
.pop-sch-detail .detail-body .tbl-basic tbody td {background: var(--White); padding: 1.8rem .8rem;}
.pop-sch-detail .detail-body .tbl-basic tfoot td {background: var(--White); padding: 1.8rem .8rem; font-weight: 600; color: black;}

.pop-mo-sch-detail {position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: var(--Black_bg); z-index: 10; display: flex; align-items: center; justify-content: center; padding: 2rem; display: none;}
.pop-mo-sch-detail.show {display: flex;}
.pop-mo-sch-detail .pop-container {border-radius: 1.6rem; border: .1rem solid var(--Gray); overflow: hidden; margin: 0; width: 100%; padding: 0; display: flex; flex-direction: column; max-height: calc( 100% - 4.8rem ); position: relative;}
.pop-mo-sch-detail .btn-close {position: absolute; top: 2.4rem; right: 2.4rem; display: block; width: 2.4rem; height: 2.4rem; background: url(../images/ic_close.svg) no-repeat center / 100% 100%; font-size: 1px; overflow: hidden; text-indent: -10rem; filter: invert(1)}
.pop-mo-sch-detail .detail-head {background: var(--Red_300); color: #fff; padding: 2.4rem; width: 100%;}
.pop-mo-sch-detail .detail-head .badge {display: flex; gap: .8rem; min-height: 2.8rem; margin-bottom: 1.6rem;}
.pop-mo-sch-detail .detail-head .badge span {height: 2.8rem;}
.pop-mo-sch-detail .detail-head h3 {display: block; text-align: left; color: #fff; font-size: 2rem; font-weight: 700; line-height: 2.4rem; margin-bottom: .8rem;}
.pop-mo-sch-detail .detail-head ul {display: flex; gap: .4rem; flex-wrap: wrap;}
.pop-mo-sch-detail .detail-head ul li {font-size: 1.5rem; line-height: 2rem; font-weight: 400;}
.pop-mo-sch-detail .detail-head ul li::after {content: '|'; margin-left: .4rem; font-weight: 300;}
.pop-mo-sch-detail .detail-head ul li:last-child::after {display: none;}
.pop-mo-sch-detail .detail-head .btn {border: .1rem solid #fff; margin: 0; border-radius: .4rem; padding: .8rem 1.6rem; font-size: 1.2rem; font-weight: 600; width: fit-content;}
.pop-mo-sch-detail .detail-head .btn img {width: 2rem;}
.pop-mo-sch-detail .detail-body {background: #fff; padding: 0; height: calc( 100% - 20rem ); overflow: auto; width: 100%;}
.pop-mo-sch-detail .detail-body .list-d > li {padding: 0;}
.pop-mo-sch-detail .btn-more {width: 100%; justify-content: space-between; padding: 1.5rem 2rem; font-size: 1.5rem; font-weight: 500; line-height: 160%; border-radius: 0;}
.pop-mo-sch-detail .btn-more.active {border-bottom: 1px solid var(--Line_Default);}
.pop-mo-sch-detail .detail-body .list-d > li .list-c {padding: 2rem; display: none;}
.pop-mo-sch-detail .detail-body .list-d > li .list-c h5 {font-weight: 400;}
.pop-mo-sch-detail .detail-body .list-d > li .btn-more.active ~ .list-c {display: flex;}
.pop-mo-sch-detail .detail-body .list-d > li .btn-more.bg-gray,
.pop-mo-sch-detail .detail-body .list-d > li .list-c.bg-gray {background: var(--BG_body);}

/* 모든 칸의 배경색을 흰색으로 강제 고정 */
.pop-sch-detail .detail-body .tbl-basic tbody td {
    background-color: #fff !important;
}

/* 행(tr)에 걸린 배경색도 무력화 */
.pop-sch-detail .detail-body .tbl-basic tbody tr {
    background-color: transparent !important;
}

.inp-ym-wrap {display: inline-block; height: 2.4rem; margin-top: -.4rem;}
.inp-ym-wrap .btn-calendar {vertical-align: middle;}
.inp-ym {font-size: 2rem !important; line-height: 2.4rem !important; font-weight: 700 !important; border: none !important; padding: 0 !important; width: 14rem; background: url(../images/ic_calendar.svg) no-repeat 100% 50% / 2.4rem 2.4rem #fff !important; cursor: pointer;}
.inp-ym:read-only {background-color: #fff !important; color: var(--Black) !important;}
.inp-ym:focus {outline: none !important; box-shadow: none !important;}

.inp-y-wrap {display: inline-block; height: 2.4rem; margin-top: -.4rem;}
.inp-y-wrap .btn-calendar {vertical-align: middle;}
.inp-y {font-size: 2rem !important; line-height: 2.4rem !important; font-weight: 700 !important; border: none !important; padding: 0 !important; width: 9.4rem; background: url(../images/ic_calendar.svg) no-repeat 100% 50% / 2.4rem 2.4rem #fff !important; cursor: pointer;}
.inp-y:read-only {background-color: #fff !important; color: var(--Black) !important;}
.inp-y:focus {outline: none !important; box-shadow: none !important;}
.yearpicker-container {left: 50% !important; transform: translateX(-50%) !important;}

/* filter */
.filter-wrap {display: flex; position: relative; gap: .8rem; flex-wrap: wrap;}
.filter-checkbox {display: inline-flex; padding: 0; align-items: center;}
.filter-checkbox input {position: absolute; opacity: 0; pointer-events: none;}
.filter-checkbox span {display: block; padding: 1.3rem; text-align: center; border-radius: .8rem; border: 1px solid var(--Violet_500, #6D35DE); background: var(--Violet_100, #F8F5FF); color: var(--Violet_500, #6D35DE); font-weight: 500; font-size: 1.6rem; line-height: 2rem; white-space: nowrap; min-width: 11.4rem;}
.filter-checkbox input:checked + span {background: var(--Violet_600, #6D35DE); border-bottom: .1rem solid var(--Violet_600, #6D35DE); color: #fff; font-weight: 700;}

/* 마이페이지 */
.header-manual {width: 109.4rem; margin: 0 auto;}
.header-manual > span {display: inline-block; width: 100%; font-size: 1.8rem; font-weight: 400; line-height: 2.2rem; text-align: right; margin-bottom: 2.4rem;}
.header-manual > div {width: 100%; height: 7.2rem; display: flex; flex-direction: row; padding: 2.4rem 3.2rem; justify-content: space-between; background-color: var(--Violet_600);}
.header-manual > div h1 {font-size: 2rem; font-weight: 700; line-height: 2.4rem; color: var(--White);}
.header-manual > div span {font-size: 1.8rem; font-weight: 400; line-height: 2.2rem; color: var(--White);}

.footer-manual {width: 109.2rem; display: flex; flex-direction: row; justify-content: space-between; margin: 0 auto;}
.footer-manual span {font-size: 1.6rem; line-height: 2.8rem; font-weight: 400;}
.footer-manual p {font-size: 1.6rem; line-height: 2rem; font-weight: 600;}

/* 투자/대출 설명서 */
.prospectus-wrap {background: #fff; padding: 4.8rem; width: 119rem; height: 168.4rem;}
.manual-wrap {width: 100%;}
.manual-wrap h2 {font-size: 3.2rem; font-weight: 700; line-height: 4rem; display: flex; flex-direction: column; gap: 1.6rem;}
.manual-wrap h4 {font-size: 2.4rem; font-weight: 700; line-height: 3.4rem;}
.manual-wrap h2 span:nth-child(2) {font-size: 2rem; line-height: 3rem; color: var(--Subbody_01);}
.manual-wrap .loan_instructions_section {display: flex; flex-direction: row; justify-content: space-between;}
.manual-wrap .loan_instructions_section img {width: 17rem; height: auto;}
.manual-wrap .loan_instructions_section2 {display: flex; flex-direction: column; gap: 3rem; align-items: center; position: relative;}
.manual-wrap .loan_instructions_section2 h3 {font-size: 3.2rem; font-weight: 600; line-height: 4rem;}
.manual-wrap .loan_instructions_section2 span {font-size: 2.4rem; line-height: 3.6rem;}
.manual-wrap .loan_instructions_section2 p {font-size: 1.8rem; line-height: 2.2rem; color: var(--Subbody_02);}
.manual-wrap .loan_instructions_section2 .stamp1 {width: 15.8rem; height: auto; position: absolute; right: 0; top: -4rem;}
.manual-wrap .loan_instructions_section2 .stamp2 {width: 15.8rem; height: auto; position: absolute; right: 0; top: -2rem;}
.manual-wrap .invest-prospectus-notibox {display: flex; flex-direction: column; margin-top: 27.4rem; background-color: var(--BG_subbody); width: 100%; padding: 1.6rem 3.2rem;}
.manual-wrap .invest-prospectus-notibox span {font-size: 1.6rem; font-weight: 400; line-height: 2.4rem;}
.manual-wrap ul {list-style: "* "; margin-bottom: 3.4rem; padding-left: 1.6rem;}
.manual-wrap ul li {font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: var(--Subbody_01);}

.manual-wrap .product-explanation {font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; color: var(--Subbody_01);}
.manual-wrap .product-features-box {width: 100%; border: .2rem solid var(--Line_Default); padding: 3.2rem 9.6rem;}
.manual-wrap .product-features-box img {width: 100%; height: auto;}

.invest-prospectus-wrap table img {width: 100%; height: auto;}




/* 마이페이지 */
.mypage-wrap {width: 100%; overflow: hidden; padding: 4.8rem 2rem;}
.mypage-wrap .inner {max-width: 1100px; display: flex; flex-direction: row; gap: 30px; justify-content: center; margin: 0 auto;}
.mypage-wrap .side-section {flex: 0 0 25.5rem; display: flex; flex-direction: column; gap: 1.6rem;}
.mypage-wrap .content-section {flex: 1; width: calc( 100% - 28.5rem );min-width: 0;}

.info-section {padding: 1.8rem; width: 100%; background-color: var(--Red_200); border-radius: 16px; display: flex; flex-direction: column; gap: 34px;}
.info-section ul {width: 100%; padding: 1.6rem; display: flex; flex-direction: column; gap: 6px; border-radius: 8px; background-color: var(--Red_300);}
.info-section ul li {
    display: flex !important;
    flex-wrap: wrap !important; /* 공간이 있으면 옆에, 없으면 아래로! */
    justify-content: space-between;
    width: 100% !important;
    gap: 4px; /* 위아래 간격 */
}
.info-section ul li h5 {
    width: 100%; /* 제목이 한 줄을 다 차지하게 해서 내용을 아래로 밀어냄 */
    text-align: left;
    font-size: 1.4rem;
    font-weight: 400;
}
.info-section ul li p {
    width: 100%; /* 내용도 한 줄을 다 쓰게 함 */
    text-align: right; /* 글자는 오른쪽으로 정렬 */
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--White);
}

.info-section ul li span{font-size: 14px; line-height: 24px; color: var(--White);}
.info-section ul li span:last-child{font-weight: 600; text-align: right;}

.user-info {display: flex; flex-direction: column; gap: 8px;}
.user-info h2 {display: flex; width: 100%; margin-bottom: 8px; flex-direction: row; justify-content: space-between; align-items: center;}
.user-info h2 span {font-size: 20px; font-weight: 700; line-height: 24px; color: var(--White);}
.user-info div {display: flex; flex-direction: column; justify-content: space-between;}
.user-info div span {font-size: 15px; line-height: 24px; color: var(--White);}

.user-investor {display: flex; flex-direction: column; gap: 12px;}
.user-investor h3 {font-size: 16px; font-weight: 600; line-height: 20px; color: var(--White); display: flex; align-items: center; gap: 4px;}

.user-investor ul li:first-child {flex-direction: row;}
.user-investor ul li:first-child span:last-child {border-bottom: 1px solid var(--White);}

.user-deposit {display: flex; flex-direction: column; gap: 8px;}
.user-deposit h3 {display: flex; width: 100%; flex-direction: row; justify-content: space-between; align-items: center;}
.user-deposit h3 span {font-size: 16px; font-weight: 600; line-height: 20px; color: var(--White);}

.btn-setting {background: url(../images/ic_setting.svg) no-repeat center / contain; width: 2.4rem; height: 2.4rem; border: none; overflow: hidden; text-indent: -200px;}
.btn-white {height: 4.2rem; color: var(--Red_400); font-size: 1.5rem; font-weight: 500; line-height: 2rem; background: #fff; border-radius: .8rem; padding: .4rem .8rem; width: 100%;}
.btn-update {background: url(../images/ic_rotate_left_white.svg) no-repeat center / contain; width: 2.4rem; height: 2.4rem; border: none; text-indent: -200px; overflow: hidden;}
.user-investor h3 .btn-help {background-image: url(../images/ic_help_w.svg); width: 1.6rem; height: 1.6rem;}

.info-section .box {width: 100%; padding: 1.6rem; display: flex; flex-direction: column; gap: .6rem; border-radius: .8rem; background-color: var(--Red_300);}
.info-section .list-c {color: #fff; padding: 0;}
.info-section .list-c li {gap: .4rem .8rem;}
.info-section .list-c h5 {font-size: 1.4rem; line-height: 2.4rem; font-weight: 400;}
.info-section .list-c p {font-size: 1.4rem; line-height: 2.2rem; font-weight: 600; white-space: nowrap;}

.status-section {display: flex; flex-direction: row; gap: 2.4rem; width: 100%; flex-wrap: wrap; align-content: flex-start;}
.status-section > div:nth-child(1) {flex-grow: 1;}
.status-section > div:nth-child(2) {flex-grow: 3;}

.investor-info {min-width: 28rem; height: 314px; background-color: var(--White); border-radius: 16px; padding: 2.4rem;}
.investor-info h2 {font-size: 2rem;}
.investor-info h4 {display: flex; flex-direction: row; justify-content: space-between; align-items: center; font-size: 1.4rem;}
.investor-info h4 span {display: flex; align-items: center;}
.investor-info h4 span:last-child::after {content: ""; width: 1.6rem; height: 1.6rem; background: url(../images/ic_warning1.svg) no-repeat center / contain; display: block; margin-left: 0.6rem;}

.mypage-wrap .badge {width: 1.2rem; height: 1.2rem; border-radius: .8rem; display: inline-block; margin-right: .8rem;}
.mypage-wrap .c1 {background-color: var(--Red_200);}
.mypage-wrap .c2 {background-color: var(--Red_400);}
.mypage-wrap .c3 {background-color: var(--Red_500);}
.mypage-wrap .normal {background-color: var(--Green_400);}
.mypage-wrap .delay {background-color: var(--Red_200);}

.investor-bar {display: flex; flex-direction: row; align-items: center; width: 100%; border-radius: 99px; overflow: hidden;}
.investor-bar div {width: 100%; height: 6px;}

.investor-info .list-dot li {font-size: 1.3rem; line-height: 2.4rem;}

.payment-info {height: 314px; background-color: var(--White); border-radius: 16px; padding: 2.4rem;}
.payment-info h2 {display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.payment-info h2 span {font-size: 2rem;}

.payment-info .graybox {padding: 1.6rem 2.8rem; margin: 0; gap: .8rem;}
.payment-info .graybox h5 {font-size: 1.4rem; font-weight: 400; line-height: 2.4rem; display: flex; flex-direction: row; justify-content: space-between; align-items: center;}
.payment-info .graybox h5 span:nth-child(2){font-weight: 600; color: var(--Violet_400);}
.payment-info .graybox .list-c {gap: 2px;}
.payment-info .graybox .list-c li {position: relative;}
.payment-info .graybox .list-c li::before { width: .4rem; height: .4rem; border-radius: .2rem; display: inline-block; background-color: black; position: absolute; top: 1rem; left: -1.2rem;}
.payment-info .graybox .list-c li span {font-size: 1.4rem; font-weight: 400; line-height: 2.4rem;}
.payment-info .graybox .list-c li span:nth-child(2) {font-weight: 600; display: inline-block; margin-left: auto;}

.investment-status-info {width: 100%; background-color: var(--White); border-radius: 1.6rem; padding: 2.4rem;}
.investment-status-info h2 {font-size: 2rem; font-weight: 700; line-height: 2.4rem; position: relative;}
.investment-status-info > ul {flex-wrap: wrap;}
.investment-status-info > ul > li {white-space: nowrap; flex-wrap: nowrap;}

.cumulative-investment-info {width: 100%; padding: 2.4rem; border-radius: 1.6rem; background-color: var(--White);}
.cumulative-investment-info h2 {font-size: 2rem; font-weight: 700; line-height: 2.4rem;}
.cumulative-investment-info > ul {display: flex; flex-direction: row; gap: .8rem 1.6rem; margin-top: 2.4rem; flex-wrap: wrap;}
.cumulative-investment-info > ul li {display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; flex-wrap: nowrap; white-space: nowrap;}
.cumulative-investment-info > ul li span {font-size: 1.6rem; line-height: 2.4rem; color: var(--Subbody_01);}
.cumulative-investment-info > ul li span:nth-child(2) {font-size: 2rem; font-weight: 700; color: var(--Violet_400);}

.investment-box {width: 100%; background-color: var(--White); border-radius: 1.6rem; padding: 2.4rem;min-width: 0;}
.investment-box h2 {font-size: 2rem; font-weight: 700; line-height: 2.4rem; position: relative;}

.cii-list-wrap {display: flex; flex-direction: row; gap: 1.6rem; align-items: start; margin-top: 16px;}
.cii-list-wrap .graybox {width: 100%; padding: 1.6rem; gap: 0rem;}

.cii-list-wrap .graybox h4 {display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding: 0 0 0 1.6rem; font-size: 1.4rem;}
.cii-list-wrap .graybox h4 span {display: flex; align-items: center; position: relative;}
.cii-list-wrap .graybox h4 span:nth-child(1) {font-weight: 400;}
.cii-list-wrap .graybox h4 span:nth-child(1)::before {width: .4rem; height: .4rem; border-radius: 50%; display: inline-block; background-color: black; position: absolute; top: 1rem; left: -1.2rem;}
.cii-list-wrap .graybox h4 span:nth-child(2) {font-weight: 600;}
.cii-list-wrap .graybox h4 span button {margin-left: 1.6rem;}

.cii-list {display: flex; flex-direction: column; gap: .4rem; padding: 0 3.2rem; font-size: 1.4rem;}
.cii-list li {display: flex; flex-direction: row; justify-content: space-between; align-items: center; position: relative;}
.cii-list li::before {width: .4rem; height: .4rem; border-radius: 50%; display: inline-block; background-color: black; position: absolute; top: 1rem; left: -1.2rem; transform: rotate(180deg);}




/**/
.content-c {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); background: #fff; padding: 4rem 8rem; text-align: center;}
.content-c h4 {font-size: 2.0rem; font-weight: 700; line-height: 3.4rem;}
.content-c p {color: var(--Subbody_02); font-size: 1.4rem; font-weight: 500; line-height: 2.4rem; margin-bottom: 4.8rem;}
.content-c ul {display: flex; gap: 2.4rem;}
.content-c li {flex: 1; text-align: center;}
.content-c h5 {color: var(--Subbody_02); font-size: 1.6rem; font-weight: 400; line-height: 2.2rem; margin-bottom: .6rem;}
.content-c span {color: var(--Black); font-size: 2.0rem; font-weight: 700; line-height: 4rem;}

.content-d {border-radius: .8rem; background: #fff; box-shadow: 0 .4rem 2rem 0 rgba(0, 0, 0, 0.15); padding: 2rem 1.6rem; bottom: 0; left: 50%; width: calc( 100% - 4rem ); max-width: 1040px; transform: translateX(-50%); position: fixed; z-index: 2;}
.content-d ul {display: flex; width: 100%; justify-content: space-between; align-items: center;}
.content-d li {display: flex; flex-direction: column; gap: .8rem; align-items: center; border-right: .1rem solid var(--Line_Default, #DEDEDE); flex: 1; padding: 0 1.2rem; text-align: center;}
.content-d li:last-child {border-right: none;}
.content-d li:nth-last-child(2) {border-right: none;}
.content-d h5 {color: var(--Subbody_02, #848484); font-size: 1.5rem; font-weight: 500; line-height: 2.4rem;}
.content-d p {font-size: 1.9rem; font-weight: 600; line-height: 2.2rem; padding-top: 2px;}
.content-d p span {font-size: 1.6rem;}
.content-d .btn {width: 100%;}

.content-e {border-radius: .8rem; background: var(--Red_200); box-shadow: 0 .4rem 2rem 0 rgba(0, 0, 0, 0.15); display: flex; width: 100%; padding: 2.6rem; flex-direction: column; color: var(--White, #FFF);}
.content-e h3 {font-size: 1.5rem; font-weight: 600; line-height: 2.2rem; margin-bottom: .1rem;}
.content-e > div {display: flex; justify-content: space-between; gap: 1.6rem; align-items: center;}
.content-e ul {display: flex;}
.content-e li {font-size: 1.5rem; line-height: 2rem; font-weight: 500;;}
.content-e li::after {content: '•'; display: inline-block; margin: 0 .8rem;}
.content-e li:last-child::after {display: none;}

.content-f {display: flex; gap: 1.6rem; text-align: center; justify-content: space-between;}
.content-f li {flex: 1; display: flex; flex-direction: column; gap: .2rem; cursor: pointer;}
.content-f li h5 {font-size: 1.5rem; font-weight: 500;}
.content-f li p {font-size: 1.6rem; font-weight: 700; line-height: 2rem;}
.content-f li.active {color: var(--Red_500); font-weight: 500;}

.content-g {display: flex; justify-content: space-between; gap: 2.4rem;}
.content-g .graybox {flex: 1; padding: 2.6rem; gap: 1.6rem;}
.content-g .graybox h3 {font-size: 1.8rem; font-weight: 500;}
.content-g .graybox .list-d {background: #fff; border-radius: 1.6rem; padding: 1.6rem 2.4rem;}
.content-g .graybox .list-d li {}
.content-g .graybox .list-d li:first-child {padding-top: 0;}
.content-g .graybox .list-d li:last-child {border-bottom: none; padding-bottom: 0;}
.content-g .graybox .list-d li h5 {font-size: 1.5rem; font-weight: 400;}
.content-g .graybox .list-d li p {font-size: 1.5rem; font-weight: 600;}
.message {font-size: 1.4rem; margin-bottom: 1.6rem; font-weight: 400;}
.message p {display: flex; gap: .4rem; align-items: center;}
.message img {width: 2rem;}


/* responsive */
@media screen and (max-width: 1320px) {
    .btn-callcenter { bottom: 2rem; top: auto; }
}

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

@media screen and (max-width: 1024px) {
    .mo-hide-1024 {display: none !important;}
    .mo-block-1024 {display: block !important;}

    .tbl-wrap.m-scroll-1024 {overflow: auto; padding-bottom: 1.2rem;}
    .tbl-wrap.m-scroll-1024 table {width: auto; table-layout: auto; min-width: 100%;}
    .tbl-wrap.m-scroll-1024 th, .tbl-wrap.m-scroll-1024 td {white-space: nowrap; font-size: 1.5rem !important;}
    .tbl-wrap.m-scroll-1024::-webkit-scrollbar {width: .4rem; height: .4rem;}
    .tbl-wrap.m-scroll-1024::-webkit-scrollbar-thumb {background: var(--Black); border-radius: 0;}
    .tbl-wrap.m-scroll-1024::-webkit-scrollbar-track {background: var(--BG_body); border-radius: 0;}

    .btn-more {font-size: 1.5rem;}

    .btn-more2 {display: flex; width: 100%; max-width: none; height: auto; padding: .9rem 1.4rem; font-size: 1.4rem; line-height: 2.2rem;}
    .btn-more2::after {width: 1.4rem; height: 1.4rem;}

    .btn-more3 {padding: 1.4rem; font-size: 1.5rem; line-height: 2rem;}
    .btn-more3::after {width: 1.8rem; height: 1.8rem;}
    
    .term-wrap .tabs ul {flex-wrap: wrap; gap: .8rem 0;}
    .term-wrap .tabs li {flex: 0 0 33.3%;}

    

    .loaninfo-section1 .inner {padding: 3.2rem 0 0;}
    .loaninfo-wrap .btn-inquery {font-size: 1.8rem; padding: 2.2rem 2rem; line-height: 1.2rem; height: auto; box-shadow: 0 .3rem .3rem 0 rgba(0, 0, 0, 0.25); margin-bottom: 3rem;}
    .loaninfo-section1 h2 {margin-bottom: 1.4rem;}
    .loaninfo-section1 h2 span {font-size: 4rem;}
    .loaninfo-section1 h2 strong {font-size: 5.6rem;}

    .loaninfo-section3, .loaninfo-section4, .loaninfo-section5 {padding: 8rem 2rem;}
    .loaninfo-section3 h3, .loaninfo-section4 h3, .loaninfo-section5 h3 {font-size: 3.2rem; line-height: 4rem; margin-bottom: 2rem; word-break: keep-all;}
    /* .loaninfo-section3 h3 br, .loaninfo-section4 h3 br, .loaninfo-section5 h3 br {display: none;} */
    .loaninfo-section3 .txt1, .loaninfo-section4 p, .loaninfo-section5 p {font-size: 2rem; line-height: 2.8rem; word-break: keep-all;}
    /* .loaninfo-section3 .txt1 br, .loaninfo-section4 p br, .loaninfo-section5 p br {display: none;} */

    .loaninfo-section6 {padding: 8rem 2rem;}
    .tbl-head h3 {font-size: 1.8rem;}

    .btn-callcenter { bottom: 2rem; top: auto; }

    .recruit-item2 {width: calc( (100% - 7.6rem) / 3 );}
    .recruit-item2:hover {transform: none;}

    .content-b > div {flex: 1 1 calc( 50% - .8rem ); gap: .4rem;}
    .investproddetail-section5 .chart-wrap {gap: 1.6rem;}
    .content-c span {font-size: 2.4rem;}
    .investproddetail-section1 .group1-1 h2 {font-size: 3.2rem; line-height: 4rem;}

    .linechart-wrap canvas {height: 400px !important;}

    .company-section3 {padding: 4.8rem 2rem 5.6rem;}
    .company-section3 .inner {gap: 4.8rem;}
    .company-section3 .group {flex-direction: column;}
    .company-section3 .group:nth-of-type(2) {flex-direction: column; gap: 3.2rem;}
    .company-section3 .group > div {flex: 1;}
    .company-section3 .txt1 {font-size: 2rem; line-height: 2.4rem;}
    .company-section3 .txt2 {font-size: 2.8rem; line-height: 3.6rem; margin-bottom: 2.4rem;}
    .company-section3 .txt3 {color: var(--Subbody_01, #848484); font-size: 1.8rem; font-weight: 400; line-height: 2.8rem; margin-bottom: 2.4rem;}
    .btn-txt-go3 {font-size: 1.5rem; line-height: 1.8rem; padding: 0 7.5rem 1.3rem 0;}
    .company-section1 .txt2 {font-size: 4rem;}
    .company-section2 .txt1 {font-size: 3.6rem;}

    .content-g {flex-direction: column;}
    .content-g .graybox {margin-bottom: 0;}
    .content-g .graybox .list-d li h5 {font-size: 1.5rem;}
    .content-g .graybox .list-d li p {font-size: 1.5rem;}

    .cii-list-wrap {flex-direction: column;}
    .cii-list-wrap .graybox h4 span {padding-right: 3.2rem;}
    .cii-list-wrap .graybox h4 span button {top: .2rem;}

    .mo-w100p {width: 100% !important;}

}

@media screen and (max-width: 900px) {
    .recruit-list {gap: 3.8rem;}
    .recruit-item {width: calc( (100% - 3.8rem) / 2 ); flex: 0 0 calc( (100% - 3.8rem) / 2);}
    .recruit-item2 {width: calc( (100% - 3.8rem) / 2 ); flex: 0 0 calc( (100% - 3.8rem) / 2);}
    .mo-block-900 {display: block !important;}
}

@media screen and (max-width: 768px) {
    input[type=text].lg, input[type=password].lg, input[type=file].lg, input[type=email].lg, input[type=number].lg, input[type=tel].lg, input[type=search].lg, input[type=url].lg {font-size: 1.6rem; padding: 1.6rem;}
    .inp-inlabel input.lg + label {left: 1.6rem; top: 2.2rem; font-size: 1.6rem; line-height: 1.6rem;}
    /* .inp-inlabel input.lg:focus, .inp-inlabel input.lg:not(:placeholder-shown) {padding-top: 2.8rem; padding-bottom: 1.2rem;}
    .inp-inlabel input.lg:focus + label, .inp-inlabel input.lg:not(:placeholder-shown) + label {top: 1rem; font-size: 1.4rem;} */

    .mo-block-768 {display: block !important;}
    .inp-inlabel2 input {padding-right: 4.5rem;}
    .inp-inlabel2 input.lg {padding-right: 5rem;}
    .inp-inlabel2 input.lg + label {top: 2rem; font-size: 1.5rem; left: 1.6rem;}
    .inp-inlabel2 input.lg ~ .unit {top: 1.4rem;}

    /* .btn-top {display: none !important;} */
    .footer.pb200 .btn-top.show {bottom: 14rem;}

    /* 모바일 하단 고정바 한 줄로 압축 */
    .content-e {padding: 1.6rem 2rem; gap: .4rem;}
    .content-e > div {gap: .8rem;}
    .content-e ul {flex-wrap: nowrap; gap: 0;}
    .content-e li {white-space: nowrap;}
    .content-e li::after {margin: 0 .4rem;}

    /* 남은시간/모집예정 링크(시:분:초 포함) 폰트 축소 */
    .content-e .btn-txt-go-w {
        font-size: 1.2rem;
        line-height: 1.6rem;
        text-align: right;
        white-space: nowrap;
    }
    .content-e .btn-txt-go-w .time-title-mobile,
    .content-e .btn-txt-go-w .hours,
    .content-e .btn-txt-go-w .minutes,
    .content-e .btn-txt-go-w .seconds {
        font-size: 1.2rem;
        display: inline;
    }

    .mo, .mo-block {display: block !important;}
    .mo-flex {display: flex !important;}
    .mo-flex-col {display: flex !important;}
    .pc {display: none !important;}
    .mo-as {align-items: start !important;}
    .mo-ac {align-items: center !important;}
    .mo-ae {align-items: end !important;}
    .mo-hide {display: none !important;}
    .mo-gap0 {gap: 0 !important;}
    .mo-gap4 {gap: .4rem !important;}
    .mo-gap8 {gap: .8rem !important;}
    .mo-gap12 {gap: 1.2rem !important;}
    .mo-gap16 {gap: 1.6rem !important;}
    .mo-gap24 {gap: 2.4rem !important;}
    .mo-gap32 {gap: 3.2rem !important;}
    .mo-gap40 {gap: 4rem !important;}
    .mo-gap48 {gap: 4.8rem !important;}
    .mo-gap56 {gap: 5.6rem !important;}
    .mo-flex1 {flex: 1 !important;}
    .mo-flex0 {flex: 0 !important;}

    .mo-fs12 {font-size: 1.2rem !important;}
    .mo-fs13 {font-size: 1.3rem !important;}
    .mo-fs14 {font-size: 1.4rem !important;}
    .mo-fs15 {font-size: 1.5rem !important;}
    .mo-fs16 {font-size: 1.6rem !important;}
    .mo-fs18 {font-size: 1.8rem !important;}
    .mo-fs20 {font-size: 2rem !important;}
    .mo-fs24 {font-size: 2.4rem !important;}
    .mo-fs28 {font-size: 2.8rem !important;}
    .mo-lh20 {line-height: 2rem !important;}
    .mo-lh22 {line-height: 2.2rem !important;}
    .mo-lh24 {line-height: 2.4rem !important;}
    .mo-lh28 {line-height: 2.8rem !important;}
    .mo-lh34 {line-height: 3.4rem !important;}
    .mo-lh38 {line-height: 3.8rem !important;}
    .mo-lh42 {line-height: 4.2rem !important;}
    .mo-top-3 {top: 3.5rem !important;}
    .mo-mt0 {margin-top: 0 !important;}
    .mo-mt8 {margin-top: .8rem !important;}
    .mo-mt12 {margin-top: 1.2rem !important;}
    .mo-mt16 {margin-top: 1.6rem !important;}
    .mo-mt24 {margin-top: 2.4rem !important;}
    .mo-mt32 {margin-top: 3.2rem !important;}
    .mo-mt40 {margin-top: 4rem !important;}
    .mo-mt48 {margin-top: 4.8rem !important;}
    .mo-mb0 {margin-bottom: 0 !important;}
    .mo-mb8 {margin-bottom: .8rem !important;}
    .mo-mb12 {margin-bottom: 1.2rem !important;}
    .mo-mb16 {margin-bottom: 1.6rem !important;}
    .mo-mb24 {margin-bottom: 2.4rem !important;}
    .mo-mb32 {margin-bottom: 3.2rem !important;}
    .mo-mb40 {margin-bottom: 4rem !important;}
    .mo-mb48 {margin-bottom: 4.8rem !important;}
    .mo-mb56 {margin-bottom: 5.6rem !important;}
    .mo-mb64 {margin-bottom: 6.4rem !important;}
    .mo-w100p {width: 100% !important;}
    .mo-w50p {width: 50% !important;}
    .mo-w120 {width: 12rem !important;}
    .mo-w80 {width: 8rem !important;}
    .mo-w60 {width: 6rem !important;}
    .mo-w40 {width: 4rem !important;}
    .mo-w20 {width: 2rem !important;}
    .mo-p0 {padding: 0rem !important;}
    .mo-p4 {padding: 0.4rem !important;}
    .mo-p20 {padding: 2rem !important;}
    .mo-p24 {padding: 2.4rem !important;}
    .mo-pt0 {padding-top: 0rem !important;}
    .mo-pt40 {padding-top: 4rem !important;}
    .mo-pb40 {padding-bottom: 4rem !important;}
    .mo-pt30 {padding-top: 3rem !important;}
    .mo-pb30 {padding-bottom: 3rem !important;}
    .mo-pt20 {padding-top: 2rem !important;}
    .mo-pb20 {padding-bottom: 2rem !important;}
    .mo-pl0 {padding-left: 0 !important;}
    .mo-pr0 {padding-right: 0 !important;}
    .mo-fw400 {font-weight: 400 !important;}
    .mo-fw500 {font-weight: 500 !important;}
    .mo-fw600 {font-weight: 600 !important;}
    .mo-fw700 {font-weight: 700 !important;}
    .mo-ml4 {margin-left: 0.4rem !important;}
    .mo-ml8 {margin-left: 0.8rem !important;}
    .mo-ml12 {margin-left: 1.2rem !important;}

    .checkbox span, .checkbox2 span {font-size: 1.4rem; line-height: 2rem;}
    .btn.xl64 {font-size: 1.6rem; font-weight: 600; line-height: 2rem; padding: 1.7rem 2.1rem; height: 5.6rem;}
    .pop .btn.xl64 {font-size: 1.6rem; font-weight: 600; line-height: 2rem; padding: 1.4rem 2.1rem; height: 4.8rem;}
    .select.h64 {height: 5.6rem !important;}
    .select.h64 div.selected-display {height: 5.6rem; font-size: 1.6rem; line-height: 2.4rem; padding: 1.6rem;}
    .select div.select-list {position: fixed; left: 0; max-height: 60%; height: 100%; border: none; border-radius: 1.6rem 1.6rem 0 0; bottom: -60%; opacity: 1;}
    .select div.select-list.show {bottom: 0; display: block;}
    .select ul {padding: .8rem 0;}
    .select ul li {padding: 1.4rem 6rem 1.4rem 2rem; font-size: 1.8rem; line-height: 2.8rem; white-space: normal;}
    .select ul li:hover {background: var(--BG_body, #F7F7F7);}
    .select .dropdown-list {max-height: calc( 100% - 7.2rem ); overflow: auto;}
    .select .dropdown-list li {font-size: 1.5rem; font-weight: 400; line-height: 2rem; color: var(--Subbody_01);}
    .select .dropdown-list li.tit {display: none;}
    .select .dropdown-list li.selected {background: var(--BG_body); color: var(--Black); font-size: 16px; font-weight: 500;}
    .select .dropdown-list li.selected::after {right: 2rem; background-image: url(../images/checked2.svg);}
    .select .bs-head {display: flex; width: 100%;}

    .inp-search-wrap .inp-search.lg ~ .btn-search {top: .8rem;}

    .tbl-wrap.m-scroll {overflow: auto; padding-bottom: 1.2rem;}
    .tbl-wrap.m-scroll table {width: auto; table-layout: auto; min-width: 100%;}
    .tbl-wrap.m-scroll th, .tbl-wrap.m-scroll td {white-space: nowrap; font-size: 1.5rem !important; padding: 1.8rem 1.8rem;}
    .tbl-wrap.m-scroll::-webkit-scrollbar {width: .4rem; height: .4rem;}
    .tbl-wrap.m-scroll::-webkit-scrollbar-thumb {background: var(--Black); border-radius: 0;}
    .tbl-wrap.m-scroll::-webkit-scrollbar-track {background: var(--BG_body); border-radius: 0;}

    .tbl-basic th, .tbl-basic td {font-size: 1.5rem; line-height: 160%;}
    .tbl-basic:not(.no-res) {border-top-width: .1rem; display: block; margin-bottom: 3.2rem;}
    .tbl-basic:not(.no-res) thead {display: none;}
    .tbl-basic:not(.no-res) tbody {display: block;}
    .tbl-basic:not(.no-res) tbody tr {display: flex; flex-direction: column; gap: .4rem; padding: 1.6rem 0;}
    .tbl-basic:not(.no-res) tr {display: block; border-bottom: 1px solid var(--Line_Default, #DEDEDE);}
    .tbl-basic:not(.no-res) th, .tbl-basic:not(.no-res) td {font-size: 1.5rem; font-weight: 600; line-height: 160%; letter-spacing: -.04rem; padding: 0; border-bottom: none;}
    .tbl-basic:not(.no-res) td {font-weight: 500; position: relative; display: flex; justify-content: space-between;}
    .tbl-basic:not(.no-res) td::before {content: attr(data-label); display: block; line-height: 160%; font-size: 1.6rem;}
    .tbl-basic:not(.no-res) tbody th {display: block; width: 100%; padding: 0; background: var(--White, #fff); text-align: left;}
    .tbl-basic:not(.no-res) tbody th ~ td {padding: 0;}

    .tbl-basic2 {border-top-width: .1rem; display: block; margin-bottom: 3.2rem;}
    .tbl-basic2 tbody {display: block;}
    .tbl-basic2 tbody tr {display: flex; flex-direction: column; gap: .4rem; padding: 1.6rem 0;}
    .tbl-basic2 tr {display: block; border-bottom: 1px solid var(--Line_Default, #DEDEDE);}
    .tbl-basic2 th, .tbl-basic2 td {font-size: 1.5rem; font-weight: 600; line-height: 160%; letter-spacing: -.04rem; padding: 0; border-bottom: none;}
    .tbl-basic2 td {font-weight: 400; line-height: 160%; position: relative; display: flex; justify-content: space-between;}
    .tbl-basic2 tbody th {display: block; width: 100%; padding: 0; background: var(--White, #fff); text-align: left;}
    .tbl-basic2 tbody th ~ td {padding: 0;}

    .tbl-list.mo-tbl, .tbl-list.mo-tbl tr, .tbl-list.mo-tbl th, .tbl-list.mo-tbl td, .tbl-list.mo-tbl tbody {display: block; margin: 0;}
    .tbl-list.mo-tbl tr {padding: .4rem 0;}
    .tbl-list.mo-tbl th {padding: 0 0 .8rem;}
    .tbl-list.mo-tbl td {padding: 0 0 2.4rem;}

    .tbl-a, .tbl-a tr, .tbl-a th, .tbl-a td {}
    .tbl-a th {font-weight: 700; padding: 1.6rem .8rem; font-size: 1.6rem; line-height: 2rem;}
    .tbl-a td {padding: 1.6rem .8rem 4rem; font-size: 1.5rem; line-height: 160%;}
    /* .tbl-a th::before, .tbl-a td::before {width: 100%;}
    .tbl-a td::before {height: .1rem; background: var(--Line_Default, #DEDEDE);} */

    .tbl-b thead th, .tbl-b thead td {font-size: 1.5rem; line-height: 160%;}

    .pop-b {padding: 0;}
    .pop-b .pop-container {border-radius: 0; height: 100vh; padding: 0; max-width: none;}
    .pop-b .pop-head {padding: 2.4rem 2rem;}
    .pop-b .pop-head h3 {font-size: 1.8rem; margin-bottom: 0;}
    .pop-b .pop-body {padding: 0 2rem 2.4rem;}

    .pop-c {align-items: start; transition: none; padding: 0;}
    .pop-c .pop-container {border-radius: 0; height: 100vh; padding: 0; max-width: none; max-height: none;}
    .pop-c .pop-head {padding: 2.4rem 2rem;}
    .pop-c .pop-head h3 {font-size: 1.6rem; line-height: 2.4rem; margin-bottom: 0;}
    .pop-c .pop-body {padding: 1.2rem 2rem 2.4rem; height: calc(100% - 7.2rem);}
    .pop-c .pop-body h4 {font-size: 1.8rem;}
    .pop-c .pop-btn-wrap {padding: 2.4rem 0 0; flex-wrap: wrap;}
    .pop-c .pop-footer {padding: 2rem;}

    .pop-progress .pop-container {max-width: 280px;}
    .pop-progress h4 {font-size: 1.6rem; line-height: 2rem;}
    .pop-progress .progressbar-box {height: 1.6rem;}
    .pop-progress .progressbar-box p {font-size: 1.2rem; line-height: 2rem; top: -.15rem; right: .4rem;}

    .pop-main .pop-head {padding: 2.4rem;}
    .pop-main .pop-head img {width: 4rem;}
    .pop-main .pop-head h3 {font-size: 2.4rem; line-height: 3.4rem;}
    .pop-main .pop-head p {font-size: 2rem; font-weight: 500; line-height: 3rem; text-align: left;}
    .pop-main .pop-body {padding: 1.6rem 2.4rem; font-size: 1.5rem; line-height: 160%;}
    .pop-main .pop-body > * {text-align: left; font-size: 1.5rem; line-height: 160%;}
    .pop-main .pop-body .violetbox {border-radius: 0; border: none; padding: 1.6rem 2.4rem; text-align: left; margin-bottom: 2.4rem; margin: -1.6rem -2.4rem 0;}
    .pop-main .pop-body .link-wrap {margin: 0 -2.4rem; padding: 1.6rem 2.4rem; margin-bottom: -1.6rem;}
    .pop-main .pop-body .link-wrap .btn-txt {background: url(../images/ic_arrow_right.svg) no-repeat 100% 50% / 1.6rem auto; padding-right: 2rem;}

    .pop-main .pop-footer {padding: 0;}
    .pop-main .pop-footer button {padding: 1.2rem 1.6rem;}
    .pop-main .pop-footer button:nth-of-type(1) {font-size: 1.4rem; line-height: 2.4rem;}
    .pop-main .pop-footer .btn-close {font-size: 1.4rem; line-height: 2.4rem; text-align: center !important;}
    .pop-main .pop-footer button:nth-of-type(1):last-of-type {text-align: right !important;}

    .pop-container {
        height: auto !important;
        max-height: 100vh !important;
        display: flex;
        flex-direction: column;
    }
    .pop-body {
        height: auto !important;
        flex: 0 1 auto;
        overflow-y: auto;
    }
    .pop-footer {
        flex: 0 0 auto;
    }

    .list-b > li h5, .list-b > li p {font-size: 1.5rem;}
    

    .graybox {margin-bottom: .8rem; gap: 1.6rem;}
    .graybox .tbl-list {margin: 0;}
    .graybox.mt50 {margin-top: 3.2rem !important;}

    .graybox2 {padding: 2rem;}

    .radio span {font-size: 1.5rem;}
    .file-name {height: 5.6rem;}
    .inp-file.mo-flexcol {gap: .8rem;}
    .inp-file.mb24 {margin-bottom: 1.6rem !important;}
    .inp-file .btn.gray {height: 5.6rem;}

    .header-subnav {padding: 0 2rem;}

    /* .pagination {gap: .2rem;} */

    .pagination {
        gap: 3.6rem; /* 페이지네이션 좌우 아이콘 간격 줄이기 */
        font-size: 17px;

        .pagination ul {
            gap: 0.2rem; /* 숫자 간 간격 줄이기 */
        }

        .pagination li a {
            padding: 0.6rem 1.2rem;  /* 패딩 줄이기 */
            width: auto;             /* 고정된 너비 해제 */
            height: auto;            /* 고정된 높이 해제 */
            font-size: 1.4rem;       /* 글씨도 살짝 줄이기 */
            line-height: 1.8rem;
        }
    }

    .pop h3 {font-size: 2rem; line-height: 2.4rem;}
    .wrap {min-height: 100vh; overflow: hidden;}
    .mo-flexcol {flex-direction: column;}
    .mo-flexrow {flex-direction: row;}
    .mo-flexcol > * {width: 100% !important;}

    .list-dot2 > li {font-size: 1.5rem;}

    .list-a li a {font-size: 1.5rem; line-height: 2.4rem;}

    .list-d h5 {font-size: 1.5rem !important; line-height: 160% !important;}
    .list-d.v2 > li {padding: 1.6rem; font-size: 1.5rem;}
    .list-d.v3 > li {flex-direction: column; }
    .list-d.v3 > li > h5 {width: 100% !important; margin-bottom: .8rem !important; margin-top: 0 !important;}
    .list-d.v3 > li > div {margin-left: 0; width: 100% !important;}
    .list-d.v3 > li > div .btn.w120 {width: 8rem !important;}
    .list-d.v3 > li > div .btn.w120.mo-w100p {width: 100% !important;}
    .list-d.v4 {flex-direction: column;}
    .list-d.v4 > li h5 {font-size: 1.5rem; font-weight: 400;}
    .list-d.v4 > li p {font-size: 1.5rem; font-weight: 500;}

    .list-e > li h5 {font-size: 1.5rem !important; line-height: 160% !important;}
    .list-e > li p {font-size: 1.5rem !important; line-height: 160% !important;}

    .list-num2 > li {font-size: 1.5rem !important; line-height: 160% !important;}

    .list-num3 > li {font-size: 1.5rem;}

    .list-bar > li {font-size: 1.5rem;}

    .tbl-simple2 th, .tbl-simple2 td, .tbl-simple3 th, .tbl-simple3 td {font-size: 1.5rem;}

    .content-b {gap: .8rem;}
    .content-b > div {flex: 1 1 100%; gap: .4rem; padding: 1.8rem;}
    .content-b > div p {font-size: 1.8rem; line-height: 2.2rem;}

    .content-f {flex-direction: column; gap: .2rem;}
    .content-f li {flex-direction: row; justify-content: space-between; align-items: center;}
    .content-f li p {font-size: 1.5rem; line-height: 160%;}
    .content-f li h5 {font-size: 1.5rem; line-height: 160%;}



    .header {height: 5.6rem; border-bottom: 1px solid var(--BG_body, #F7F7F7); display: block; padding: 0;}
    .header.subnav, .header.mo-subnav {height: 11.2rem;}
    .header-container {margin-top: 5.6rem; padding: 0 2rem; overflow: auto;}
    .header-container > div {flex-direction: column-reverse; height: 0; justify-content: start; padding: .8rem 0; width: 100%; display: flex;}
    .header .btn-menu {display: block;}
    .header .member-wrap {padding-right: 0;}
    .header .member-wrap .btn-noti {position: fixed; top: 1.6rem; right: 6rem; width: 2.4rem; height: 2.4rem;}

    .noti-wrap {border-left: 1px solid var(--Line_Default, #DEDEDE); padding-top: 5.6rem; width: 100%; right: 0; display: none;}
    .noti-wrap.show {display: block;}
    .noti-head {padding: 1.6rem 2rem; border-bottom: 1px solid var(--BG_body, #F7F7F7);}
    .noti-content {padding: 2.4rem 2rem 0; height: calc(100vh - 5.6rem);}
    .noti-cate {flex-direction: column; align-items: end; margin-bottom: .8rem;}
    .noti-cate .cate {flex: 1; width: 100%;}
    .noti-cate .cate a {width: 100%;}
    .noti-list .txt {font-size: 1.5rem;}

    .wrap.mo-back .header .header-container {display: none;}
    .wrap.mo-back .header .btn-nav-back {display: block;}
    .header .nav-wrap {width: 100%; display: block;}
    .header .nav-wrap .nav {height: auto; display: none;}
    .header .member-wrap .member-info {opacity: 1; pointer-events: all; visibility: visible; border: none; width: 100%; padding: 0 0 2.4rem; position: static; display: none;}
    .header .member-wrap .btn-wrap {padding-top: 0;}
    .header .member-wrap {z-index: 1; width: 100%; flex-direction: column;}
    .header .nav-wrap h1 {position: fixed; top: -.5rem; left: 0; padding-left: 2rem;}
    .header .nav-wrap .nav > li {border-bottom: 1px solid var(--Line_Default, #DEDEDE); margin-bottom: 2.4rem;}
    .header .nav-wrap .nav > li:last-child {border-bottom: none;}
    .header .nav-wrap .nav > li > a {padding: 0; text-align: left; font-size: 1.4rem; line-height: 2.2rem; margin-bottom: 1.2rem; font-weight: 500; color: #9ca5ad;}
    .header .nav-wrap .nav > li > ul {visibility: visible; opacity: 1; pointer-events: all; width: 100%; flex-wrap: wrap; border: none; margin-top: 0; flex-direction: row; position: static; transform: none; padding: 0 0 1.6rem;}
    .header .nav-wrap .nav > li > ul li {flex: 0 1 50%;}
    .header .nav-wrap .nav > li > ul > li > a {text-align: left; font-weight: 500; padding: .8rem 0; display: flex; gap: .8rem; align-items: center; font-size: 1.5rem; color: #263238;}
    .header .nav-wrap .nav > li > ul > li > a::before {content: ''; width: 2.4rem; height: 2.4rem; display: block; background-repeat: repeat; background-position: center; background-size: 100% auto;}
    /* .header .nav-wrap .nav > li > ul > li > a.menu1-1::before {background-image: url(../images/ic_menu1_1.png);} */
    .header .nav-wrap .nav > li > ul > li > a.menu1-1::before {background-image: url(../images/Chart.svg);}
    .header .nav-wrap .nav > li > ul > li > a.menu1-2::before {background-image: url(../images/ic_menu1_2.png);}
    .header .nav-wrap .nav > li > ul > li > a.menu1-3::before {background-image: url(../images/ic_menu1_3.png);}
    .header .nav-wrap .nav > li > ul > li > a.menu1-4::before {background-image: url(../images/ic_menu1_4.png);}
    .header .nav-wrap .nav > li > ul > li > a.menu1-5::before {background-image: url(../images/ic_menu1_5.png);}
    .header .nav-wrap .nav > li > ul > li > a.menu2-1::before {background-image: url(../images/ic_menu2_1.png);}
    /* .header .nav-wrap .nav > li > ul > li > a.menu2-2::before {background-image: url(../images/ic_menu2_2.png);} */
    .header .nav-wrap .nav > li > ul > li > a.menu2-2::before {background-image: url(../images/Graph.svg);}
    .header .nav-wrap .nav > li > ul > li > a.menu2-3::before {background-image: url(../images/ic_menu2_3.png);}
    /* .header .nav-wrap .nav > li > ul > li > a.menu3-1::before {background-image: url(../images/ic_menu3_1.png);} */
    .header .nav-wrap .nav > li > ul > li > a.menu3-1::before {background-image: url(../images/Home.svg);}
    /* .header .nav-wrap .nav > li > ul > li > a.menu3-2::before {background-image: url(../images/ic_menu3_2.png);} */
    .header .nav-wrap .nav > li > ul > li > a.menu3-2::before {background-image: url(../images/Book.svg);}
    /* .header .nav-wrap .nav > li > ul > li > a.menu3-3::before {background-image: url(../images/ic_menu3_3.png);} */
    .header .nav-wrap .nav > li > ul > li > a.menu3-3::before {background-image: url(../images/Bell.svg);}
    /* .header .nav-wrap .nav > li > ul > li > a.menu3-4::before {background-image: url(../images/ic_menu3_4.png);} */
    .header .nav-wrap .nav > li > ul > li > a.menu3-4::before {background-image: url(../images/Star.svg);}
    .header .nav-wrap .nav > li > a.nav-arrow::after {
        display: none;
    }
    .header .member-wrap .user-name {flex-direction: row-reverse; width: 100%; justify-content: start; gap: .8rem; margin-top: 1.6rem; display: none;}
    .header .member-wrap .btn-user {background: none; padding: 0; font-size: 2rem; font-weight: 700; line-height: 2.4rem;}
    .header .member-wrap .member-info h3 {display: none;}
    .login-txt {display: none;}
    .pre-login {gap: .8rem; flex-direction: column-reverse; width: 100%; display: none;}
    .pre-login .btn.btn-join {border: 1px solid var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg, #E7ECEF); color: var(--Black, #263238);}
    .pre-login .btn.btn-join:hover, .pre-login .btn.btn-join:focus, .pre-login .btn.btn-join:disabled {border-color: var(--btn_bg-63, rgba(231, 236, 239, 0.63)); background: var(--btn_bg, #E7ECEF); color: var(--Black, #263238);}
    .pre-login .btn.btn-join:disabled {color: var(--Subbody_04, #CCC);}

    .header-container.menushow {background: #fff;}
    .header-container.menushow > div {height: calc( 100vh - 5.6rem );}
    .header-container.menushow .nav-wrap .nav {display: block;}
    .header-container.menushow .btn-noti {display: none;}
    .header-container.menushow .btn-menu {background-image: url(../images/ic_close.svg);}
    .header-container.menushow .member-info {display: flex;}
    .header-container.menushow .user-name {display: flex;}
    .header-container.menushow .login-txt {display: block;}
    .header-container.menushow .pre-login {display: flex;}

    .header .member-info {
        position: static !important;
        width: 100% !important;
        padding: 0 !important;
        margin-top: 2.4rem;
        margin-bottom: 3.2rem !important;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .header .member-wrap > .user-name {
        display: none !important;
    }

    .header .member-info .btn-wrap {
        display: none !important;
    }

    .header .member-info {
        position: static !important;
        width: 100% !important;
        padding: 0 !important;
        margin-top: 2.4rem;
        margin-bottom: 3.2rem !important;
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

    .header .member-wrap > .user-name {
        display: none !important;
    }

    .header .member-info .btn-wrap {
        display: none !important;
    }

    .header .member-card {
        display: flex !important;
        flex-direction: column;
        width: 100%;
        padding: 0 !important;
        background: transparent !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .header .member-card-head strong {
        font-size: 1.8rem;
    }

    .header .member-setting {
        width: 1.8rem;
        height: 1.8rem;
        flex-basis: 1.8rem;
        background: url(../images/ic_setting.svg) no-repeat center / 100% auto;
        filter: invert(70%) sepia(8%) saturate(220%) hue-rotate(170deg) brightness(88%) contrast(86%);
    }

    .header .btn-my-invest {
        font-size: 1.5rem;
    }


    .content-wrap {margin-top: 5.6rem; background: #fff; flex: 1; overflow: visible;}
    .header.subnav ~ .content-wrap, 
    .header.mo-subnav ~ .content-wrap {margin-top: 11.2rem;}
    .footer {padding: 2rem;}
    .footer h2 {font-size: 1.6rem; font-weight: 500; margin-bottom: 1.6rem; position: absolute; top: 0; left: 0;}
    .footer h2::before {content: '(주)';}
    .footer-container {display: flex; flex-direction: column-reverse; padding-top: 3.4rem;}
    .btn-detail {position: absolute; top: 0; right: 0;}
    .footer-link {gap: 0; margin-bottom: 0; flex-direction: column; padding: .8rem 0;}
    .footer-detail {padding: 0; border-top: none; margin-top: 0;}
    .footer-detail h3 {display: none;}
    .footer-detail .com-info2 {flex-direction: column;}
    /* .disclaimer {display: none;} */
    .footer-detail .com-info2 dl {margin-bottom: 2.4rem;}
    .footer-detail .com-info2 > div:nth-of-type(2) dl {margin-bottom: 1.6rem;}
    .footer-detail .com-info {flex-wrap: wrap; margin-bottom: 2.4rem;}
    .footer-detail .com-info li {white-space: nowrap; margin-right: 3.2rem; width: 100%;}
    .footer-detail .com-info li:nth-child(0), .footer-detail .com-info li:nth-child(1) {width: auto;}
    .footer-detail .com-info li::after {display: none;}
    .footer-link > li a {justify-content: space-between; width: 100%; padding: .8rem 0; display: block;}
    .footer-link > li:nth-child(1) a {font-weight: 600;}
    .footer-link > li ul {right: 0; bottom: 3.2rem;}
    .copyright {display: none;}
    .footer.hide {display: none;}

    /* 1. 메뉴 전체 틀을 세로가 아닌 '가로' 정렬로 변경 */
    .footer-link {
        display: flex;
        flex-direction: row !important; /* 가로로 나열 */
        justify-content: flex-start;       /* 가운데 정렬 (좌측 정렬을 원하면 flex-start) */
        align-items: center;
        gap: 1.6rem;                   /* 두 메뉴 사이의 간격 */
        padding: .8rem 0;
        margin-bottom: 0;
    }

    /* 2. 숨길 메뉴 지정: 2번째, 3번째, 4번째 메뉴 (이용안내, 사업공시, 회사소개) 숨기기 */
    .footer-link > li.mo-hide-footer {
        display: none !important;
    }

    /* 3. 메뉴 글자 스타일 정렬 */
    .footer-link > li a {
        display: inline-block;
        width: auto;
        padding: .8rem 0;
        font-size: 1.4rem;
    }

    /* 4. 두 메뉴 사이에 세로 바(|) 기호 넣기 (선택 사항) */
    .footer-link > li:nth-child(1)::after {
        content: '|';
        margin-left: 1.6rem;
        color: #DEDEDE; /* 세로 바 색상 */
        font-weight: normal;
    }
    
    /* 개인정보처리방침만 빨간색으로 하려면 추가 */
    .footer-link > li:nth-child(1) a {
        color: #848484; /* 두 번째 이미지처럼 빨간색 강조 */
        font-weight: 700;
        font-size: 1.4rem;
    }

    .form-container {flex: 1; display: flex; flex-direction: column;}
    .login-intro {border-radius: 0; box-shadow: none; padding: 3.2rem 0 2.2rem; margin: 0;}
    .login-intro h2 {margin-bottom: 3.6rem; font-size: 2.4rem; line-height: 3.4rem;}
    .login-intro .type li .btn-logintype {gap: 1.6rem;}
    .login-intro .type li .btn-logintype span {font-size: 1.6rem; font-weight: 600;}
    .login-intro .type {margin-bottom: 7.2rem;}

    /* .login-wrap {border-radius: 0; box-shadow: none; padding: 3.2rem 0 2.2rem; flex: 1; margin: 0;} */
    .login-wrap {border-radius: 0; box-shadow: none; padding: 3.2rem 0 2.2rem; margin: 0;}
    .login-wrap h2 {margin-bottom: 3.2rem; font-size: 2.4rem; line-height: 3.4rem;}
    .login-wrap .login-box {gap: .8rem;}
    .login-wrap .btn-wrap {gap: .8rem;}
    .login-wrap .btn-wrap .btn {font-size: 1.6rem; line-height: 2rem; padding: 1.7rem 2.1rem;}
    .login-bottom {display: flex; flex-direction: column-reverse; gap: 3rem;}
    .login-bottom .link {position: static; justify-content: center;}

    .term-agree li.all label span {font-size: 1.6rem;}
    .term-agree li .checkbox2 label span {font-size: 1.5rem;}

    .login-wrap .list-dot.mt32 {margin-top: 1.6rem !important;}
    .login-wrap .txtonly {position: absolute; top: 44%; left: 0; text-align: center; width: 100%;}

    .codesearch {flex-direction: column; height: calc( 100% - 6.8rem ); flex: 1;}
    .codesearch-box {border: 1px solid var(--Line_Default, #DEDEDE); border-radius: 1.6rem; padding-left: 2rem; width: 100%; flex: 0 1 50%;}

    .term-wrap {border-radius: 0; box-shadow: none; padding: 1.6rem 0 4.8rem; margin: 0;}
    .term-head {height: 5.6rem; width: 100%; top: 0; left: 0; position: fixed; background: #fff; z-index: 2; border-bottom: 1px solid var(--BG_body, #F7F7F7);}
    .term-wrap h2 {font-size: 1.8rem; line-height: 5.6rem; text-align: left; padding-left: 2rem;}
    .term-wrap .tabs {display: none;}
    .term-wrap .tabs ul {flex-wrap: wrap; gap: .4rem 0;}
    .term-wrap .btn-close {display: block;}
    .term-wrap .term-select {width: 100%; margin-top: 1.6rem; margin-bottom: 3.2rem !important;}
    .term-wrap .tab-content h3 {margin-bottom: 1.6rem;}

    /* 대출신청 */
    .check-text {font-size: 24px; margin-top: 16px;}
    .check-text div:nth-child(2) {font-size: 32px;}

    .check-bt {width: 195px; height: 52px; padding: 20px 18px; font-size: 14px; margin-bottom: 72px;}
    .check-img img:not(:last-child) {width: calc(100% / 3);}
    .check-img img:last-child {width: calc(100% / 2);}

    .loaninfo-section {height: 470px; padding: 40px 0;}

    .section1 {height: auto; margin-bottom: 64px; padding: 0;}
    .section1-main-text {font-size: 24px}
    .section1-main-text div:nth-child(2) {font-size: 24px}
    .section1-sub-text {font-size: 15px;}
    .section1-info {width: 320px; height: 376px; flex-direction: column;}
    .section1-info li {margin: 0;}
    .section1-info li:nth-child(2n) {width: 256px; height: 0;opacity: 0.5; margin: 0;}
    .section1-info li div {font-size: 18px;}
    .section1-info li div:nth-child(2) {font-size: 32px; font-weight: 700; margin: 0;}

    .loaninfo-section > button > img {width: 320px; height: 189.63px;}
    .loaninfo-section > img {width: 320px; height: 189.63px;}

    .section2, .section4 {flex-direction: column-reverse; gap: 24px; text-align: center;}
    .section3 {flex-direction: column; gap: 24px; text-align: center;}
    .loaninfo-textline1 {font-size: 20px; line-height: 24px;}
    .loaninfo-textline2 {font-size: 16px; line-height: 24px;}
    .loaninfo-textline3 {font-size: 14px; line-height: 24px;}

    .loaninfo-section1 .inner {padding: 3.2rem 0 0;}
    .loaninfo-wrap .btn-inquery {font-size: 1.6rem; padding: 2rem 1.8rem; margin-bottom: 10.2rem;}
    .loaninfo-section1 h2 span {font-size: 3.2rem;}
    .loaninfo-section1 h2 strong {font-size: 4rem;}
    .loaninfo-section1 .img-list > div:nth-of-type(2) img:nth-of-type(1) {margin-left: 5rem;}
    .loaninfo-section1 .img-list > div:nth-of-type(2) img:nth-of-type(2) {margin-right: 5rem;}

    .loaninfo-section2 {padding: 4.6rem 2rem 6.4rem;}
    .loaninfo-section2 h2 span,
    .loaninfo-section2 h2 strong {font-size: 2.4rem;}
    .loaninfo-section2 .txt1 {font-size: 1.5rem; letter-spacing: -.04rem; line-height: 160%;}
    .loaninfo-section2 .txt2 {font-size: 1.8rem; line-height: 2.4rem;}
    .loaninfo-section2 .txt3 {font-size: 2.6rem; line-height: 4rem;}
    .section2-info {flex-direction: column; gap: 2.4rem;}
    .section2-info .line {height: .2rem; width: 100%;}

    .loaninfo-section3, .loaninfo-section4, .loaninfo-section5 {padding: 4rem 2rem;}
    .loaninfo-section3 .inner, .loaninfo-section4 .inner, .loaninfo-section5 .inner {flex-direction: column-reverse; gap: 2.4rem; align-items: center; margin-left: 0rem;}
    .loaninfo-section3 .img, .loaninfo-section4 .img, .loaninfo-section5 .img {width: 100%; margin-top: 0;}
    .loaninfo-section4 .img {transform: translateX(9%); margin-top: -3rem;}
    .loaninfo-section3 h3, .loaninfo-section4 h3, .loaninfo-section5 h3 {font-size: 2rem; line-height: 2.4rem; text-align: center; margin-bottom: 1.6rem;}
    .loaninfo-section3 .txt1, .txt2, .loaninfo-section4 p, .loaninfo-section5 p {font-size: 1.6rem; line-height: 2.4rem; text-align: center; margin-bottom: 1.6rem;}
    .loaninfo-section4 p, .loaninfo-section5 p {margin-bottom: 0;}

    .loaninfo-section6 {padding: 4rem 2rem;}
    .tbl-wrap.mb80 {margin-bottom: 5.6rem !important;}
    .address span {font-size: 1.5rem;}

    .loanreview-wrap {background: var(--BG_subbody, #F1F3F5); padding-bottom: 8rem;}
    .loanreview-head {height: 24rem;}
    .loanreview-head h2 {font-size: 2.4rem;}
    .loanreview-best h3 {font-size: 2.4rem; line-height: 3.4rem;}
    .loanreview-best {padding: 4.8rem 0;}
    .loanreview-best > p {font-size: 1.5rem; margin-bottom: 2.4rem;}
    .general-review-wrap {padding: 4.8rem 2rem 2.4rem !important; flex-direction: column; gap: 1.6rem; margin-bottom: 0;}
    .review-card {width: 100%;}

    .tbl-basic2 td {
        display: block !important;
        justify-content: unset !important;
    }
    .tbl-basic2 td::before {
        display: none !important;
    }

    .investhome {overflow: hidden;}
    .investhome-section1 {height: auto;}
    .slider1-pagination {padding: 0 1rem;}
    .investhome-slider1 {height: 37rem;}
    .investhome-slider-type1 {padding-top: 4rem; background: url(../images/investhome_slider1_1m.jpg) no-repeat center / cover;}
    .investhome-slider-type1 .txt1 {font-size: 1.5rem; margin-bottom: 1.6rem;}
    .investhome-slider-type1 .txt2 {font-size: 3.2rem; margin-bottom: 1.6rem;}
    .investhome-slider-type1 .txt3 {font-size: 1.5rem; margin-bottom: 2.2rem;}
    .investhome-slider-type1 .btns {display: none;}
    .btn-outline-w {min-width: 12rem; padding: .8rem 1.6rem; font-size: 1.5rem;}

    .investhome-slider-type2 .inner {gap: 0; padding-left: 36%;}
    .investhome-slider-type2 .inner .info-wrap {gap: 5.3rem; left: 7%; padding-left: 0; position: absolute;}
    .investhome-slider-type2 .inner .info1 dd {font-size: 12rem;}
    .investhome-slider-type2 .inner .info2 {display: flex; gap: 5rem;}
    .investhome-slider-type2 .inner img {position: absolute; left: 50%; top: 8%;}

    .investhome-slider-type3 .inner {padding-left: 1.2rem;}
    .investhome-slider-type3 .inner .txt-wrap {margin-right: auto; word-break: keep-all;}
    .investhome-slider-type3 .inner .txt1 {margin-bottom: 11.8rem;}
    .investhome-slider-type3 .inner .txt2 {font-size: 4.8rem; margin-bottom: 1.5rem;}
    .investhome-slider-type3 .inner .txt3 {font-size: 1.6rem; margin-bottom: 0;} 
    .investhome-slider-type3 .inner img {position: absolute; left: 50%; top: 5px;}

    /* 작업중 */
    /* .investhome-slider-type4 {padding: 2rem; background: url(../images/investhome_slider1_3.png) no-repeat 66% 150% / auto 79% #A1BCE2; position: relative;} */
    .investhome-slider-type4 .inner {display: flex; align-items: center; justify-content: space-between;}
    .investhome-slider-type4 .inner .txt-wrap {flex: 1;}
    .investhome-slider-type4 .inner .txt1 {font-size: 2.0rem; line-height: 3.4rem;}
    .investhome-slider-type4 .inner .txt2 {font-size: 1.3rem; line-height: 2rem; text-align: left;}
    .investhome-slider-type4 .inner ul {margin-bottom: 0rem;}
    .investhome-slider-type4 .inner li {font-size: 2.4rem; line-height: 2.4rem;}
    .investhome-slider-type4 .inner li::after {margin: 0 .8rem;}
    
   


    .btn-go3 {min-width: 17rem; padding: 1.4rem -1.4rem; font-size: 1.3rem; line-height: 1.6rem;}
    .btn-go3::after {width: 0.2rem; height: 1.2rem; flex: 0 0 1.2rem;}
    .invest-chart {  position: relative; margin-left: 2rem; width: 12rem; height: 12rem;}
    .chart-box {width: 20rem; height: 20rem;}

    .investhome-section2 {padding: 3.2rem 2rem 2.4rem;}
    .investhome-section2 .inner {flex-direction: column; height: auto;}
    .investhome-section2 .inner > div, 
    .investhome-slider2 .slide-item {width: 100% !important; flex-direction: column;}
    .investhome-section2 .inner > div dl {flex-direction: row; width: 100%; justify-content: space-between;}
    .investhome-section2 .inner > div dd {font-size: 1.8rem; line-height: 2.4rem;}
    .investhome-section2 .inner > div:nth-of-type(1) dl {height: auto; padding: 2rem; border-bottom: 1px solid var(--Black_bg, rgba(0, 0, 0, 0.50));}
    .investhome-section2 .inner > div:nth-of-type(2) dl {height: auto; padding: 2rem; border-bottom: 1px solid var(--Line_Default, #DEDEDE);}
    .investhome-section2 .inner > div:nth-of-type(2) {padding-right: 0;}
    .investhome-section2 .inner > div:nth-of-type(2) dl:nth-of-type(1):after {display: none;}
    .investhome-section2 .slick-dots {display: none !important;}
    .investhome-section2 .btn-prev, .investhome-section2 .btn-next {display: none;}
    .investhome-section3 {padding: 1.0rem 2rem 2.0rem;}
    .investhome-section3 h2 {font-size: 2rem; line-height: 2.4rem; margin-bottom: 2.4rem;}
    .investhome-section3 h3 {font-size: 1.8rem; line-height: 2.4rem; margin-top: 2.4rem; margin-bottom: 1rem;}
    .investhome-section3 h4 {font-size: 1.2rem;}
    .investhome-section3 table {width: 90%;}
    .investhome-section4 {margin-bottom: 4rem; padding: 0 2rem;}
    .box-gray {gap: 1.6rem; padding: 6.8rem 2rem;}
    .box-gray p {line-height: 160%; font-size: 1.5rem;}
    .box-gray img {width: 12rem;}
    .investhome-section4 h2 {font-size: 2rem; line-height: 2.4rem; margin-bottom: 1.6rem;}

    .investhome-section5 {padding-bottom: 5.6rem;}
    .investhome-section5 .inner {padding: 2.8rem 2rem 3.5rem;}
    .investhome-section5 p {margin-bottom: .8rem;}
    .investhome-section5 h2 {font-size: 2rem; line-height: 2.4rem; margin-bottom: 1.6rem;}
    .investhome-section5 .btn {padding: .8rem 1.6rem; font-size: 1.4rem; line-height: 2.4rem; text-align: left; height: auto; font-weight: 400;}
    .investhome-section5 .inner {background-position: calc( 100% - 1.4rem ) 50%; background-size: auto 53%;}

    /* .investhome-section6 {padding-bottom: 0 !important;}
    .investhome-section6 h2 {font-size: 2rem; line-height: 2.4rem; margin-bottom: 0 !important;} */

    .recruit-list {flex-direction: column; gap: 2.4rem;}
    .recruit-list2 {flex-direction: column; gap: 2.4rem; width: 100%;}

    .recruit-item {width: 100%; flex: 0 0 100%;}
    .recruit-item .tit-wrap {margin-bottom: 1.6rem;}
    .recruit-item .tit-wrap > div .tit {font-size: 1.6rem;}
    .recruit-item .tit-wrap > div .stit {font-size: 1.4rem;}
    .recruit-item .info1-wrap dd strong {font-size: 1.8rem; line-height: 2.2rem;}

    .recruit-item2 {width: 100%;}
    .recruit-item2 .tit {font-size: 1.8rem; line-height: 2.4rem;};
    .recruit-item2 .stit {font-size: 1.4rem; line-height: 2.2rem;}
    .recruit-item2 .info {font-size: 1.4rem; line-height: 2.2rem;}

    .recruit-item:hover, .recruit-item2:hover {transform: none;}

    
    
    .tabs-wrap.flex-row {flex-direction: column !important; gap: 1.6rem;}
    @media (max-width: 768px) {
      .tabs2 ul {
        gap: 2rem;           /* 모바일에서 탭 사이 간격을 적절히 좁힘 (기존 4rem은 클 수 있음) */
        justify-content: flex-start; /* 왼쪽 정렬 */
        overflow-x: auto;    /* 가로 스크롤 허용 */
        padding-left: .5rem;  /* 왼쪽 시작점에 여백을 주면 더 깔끔함 (선택사항) */
      }

      .tabs2 li {
        flex: none;          /* 1:1로 나눠 갖던 너비를 해제하여 글자 크기만큼만 차지하게 함 */
      }

      .tabs2 li a {
        font-size: 1.54rem;   /* 요청하신 폰트 사이즈 */
        text-align: left;    /* 텍스트 왼쪽 정렬 */
        padding: 1rem 0;
      }
    }
    .tabs7 ul {gap: 3rem;}
    .inp-search.w320 {width: 100% !important;}


    .header-subnav {gap: 0; overflow: auto; margin-top: -1.3rem;}
    .header-subnav li a {font-size: 1.4rem !important; line-height: 2.2rem !important; padding: 1.4rem 1.2rem !important; white-space: nowrap;}
    .header-subnav li a.active {padding: 1.4rem 1.2rem !important;}

    .btn-callcenter {bottom: 2rem; top: auto;}

    .tit-wrap2 {padding-right: 0; align-items: start; margin: .8rem 0 3.6rem; position: static; width: 100%;}
    .page-dot2 {position: absolute; top: 8.8rem; right: 2rem;}

    .content-a > div p {font-size: 1.5rem; line-height: 160%;}

    /* 투자상품 상세 */
    .investproddetail-section1 {margin-bottom: 10.6rem; min-height: 52.6rem;}
    .investproddetail-section1 .inner {padding: 3.2rem 0;}
    .investproddetail-section1 .group1 {flex-direction: column; gap: 0; padding-bottom: 0rem;}
    .investproddetail-section1 .group1-1 h2 {font-size: 2rem; line-height: 2.4rem; margin-bottom: .4rem;}
    .investproddetail-section1 .group1-1 p {font-size: 1.4rem; line-height: 2.4rem; font-weight: 500; margin-bottom: 2.4rem;}
    .investproddetail-section1 .group1-2 {margin-bottom: 2.4rem;}
    .investproddetail-section1 .group1-2 .con {padding: 1.6rem; height: auto; flex: 1;}
    .investproddetail-section1 .group1-2 .con p {font-size: 3.2rem; font-weight: 600; line-height: 4rem;}
    .investproddetail-section1 .group2 h3 {font-size: 1.6rem; font-weight: 600; line-height: 2rem; margin-bottom: 2.2rem;}
    .investproddetail-section1 .group2 .progressbar-box {height: 2.5rem; overflow: visible;}
    /* .investproddetail-section1 .group2 .progressbar-box p {color: #fff; font-size: 1.4rem; line-height: 2.4rem; font-weight: 400; background: var(--Violet_600); padding: .4rem .8rem; border-radius: 1.6rem; margin-top: -5.2rem; right: 0;} */
    .investproddetail-section1 .group3 {padding: 2.8rem 2rem; bottom: -14.8rem;}
    .investproddetail-section1 .group3 ul {flex-direction: column; padding: 0; gap: .9rem; width: 100%;}
    .investproddetail-section1 .group3 li {flex-direction: row; justify-content: space-between; width: 100%; padding: 0; border-right: none;}
    .investproddetail-section1 .group3 h5 {font-size: 1.5rem; font-weight: 400; line-height: 2.4rem; color: #828282; letter-spacing: -0.2px;}
    .investproddetail-section1 .group3 p {font-size: 15px; font-weight: 500; line-height: 160%; letter-spacing: -0.4px;}
    
    .investproddetail-section2 .inner {flex-direction: column;}
    .thumb-wrap {width: 100%; flex: 1; max-width: none;}
    .thumb-wrap .btns > * {width: 3.4rem; height: 3.4rem; line-height: 3.4rem !important; background-size: 1.6rem auto !important;}
    .thumb-wrap .btns > .btn-pause-play {background-size: 100% auto !important;}
    .thumb-wrap .btns > .btn-pause-play.paused {background-size: 1.6rem auto !important;}
    .thumb-wrap .btns > p {font-size: 1.3rem;}

    .investproddetail-section2 .checkpoint-wrap {height: auto; padding: 1.6rem;}
    .investproddetail-section2 .checkpoint-wrap .list-check {gap: .8rem;}
    .investproddetail-section2 {margin-bottom: 4.2rem;}
    .investproddetail-section3 .inner {flex-direction: column; gap: 4.8rem;}
    .investproddetail-section4 {padding-bottom: 4.8rem; padding-top: 5.6rem;}
    .progressbar-box-wrap {padding-right: 0;}
    .progressbar-box-wrap span {top: 4rem; left: 0; width: calc(100vw - 6rem); text-align: right;}
    .graph-wrap {gap: 2.4rem;}
    .graph-wrap > div {flex-direction: column-reverse; gap: .8rem;}
    .progressbar-box-wrap .progressbar::after {display: none;}
    .investproddetail-section5 .map-area {margin-bottom: 1rem;}
    .docu-btn-wrap {gap: .8rem;}
    .docu-btn-wrap button {flex: 1 1 calc( 50% - .4rem ); justify-content: space-between; padding: .8rem 1rem;}
    .investproddetail-section5 .chart-wrap {flex-direction: column; gap: 2.4rem; padding: 2rem;}
    .investproddetail-section5 .chart-wrap > div {padding: 0; width: 100%;}
    .tit-wrap3 {flex-direction: column; align-items: start; gap: .8rem; margin-bottom: 1.6rem;}
    .stackedbar-wrap .legend-item {flex: 0 1 40%;}
    .dnchart-wrap .legend {margin-top: 3.2rem;}
    .dnchart-wrap .legend-item {flex-wrap: wrap; font-size: 1.4rem; line-height: 2.4rem;}
    .dnchart-wrap .legend-item > p:nth-of-type(2) {width: 100%; border-bottom: .1rem solid var(--Line_Default); padding-bottom: .8rem;}
    .content-c {padding: 4rem;}
    .content-d {padding: 4rem;}
    .content-d ul {flex-direction: column;}
    .content-d li {border-right: none; border-bottom: .1rem solid var(--Line_Default); width: 100%; padding: 1.6rem 0;}
    .content-d li:first-child {padding-top: 0;}
    .content-d li:last-child {padding-bottom: 0; border-bottom: none;}

    .tabs3 {margin: 0 -2rem;}
    .tabs3 li a, .tabs3 li a.active {padding: 1.4rem 3rem;}

    .chart-container {width: 23rem; height: 23rem;}
    .chart-center-text p:first-child {font-size: 1.2rem; line-height: 2rem;}
    .chart-center-text p:last-child {font-size: 1.35rem; line-height: 2rem;}

    .linechart-wrap canvas {height: 300px !important;}

    .invest-success-wrap .inner {padding: 3.8rem 0;}
    .invest-success-wrap .tit {font-size: 2.1rem; line-height: 2.4rem;}
    .invest-success-wrap .stxt {font-size: 1.4rem;}
    .box-bo {border-radius: .8rem; border: .1rem solid var(--Line_Default, #DEDEDE); display: flex; padding: 2.4rem; flex-direction: column; align-items: center;}
    .invest-success-wrap .tit2 {font-size: 1.6rem;}
    .invest-success-wrap .content-a {gap: .8rem;}
    .invest-success-wrap .content-a > div {flex: 1 1 100%; flex-direction: row; justify-content: space-between; align-items: center;}
    .invest-success-wrap .content-a > div p {width: auto;}
    .invest-success-wrap .btn-wrap {flex-direction: column-reverse;}
    .invest-success-wrap .btn-wrap .btn {max-width: 100%;}
    .list-b.v2 > li h5 {font-weight: 500 !important; font-size: 1.6rem; line-height: 2rem !important;}
    .list-b.v2 > li p {font-size: 1.5rem !important; line-height: 160%; padding-top: 6px; padding-left: 4px;}

    .tit-wrap4 h2 {font-size: 1.8rem !important; margin: 0 !important;}
    .tit-wrap4 p {font-size: 1.5rem;}
    .invest-test-list {gap: 3.2rem;}
    .invest-test-list .question {font-size: 1.4rem; line-height: 160%; margin-bottom: 1.6rem;;}
    .answer-wrap .btn-answer input[type=radio] ~ div {font-size: 1.5rem; line-height: 160%; padding: 1.2rem 6.4rem 1.2rem 1.2rem;}
    .answer-wrap .btn-answer input[type=radio] ~ div img {width: 1.7rem; padding-top: 0.3rem;}
    .answer-wrap .btn-answer input[type=radio]:checked ~ div, .answer-wrap .btn-answer input[type=radio].correct ~ div {background-position: calc(100% - 1.6rem) 50%; padding-right: 4.8rem; padding: 1.2rem 6.4rem 1.2rem 1.2rem;}
    .answer-wrap .btn-answer input[type=radio] ~ div span {padding-top: 0; font-size: 1.4rem;}

    .invest-sale-wrap {padding-top: 2.4rem;}
    .invest-sale-content {flex-direction: column; gap: 1.2rem;}
    .invest-sale-content .summary {width: 100%;}
    .invest-sale-content .menu ul {flex-direction: row; gap: .8rem;}
    .invest-sale-content .menu ul li {flex: 1;}
    .invest-sale-content .menu ul li a {justify-content: center; background: var(--BG_body, #F7F7F7); font-weight: 500;}
    .invest-sale-content .menu ul li a::after {display: none;}
    
    .pubinfo-head {height: 18rem;}
    .pubinfo-head h2 {font-size: 2.4rem; line-height: 3.4rem;}
    .pubinfo-body {padding: 3.2rem 2rem;}
    .pubinfo-body .guide-img {padding: 0;}

    .notice-head {height: 24rem;}
    .notice-head h2 {font-size: 2.4rem; line-height: 3.4rem;}
    .notice-body {padding: 3.2rem 2rem;}

    .qna-head {height: 24rem;}
    .qna-head h2 {font-size: 2.4rem; line-height: 3.4rem;}
    .qna-body {padding: 3.2rem 2rem;}


    .tabs5 {margin-bottom: 3.2rem; overflow: auto;}
    .tabs5 li {flex: 0;}
    .tabs5 li a {padding: 1.2rem; font-size: 1.6rem; line-height: 2.2rem; border-radius: .8rem; min-width: 9.6rem;}

    .qna-body .btn-view {width: 1.6rem; height: 1.6rem;}

    .company-section1 {height: 56rem; padding: 12rem 2rem 13.2rem;}
    .company-section1 .inner {max-width: 1100px; margin: 0 auto; text-align: center; color: #fff;}
    .company-section1 .txt1 {font-size: 1.5rem; font-weight: 600; line-height: 160%; margin-bottom: 2.4rem;}
    .company-section1 .txt2 {font-size: 2.8rem; line-height: 3.6rem; margin-bottom: 2.4rem;}
    .company-section1 .txt3 {font-size: 1.2rem; line-height: 2rem;}
    .company-section1 .btn-down {width: 1.6rem; height: 1.6rem; bottom: 2.4rem;}
    .company-section2 {padding: 4.8rem 2rem;}
    .company-section2 .txt1 {font-size: 2.4rem; line-height: 3.4rem; margin-bottom: 1.6rem;}
    .company-section2 .txt2 {font-size: 1.5rem; font-weight: 600; line-height: 160%; margin-bottom: 2.4rem;}
    .company-section4 {padding: 6.4rem 2rem;}
    .company-section4 p {font-size: 2.4rem; line-height: 3.4rem; margin-bottom: 3.2rem;}
    .company-section4 .history::before,
    .company-section4 .history dt::before {display: none;}
    .company-section4 .history dl {width: 100%; margin-bottom: 3.2rem; margin-left: 0 !important; align-items: start !important;}
    .company-section4 .history dt {font-size: 1.8rem; margin-bottom: .8rem;}
    .company-section4 .history dd {font-size: 1.5rem; line-height: 160%; padding-left: 2rem; margin-left: 0; margin-right: 0;}
    .company-section4 .history {width: fit-content; margin: 0 auto; min-width: 36rem; max-width: 100%;}
    .company-section5 {padding: 5.6rem 2rem;}
    .company-section5 .txt1 {font-size: 2rem; line-height: 2.4rem; margin-bottom: 3.6rem;}
    .company-section5 li img {width: 12rem;}
    .company-section5 ul.link {gap: 2.4rem 4rem; margin-bottom: 0;}
    .company-section6 .txt1 {font-size: 1.8rem; margin-bottom: 2.4rem;}
    .company-section6 .txt2 {font-size: 1.6rem; line-height: 2rem; margin-bottom: 1.6rem;}
    .company-section6 ul.way {font-size: 1.5rem; display: flex; flex-direction: column; gap: .8rem; align-items: start;}
    .company-section6 ul.way li::after {display: none;}
    .company-section6 {padding: 4 2rem 3.2rem;}
    .company-section7 .map-area {height: 36rem;}

    .datepick-wrap {gap: 1.6rem;}
    .datepick-wrap .radio-wrap {margin-bottom: 0;}
    .datepick-wrap .tabs6 li {flex: 1;}
    .datepick-wrap .tabs6 li a {font-size: 1.4rem; padding: .9rem 1.4rem; min-width: auto;}
    .datepick-wrap .input-wrap {flex-direction: column;}
    .datepick-wrap .input-wrap input {padding: 1.1rem 1.6rem; font-size: 1.5rem; line-height: 160%;}
    .datepick-wrap .input-wrap .line-default {display: none;}
    .datepick-wrap .input-wrap .toast {bottom: auto; top: 200%;}

    .inp-ym {font-size: 1.8rem !important; width: 12.6rem;}
    .inp-y {font-size: 1.8rem !important; width: 8.6rem;}
    .month-picker {left: 50% !important; transform: translateX(-50%);}

    .filter-checkbox span {padding: .8rem; line-height: 2.4rem; min-width: 8.8rem;}

    .mypage-wrap {padding: 2.4rem 2rem; background: var(--BG_subbody);}
    .mypage-wrap .inner {flex-direction: column;}
    .mypage-wrap .menu {display: none;}
    .mypage-wrap .content-section {width: 100%;}
    .user-investor ul li,
    .info-section .list-c li,
    .user-info div {flex-direction: row;}
    .user-deposit {gap: 1.2rem;}
    .investor-info,
    .payment-info,
    .investment-status-info,
    .cumulative-investment-info {height: auto;}
    .payment-info .graybox {padding: 1.6rem 2.4rem;}

}

@media screen and (max-width: 480px) {
    .loaninfo-section1 .inner {padding: 1.7rem 0 0;}
    .loaninfo-wrap .btn-inquery {font-size: 1.4rem; padding: 2rem 1.8rem; line-height: 1.2rem; height: 5.2rem; box-shadow: 0 .2rem .2rem 0 rgba(0, 0, 0, 0.25);}
    .loaninfo-section1 h2 {margin-bottom: 1.4rem;}
    .loaninfo-section1 h2 span {font-size: 2.4rem;}
    .loaninfo-section1 h2 strong {font-size: 3.2rem;}
    .loaninfo-section1 .img-list {padding: 0;}
    .loaninfo-section1 .img-list > div:nth-of-type(2) img:nth-of-type(1) {margin-left: 0;}
    .loaninfo-section1 .img-list > div:nth-of-type(2) img:nth-of-type(2) {margin-right: 0;}

    .btn-callcenter {bottom: 2rem; top: auto;}

    .linechart-wrap canvas {height: 268px !important;}
}


/* 기존 /public/assets/style/common.css 에 있던거 */
.hideMain {
    display: none;
}

.hideSub {
    display: none;
}

.loading {
    width: 100%;
    height: 100%;
    position: fixed;
    display: none;
    left: 0;
    top: 0;
    z-index: 9999;
    background-color: #ffffff8f;

    justify-content: center;
    align-items: center;
}

.loading .loader {
    width: 150px;
    height: auto;
    color: #FF5252;
}

/* 슬라이드 내부의 링크가 전체 슬라이드 영역을 덮도록 설정 */
.slide-item > .slide-link-full {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none; /* 링크 밑줄 제거 (선택 사항) */
    color: inherit;       /* 텍스트 색상 상속 (선택 사항) */
}