@charset "utf-8";
/* variables */
:root {
    /* font */
    --font-text : "Hyundai Sans Text", "Hyundai Sans Text KR", sans-serif;
    --font-head : "Hyundai Sans Head", "Hyundai Sans Head KR", sans-serif;

    /* line-height */
    --lh-lg : 1.4;
    --lh-base : 1.25;
    --lh-sm : 1;
    --lh-xs : 0.9;

    /* color */
    --Primary-Color-Red: #DE3111;
    --Primary-Color-Blue: #AACAE6;
    --Primary-Color-White: #FFFFFF;
    --Primary-Color-Black: #000000;
    --Secondary-Color-Black_Natural: #F0F0F0;
    --Secondary-Color-Black_Natural_30: #ABB2B5;
    --Secondary-Color-Black_999999: #999999;
    --Secondary-Color-Black_777777: #777777;
    --Secondary-Color-Black_666666: #666666;
    --Secondary-Color-Black_555555: #555;
    --Secondary-Color-Black_333333: #333333;
    --Line-Color-Line_01: #d9d9d9;
    --Line-Color-Line_02: #BBBBBB;
    --Line-Color-Line_03: #7A7E81;
    --Line-Color-Line_04: #595C5F;
    --Line-Color-Line_e6e6e6: #e6e6e6;
    --Line-Color-Line_a1a1a1: #a1a1a1;
    --Secondary-Color-Error-color: #BD5818;
    --Secondary-Color-Positive-color: #003777;
    --Link-Color-Blue: #3792ef;
}
:lang(ko) {
    --font-text : "Hyundai Sans Text KR", "Hyundai Sans Text", sans-serif;
    --font-head : "Hyundai Sans Head KR", "Hyundai Sans Head", sans-serif;
}

/* reset */
* { -webkit-text-size-adjust: none; text-size-adjust: 100%; box-sizing: border-box; -ms-overflow-style: none; } body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, th, td, form, fieldset, legend, input, textarea, button, select, div, figure, article, header, nav, footer, section, aside { margin: 0; padding: 0; white-space: normal; word-break: keep-all; word-wrap: break-word; font-family: var(--font-text); } html, body { overflow: hidden; position: relative; height: 100%; color: var(--Primary-Color-Black); letter-spacing: 0; font-family: var(--font-text); font-size: 16px; font-weight: 400; -webkit-overflow-scrolling: touch; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-head); font-weight: 400; } img, fieldset, iframe { border: 0; vertical-align: top; } img { width: 100%; height: auto; } textarea { appearance: none; -webkit-appearance: none; -webkit-border-radius: 0; resize: none; font-family: var(--font-text); } ul, ol, li { list-style: none; } em, address { font-style: normal; } input { vertical-align: middle; appearance: none; -webkit-appearance: none; -webkit-border-radius: 0; } select { vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; } table { width: 100%; border-collapse: separate; border-spacing: 0; } hr { display: none; } label { word-break: break-all; } legend, caption { overflow: hidden; height: 0; } strong, b { font-weight: 600; } i { font-style: normal; } button { border: none; background: none; box-sizing: border-box; cursor: pointer; font-family: var(--font-text); -webkit-appearance: none; } input, select, textarea { -webkit-user-select: auto; -moz-user-select: auto; -ms-user-select: auto; user-select: auto; transform: translateZ(0); } input[type="text"], input[type="password"], input[type="number"], input[type="tel"], input[type="email"], select, textarea { color: #222; border-radius: 3px; font-family: var(--font-text); font-size: 17px; word-break: break-all; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; } input[type="email"] { -webkit-ime-mode: inactive; -moz-ime-mode: inactive; -ms-ime-mode: inactive; ime-mode: inactive; } a { display: inline-block; color: inherit; text-decoration: none; box-sizing: border-box; cursor: pointer; -webkit-appearance: none; -webkit-tap-highlight-color: transparent; } abbr { text-decoration: none; } select::-ms-expand { display: none; } ::-webkit-input-placeholder, textarea::placeholder { color: var(--Secondary-Color-Black_777777); font-family: var(--font-text); font-size: 7px; font-weight: 400; } [tabindex="-1"] { outline: 0; -webkit-tap-highlight-color: var(--Primary-Color-Black); } :disabled { -webkit-tap-highlight-color: var(--Primary-Color-Black); } :-webkit-autofill, :-webkit-autofill:hover, :-webkit-autofill:focus, :-webkit-autofill:active { -webkit-box-shadow: 0 0 0 1000px var(--Primary-Color-White) inset; box-shadow: 0 0 0 1000px var(--Primary-Color-White) inset; } body { padding: 0 !important; word-break: break-all; box-sizing: border-box; } @media screen and (min-width: 1024px) { *::-webkit-scrollbar { width: 4px; height: 4px; background-color: transparent; } *::-webkit-scrollbar-thumb { background: var(--Secondary-Color-Black_999999); border-radius: 6px; border-radius: 20px; } *::-webkit-scrollbar-thumb:hover { background: var(--Primary-Color-Blue); } } a, button { color: var(--Primary-Color-Black); cursor: pointer; appearance: none; -moz-appearance: none; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; }
body {
    width: 100vw;
    height: 100vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* iOS에서 스크롤 인식 */
    touch-action: pan-y;
    line-height: var(--lh-lg);
}
body.fix {
    overflow: hidden !important;
    padding-right: 4px !important;
}
body.fix .header-wrap {
    width: 100vw;
    padding-right: 4px;
}
@media screen and (max-width: 1023px) {
    body.fix {padding-right: 0 !important;}
    body.fix .header-wrap {padding-right: 0;}
}

/* typography */
.t-heading-80,
.t-heading-80-30,
.t-heading-80-24 {
    font-family: var(--font-head);
    font-size: 80px;
    font-weight: 700;
    line-height: var(--lh-base);
} 
.t-heading-68 {
    font-family: var(--font-head);
    font-size: 68px;
    font-weight: 700;
    line-height: var(--lh-base);
}
.t-heading-68-30 {
    font-family: var(--font-head);
    font-size: 68px;
    font-weight: 700;
    line-height: var(--lh-base);
}
.t-heading-68-24 {
    font-family: var(--font-head);
    font-size: 68px;
    font-weight: 700;
    line-height: var(--lh-base);
}
.t-heading-56 {
    font-family: var(--font-head);
    font-size: 56px;
    font-weight: 700;
    line-height: var(--lh-base);
}
.t-heading-56-36 {
    font-family: var(--font-head);
    font-size: 56px;
    font-weight: 700;
    line-height: var(--lh-base);
}
.t-heading-40,
.t-heading-40-30,
.t-heading-40-18 {
    font-family: var(--font-head);
    font-size: 40px;
    font-weight: 700;
    line-height: var(--lh-base);
}
.t-heading-32,
.t-heading-32-36,
.t-heading-32-32 {
    font-family: var(--font-head);
    font-size: 32px;
    font-weight: 700;
}
.t-heading-24,
.t-heading-24-20 {
    font-family: var(--font-head);
    font-size: 24px;
    font-weight: 700;
}
.t-heading-20,
.t-heading-20-20 {
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
}
.t-body-24 {
    font-family: var(--font-text);
    font-size: 24px;
    font-weight: 700;
}
.t-body-20 {
    font-family: var(--font-text);
    font-size: 20px;
    font-weight: 500; /* medium */
}
.t-body-20-20,
.t-body-20-14 {
    font-family: var(--font-text);
    font-size: 20px;
}
.t-body-16 {
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 500; /* medium */
}
.t-body-14 {
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 500; /* medium */
}
.t-body-12 {
    font-family: var(--font-text);
    font-size: 12px;
}
.fw-100 {font-weight: 100!important;}
.fw-200 {font-weight: 200!important;}
.fw-300 {font-weight: 300!important;}
.fw-400 {font-weight: 400!important;}
.fw-500 {font-weight: 500!important;}
.fw-600 {font-weight: 600!important;}
.fw-700 {font-weight: 700 !important;}
.fw-800 {font-weight: 800!important;}
.fw-900 {font-weight: 900!important;}
@media screen and (max-width: 1023px) {
    .t-heading-80 {font-size: 40px;}
    .t-heading-68 {font-size: 36px;}
    .t-heading-80-30,
    .t-heading-68-30 {font-size: 30px;}
    .t-heading-80-24,
    .t-heading-68-24 {font-size: 24px;}
    .t-heading-56,
    .t-heading-40-30 {
        font-size: 30px;
        line-height: var(--lh-lg);
    }
    .t-heading-56-36 {font-size: 36px;}
    .t-heading-40 {
        font-size: 24px;
        line-height: var(--lh-lg);
    }
    .t-heading-40-18 {
        font-size: 18px;
        line-height: var(--lh-lg);
    }
    .t-heading-32 {font-size: 20px;}
    .t-heading-24 {font-size: 18px;}
    .t-heading-20-20,
    .t-heading-24-20 {font-size: 20px;}
    .t-heading-20 {font-size: 18px;}
    .t-body-24 {font-size: 20px;}
    .t-body-20 {font-size: 17px;}
    .t-body-20-14 {font-size: 14px;}
}

/* icon */
@font-face {
    font-family: nbrand-icon;
    src: url(/inc/font/icon/nbrand-icon.eot?r5hwo6);
    src: url(/inc/font/icon/nbrand-icon.eot?r5hwo6#iefix) format("embedded-opentype"), url(/inc/font/icon/nbrand-icon.ttf?r5hwo6) format("truetype"), url(/inc/font/icon/nbrand-icon.woff?r5hwo6) format("woff"),
        url(/inc/font/icon/nbrand-icon.svg?r5hwo6#nbrand-icon) format("svg");
    font-weight: 400;
    font-style: normal;
}
i {
    font-family: nbrand-icon !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: var(--lh-sm);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon-language_icon:before {color: var(--Primary-Color-White); content: "\e912";}
.icon-angle4-up:before {content: "\e90f";}
.icon-angle4-down:before {content: "\e910";}
.icon-angle4-left:before {content: "\e911";}
.icon-result_icon:before {color: #cccccb; content: "\e906";}
.icon-return_btn:before {content: "\e907";}
.icon-triangle3-right:before {content: "\e908";}
.icon-angle4-right:before {content: "\e905";}
.icon-close6:before {content: "\e900";}
.icon-download4:before {content: "\e901";}
.icon-notice_icon:before {content: "\e902";}
.icon-open:before {content: "\e903";}
.icon-outlink_arrow:before {content: "\e904";}
.icon-quotation_icon:before {color: #b0c5e0; content: "\e909";}
.icon-sound:before {content: "\e90a";}
.icon-Footer_facebook:before {content: "\e90b";}
.icon-Footer_insta:before {content: "\e90c";}
.icon-Footer_logo:before {content: "\e90d";}
.icon-Footer_youtube:before {content: "\e90e";}
.icon-access:before {content: "\e913";}
.icon-angle1-down:before {content: "\e914";}
.icon-angle1-left:before {content: "\e915";}
.icon-angle1-right:before {content: "\e916";}
.icon-angle1-up:before {content: "\e917";}
.icon-angle2-down:before {content: "\e918";}
.icon-angle2-left:before {content: "\e919";}
.icon-angle2-right:before {content: "\e91a";}
.icon-angle2-up:before {content: "\e91b";}
.icon-angle3-down:before {content: "\e91c";}
/* .icon-angle3-left:before {content: "\e91d"}*/
/* .icon-angle3-right:before {content: "\e91e"} */
.icon-angle3-up:before {content: "\e91f";}
.icon-arrow-next:before {content: "\e920";}
.icon-calendar:before {content: "\e921";}
.icon-change:before {content: "\e922";}
.icon-circle-answer:before {content: "\e923";}
.icon-circle-care:before {content: "\e924";}
.icon-circle-check1:before {content: "\e925";}
.icon-circle-check2:before {content: "\e926";}
.icon-circle-question:before {content: "\e927";}
.icon-close1:before {content: "\e928";}
.icon-close2:before {content: "\e929";}
.icon-close3:before {content: "\e92a";}
.icon-close4:before {content: "\e92b";}
.icon-close5:before {content: "\e92c";}
.icon-continue:before {content: "\e92d";}
.icon-download1:before {content: "\e92e";}
.icon-download2:before {content: "\e92f";}
.icon-ellipse:before {content: "\e930";}
.icon-file:before {content: "\e931";}
.icon-guide:before {content: "\e932";}
.icon-home:before {content: "\e933";}
.icon-link-facebook:before {content: "\e934";}
.icon-link-flickr:before {content: "\e935";}
.icon-link-instagram:before {content: "\e936";}
.icon-link-twitter:before {content: "\e937";}
.icon-link-weibo:before {content: "\e938";}
.icon-link-youtube:before {content: "\e939";}
.icon-location:before {content: "\e93a";}
.icon-lock:before {content: "\e93b";}
.icon-mailto:before {content: "\e93c";}
.icon-mike:before {content: "\e93d";}
.icon-minus:before {content: "\e93e";}
.icon-move1:before {content: "\e93f";}
.icon-move2:before {content: "\e940";}
.icon-new:before {content: "\e941";}
.icon-note:before {content: "\e942";}
.icon-notify:before {content: "\e943";}
.icon-page-front:before {content: "\e944";}
.icon-page-last:before {content: "\e945";}
.icon-picture:before {content: "\e947";}
.icon-plus:before {content: "\e948";}
.icon-print:before {content: "\e949";}
.icon-profile:before {content: "\e94a";}
.icon-schedule:before {content: "\e94b";}
.icon-share-band:before {content: "\e94e";}
.icon-share-blog:before {content: "\e94f";}
.icon-share-facebook:before {content: "\e950";}
.icon-share-flickr:before {content: "\e951";}
.icon-share-googleplus:before {content: "\e952";}
.icon-share-instagram:before {content: "\e953";}
.icon-share-kakaostory:before {content: "\e954";}
.icon-share-kakaotalk:before {content: "\e955";}
.icon-share-line:before {content: "\e956";}
.icon-share-linkedin:before {content: "\e957";}
.icon-share-mail:before {content: "\e958";}
.icon-share-naver:before {content: "\e959";}
.icon-share-pinterest:before {content: "\e95a";}
.icon-share-twitter:before {content: "\e95b";}
.icon-share-weibo:before {content: "\e95c";}
.icon-share-youtube:before {content: "\e95d";}
.icon-shop:before {content: "\e95e";}
.icon-size-down:before {content: "\e95f";}
.icon-size-up:before {content: "\e960";}
.icon-star:before {content: "\e961";}
.icon-switch:before {content: "\e962";}
.icon-talk:before {content: "\e963";}
.icon-ticket:before {content: "\e964";}
.icon-triangle1-down:before {content: "\e965";}
.icon-triangle1-left:before {content: "\e966";}
.icon-triangle1-right:before {content: "\e967";}
.icon-triangle1-up:before {content: "\e968";}
.icon-triangle2-down:before {content: "\e969";}
.icon-triangle2-left:before {content: "\e96a";}
.icon-triangle2-right:before {content: "\e96b";}
.icon-triangle2-up:before {content: "\e96c";}
.icon-movie:before {content: "\e96d";}
.icon-arrow-top:before {content: "\e96e";}
.icon-movie2:before {content: "\e96f";}
.icon-olympic:before {content: "\e970";}
.icon-paralympic:before {content: "\e971";}
.icon-move3:before {content: "\e972";}
.icon-download3:before {content: "\e973";}
.icon-print2:before {content: "\e974";}
.icon-clrd:before {content: "\e975";}
.icon-clrn:before {content: "\e976";}
.icon-dust:before {content: "\e977";}
.icon-fog:before {content: "\e978";}
.icon-haze:before {content: "\e979";}
.icon-mist:before {content: "\e97a";}
.icon-motcdd:before {content: "\e97b";}
.icon-motcdn:before {content: "\e97c";}
.icon-ovc:before {content: "\e97d";}
.icon-prtcldd:before {content: "\e97e";}
.icon-prtcldn:before {content: "\e97f";}
.icon-rain:before {content: "\e980";}
.icon-rains:before {content: "\e981";}
.icon-slt:before {content: "\e982";}
.icon-snow:before {content: "\e983";}
.icon-snows:before {content: "\e984";}
.icon-thstrm:before {content: "\e985";}
.icon-transport-bus:before {content: "\e986";}
.icon-transport-car:before {content: "\e987";}
.icon-transport-gondola:before {content: "\e988";}
.icon-transport-taxi:before {content: "\e989";}
.icon-transport-train:before {content: "\e98a";}
.icon-wd0:before {content: "\e98b";}
.icon-wd45:before {content: "\e98c";}
.icon-wd90:before {content: "\e98d";}
.icon-wd125:before {content: "\e98e";}
.icon-wd180:before {content: "\e98f";}
.icon-wd225:before {content: "\e990";}
.icon-wd270:before {content: "\e991";}
.icon-wd315:before {content: "\e992";}
.icon-introduce:before {content: "\e993";}

/* utils */
.pc-only {display: block !important;}
.mo-only {display: none !important;}
.pc-wide-only {display: none;}
.is-hidden {display: none !important;}
iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; width: 100%; height: 100%; border: none; }
@media screen and (max-width: 1023px) {
    .pc-only {display: none !important;}
    .mo-only {display: block !important;}
    .is-hidden {display: none !important;}
    .is-stack {flex-direction: column !important;}
}
@media screen and (min-width: 1600px) {
    .pc-wide-only {display: block;}
}
/* utils - padding, margin */
.pd-0 {padding: 0 !important;}
.pt-md {padding-top: 40px !important;}
.pb-0 {padding-bottom: 0 !important;}
@media screen and (max-width: 1023px) {
    .pt-md {padding-top: 28px !important;}
}
/* utils - gap, order */
[class*="gap-"] {
    display: flex;
    flex-direction: column;
}
.gap-xl {gap: 200px !important;}
.gap-lg {gap: 80px !important;}
.gap-md {gap: 40px !important;}
.gap-sm {gap: 20px !important;}
.gap-xs {}
.order-mo-first { order: initial; }
.order-mo-last { order: initial; }
@media screen and (max-width: 1023px) {
    .gap-xl {gap: 120px !important;}
    .gap-lg {gap: 44px !important;}
    .gap-md {gap: 28px !important;}
    .gap-sm {}
    .gap-xs {}
    .order-mo-first { order: 1; }
    .order-mo-last { order: 99; }
}
/* utils - flex */
.flex-col-center {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.flex-col-center-all {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
/* utils - text align */
.text-left {text-align: left;}
.text-center {text-align: center;}
.text-right {text-align: right;}
.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
}
.ellipsis2 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    max-height: calc(2.8em);
}
.ellipsis3 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    max-height: calc(4.2em);
}
.ellipsis4 {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    max-height: calc(5.6em);
}
@media screen and (min-width: 1024px) {
    .text-left-pc {text-align: left;}
}
@media screen and (max-width: 1023px) {
    .text-center-mo {text-align: center;}
}

/* utils - bacgkround color */
.bg-black {background-color: var(--Primary-Color-Black);}
.bg-red {background-color: var(--Primary-Color-Red);}
.bg-gray {background-color: var(--Secondary-Color-Black_Natural);}
/* utils - font color */
.color-white {color: var(--Primary-Color-White);}
.color-black {color: var(--Primary-Color-Black);}
.color-red {color: var(--Primary-Color-Red);}
.color-blue {color: var(--Primary-Color-Blue);}
.color-lightgray {color: var(--Secondary-Color-Black_666666);}
.color-gray {color: var(--Secondary-Color-Black_777777)}
/* utils - aspect-ratio */
.media-ratio-16x9 { aspect-ratio: 16/9; }
.media-ratio-1x1 { aspect-ratio: 1/1; }
.media-ratio-71x40 { aspect-ratio: 71/40; }
[class*="media-ratio-"] {
    overflow: hidden;
    position: relative;
}
[class*="media-ratio-"] img,
[class*="media-ratio-"] video {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
}
/* [DESC] sr-only 등등 같은 속성으로 다른 클래스명 가진거 있나 확인하고 통일하기 */
.visually-hidden { overflow: hidden; position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; clip: rect(0, 0, 0, 0); }

/* skip navigation */
.skip-navigation {width: 100%;}
.skip-navigation a {
    overflow: hidden;
    position: absolute;
    top: -100px;
    z-index: 9999;
    width: 100%;
    padding: calc(constant(safe-area-inset-top) + 30px) 30px 30px 30px;
    padding: calc(env(safe-area-inset-top) + 30px) 30px 30px 30px;
    background: var(--Primary-Color-Black);
    color: var(--Primary-Color-White);
    text-align: center;
    font-weight: 600;
}
.skip-navigation a:hover, .skip-navigation a:focus, .skip-navigation a:active {top: 0;}

/* header */
.header-wrap {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    height: 70px;
    padding-top: calc(env(safe-area-inset-top));
    border-bottom: 1px solid var(--Line-Color-Line_01);
    background-color: var(--Primary-Color-White);
    transition: all 0.2s;
    opacity: 1;
}
.header-wrap.scroll-on {top: -70px;}
.header-wrap.scroll-ing {opacity: 0.8;}
.header-cont {
    display: flex;
    position: relative;
    z-index: 2;
    width: 100%;
}
.header-cont .logo {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 70px;
    transform: translate(-50%, -50%);
    order: 2;
}
.header-cont .logo a {
    display: flex;
    height: 70px;
    align-items: center;
}
.header-cont .gnb-outlink:after {
    display: block !important;
    position: absolute;
    top: 47%;
    right: 8px;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-link.svg) no-repeat center !important;
    content: "";
    transform: translateY(-50%);
}
.header-cont .gnb-outlink.on:after,
.header-cont .gnb-outlink:hover:after,
.header-cont .gnb-outlink:active:after {background: url(/inc/images/icon/icon-link_red.svg) no-repeat center !important;}
.header-cont .gnb-outlink:focus {color: var(--Secondary-Color-Black_555555) !important;}
.header-cont .gnb-outlink:focus:after {background: url(/inc/images/icon/icon-link.svg) no-repeat center !important;}
.header-cont .gnb-outlink:focus:hover {color: var(--Primary-Color-Red) !important;}
.header-cont .gnb-outlink:focus:hover:after {background: url(/inc/images/icon/icon-link_red.svg) no-repeat center !important;}
.header-cont .utile-wrap {
    overflow: hidden;
    position: absolute;
    top: 50%;
    right: 0;
    height: 70px;
    order: 3;
    transform: translate(0, -50%);
}
.header-cont .utile-wrap .lang-btn {
    width: 60px;
    height: 70px;
    padding: 10px;
    background: url(/inc/images/icon/icon-language.svg) no-repeat;
    text-align: left;
    background-position: center right 10px;
    background-size: 17px 17px;
    font-size: 14px;
}
.header-cont .utile-wrap .lang-btn:hover {
    width: 60px;
    height: 70px;
    padding: 10px;
    background: url(/inc/images/icon/icon-language_red.svg) no-repeat;
    text-align: left;
    background-position: center right 10px;
    background-size: 17px 17px;
    font-size: 14px;
}
.header-cont .utile-wrap .lang-btn span {
    display: block;
    padding-top: 2px;
}
.header-cont .utile-wrap .lang-btn:hover span {color: var(--Primary-Color-Red);}
.header-cont .utile-wrap .login-btn {
    width: 68px;
    height: 70px;
    background: url(/inc/images/icon/icon-myinfo.svg) no-repeat center center;
}
.header-cont .utile-wrap .alarm-btn {
    position: relative;
    width: 68px;
    height: 70px;
    background: url(/inc/images/icon/icon-myinfo.svg) no-repeat center center;
}
.header-cont .utile-wrap .alarm-btn:hover {background: url(/inc/images/icon/icon-myinfo_red.svg) no-repeat center center;}
.header-cont .utile-wrap .alarm-btn.on:after {
    display: block;
    position: absolute;
    top: 50%;
    right: 50%;
    width: 6px;
    height: 6px;
    content: "";
    margin-right: -13px;
    margin-top: -13px;
    border-radius: 100%;
    background-color: var(--Primary-Color-Red);
}
.header-cont .utile-cont {
    display: flex;
    height: 70px;
}
.header-cont .nav-btn {
    display: flex;
    width: 68px;
    height: 70px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    order: 1;
    gap: 2.5px;
    /* background: url(/inc/images/icon/icon-menu_btn.svg) no-repeat center center; */
    transition: gap 0.2s;
}
.header-cont .nav-btn .line {
    width: 15px;
    height: 2.5px;
    background: var(--Primary-Color-Black);
    transition: all 0.2s;
}
.header-cont .nav-btn:hover .line {
    width: 15px;
    height: 2.5px;
    background: var(--Primary-Color-Red);
    transition: all 0.2s;
}
.header-cont .nav-btn.on {gap: 0;}
.header-cont .nav-btn.on .line {height: 2px;}
.header-cont .nav-btn.on .line:nth-child(1) {
    margin-top: 2px;
    transform: rotateZ(45deg);
}
.header-cont .nav-btn.on .line:nth-child(2) {display: none;}
.header-cont .nav-btn.on .line:nth-child(3) {
    margin-top: -2px;
    transform: rotateZ(-45deg);
}
.header-wrap .nav-wrap {
    display: none;
    overflow: hidden;
    position: absolute;
    top: 70px;
    left: 0;
    width: 100vw;
    max-height: calc(100vh - 70px);
    background-color: var(--Primary-Color-White);
    border-bottom: 1px solid var(--Line-Color-Line_01);
}
.header__event-wrap {padding: 48px 24px 60px 24px;}
.header__event-wrap.hide {display: none;}
.header__event-wrap .header__event-area {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}
.header__event-wrap [class*="header__event-item"] {
    overflow: hidden;
    position: relative;
    width: 100%;
    flex: 1;
    min-width: 264px;
}
.header__event-wrap .img-area {
    position: relative;
    height: 534px;
}
.header__event-wrap .img-area img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: 100%;
    min-width: 100%;
    transform: translate(-50%, -50%);
}
.header__event-wrap .text-area {
    position: absolute;
    bottom: -58px;
    left: 0;
    width: 100%;
    color: var(--Primary-Color-White);
    transition: bottom 0.5s;
}
.header__event-wrap [class*="header__event-item"]:active .text-area,
.header__event-wrap [class*="header__event-item"]:hover .text-area,
.header__event-wrap [class*="header__event-item"]:focus .text-area {bottom: 0;}
.header__event-wrap [class*="header__event-item"]:active .link-area,
.header__event-wrap [class*="header__event-item"]:hover .link-area,
.header__event-wrap [class*="header__event-item"]:focus .link-area {margin-top: 0;}
.header__event-wrap .text-area h3 {
    padding: 0 24px;
    font-family: var(--font-head);
    font-size: 28px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.header__event-wrap .text-area p {
    padding: 0 24px 24px 24px;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.header__event-wrap .link-area {
    display: flex;
    width: 100%;
    padding: 14px;
    background: var(--Primary-Color-Red);
    justify-content: center;
    margin-top: 10px;
    gap: 24px;
    transition: margin 0.2s;
}
.header__event-wrap .link-area a {
    display: flex;
    color: var(--Primary-Color-White);
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-weight: 700;
}
.header__event-wrap .link-area a span {
    width: 16px;
    height: 16px;
}
.header__event-wrap .link-area a span.icon-link-wh {margin-top: -3px;}
.gnb__tab-cont-wrap .link-btn-full,
.header__event-wrap .link-btn-full {display: block;}
.sitemap-wrap .mo-title {display: none;}
@media screen and (max-width: 1023px) {
    .header-wrap {z-index: 1000;}
    .header-cont {justify-content: flex-start;}
    .header-wrap.menu-on .logo {
        animation: fadeout 0.3s;
        animation-fill-mode: forwards;
    }
    .header-cont .logo a img {height: 24px;}
    .header-cont .nav-wrap {
        overflow: auto;
        position: absolute;
        width: 100vw;
        height: 100vh;
        padding: 0 0 calc(constant(safe-area-inset-bottom));
        padding: 0 0 calc(env(safe-area-inset-bottom));
        background: var(--Primary-Color-White);
    }
    .header-wrap.menu-on .nav-wrap {display: block;}
    .header__event-wrap {
        width: 100%;
        padding: 72px 0 30px 0;
    }
    .header__event-wrap .header__event-area {
        padding: 0 24px;
        overflow-x: auto;
    }
    [class*='header__event-item'] {
        padding: 0 0 10px 0;
        scroll-snap-align: start;
    }
    .header__event-wrap .img-area {
        overflow: hidden;
        position: relative;
        width: 100%;
        height: 218px;
    }
    .header__event-wrap .img-area img {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        height: auto;
        transform: translate(-50%, -50%);
    }
    .header__event-wrap .text-area {
        position: static;
        bottom: 0;
        color: var(--Primary-Color-Black);
    }
    .header__event-wrap .text-area h3 {
        padding: 8px 0 0 0;
        font-size: 20px;
        line-height: var(--lh-lg);
    }
    .header__event-wrap .text-area p {
        padding: 4px 0 0 0;
        font-size: 14px;
        line-height: var(--lh-lg);
    }
    .header__event-wrap .link-area {display: none;}
    .header-cont .utile-wrap {padding-right: 14px;}
    .header-cont .utile-wrap .lang-btn {
        width: 50px;
        padding: 10px 0;
    }
    .header-cont .utile-wrap .login-btn,
    .header-cont .utile-wrap .alarm-btn {width: 40px;}
    .header-cont .gnb-outlink:after {right: 24px;}
    .header-cont .gnb-outlink:focus:hover {color: var(--Secondary-Color-Black_555555) !important;}
    .header-cont .gnb-outlink:focus:hover:after {background: url(/inc/images/icon/icon-link.svg) no-repeat center !important;}
}

/* [DESC] 확인하고 지우기 */
@media screen and (min-width: 1920px) {
    .header__event-wrap .img-area {
        height: auto;
        aspect-ratio: 619/524;
    }
}
.navigation_bar-wrap {
    position: absolute;
    top: 70px;
    left: 0;
    width: 100%;
    height: 48px;
    background: var(--Primary-Color-White);
    border-bottom: 1px solid var(--Line-Color-Line_02);
}
.navigation_bar {
    display: flex;
    justify-content: space-between;
}
.navigation_bar-wrap .gage.on {
    --bar: 0;
    display: block;
    position: relative;
    z-index: 99;
    width: calc(var(--bar));
    height: 4px;
    content: "";
    background-color: var(--Primary-Color-Red);
}
.navigation-btn {
    position: relative;
    height: 48px;
    padding: 0 24px;
    color: var(--Primary-Color-Black);
    font-size: 16px;
    font-weight: 700;
    line-height: var(--lh-lg);
    font-family: var(--font-text);
}
.navigation-btn:hover {color: var(--Primary-Color-Red);}
.navigation-btn::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 20px;
    height: 20px;
    background: url(/inc/images/icon/icon-arrow01_down.svg) no-repeat center;
    content: "";
    transform: translateY(-50%);
    transition: transform 0.2s;
}
.navigation-btn:hover::after {
    background: url(/inc/images/icon/icon-arrow01_down_red.svg) no-repeat center;
    background-size: 16px 16px;
}
.navigation-btn.on:after {transform: translateY(-50%) rotate(-180deg);}
.navigation-btn.no-sub {pointer-events: none;}
.navigation-btn.no-sub::after {display: none;}
.navigation-menu {
    display: none;
    position: absolute;
    z-index: 5;
    width: 100vw;
    background: var(--Primary-Color-White);
}
.navigation-menu a {
    display: flex;
    position: relative;
    width: 100%;
    height: 60px;
    padding: 0 24px;
    color: var(--Primary-Color-Black);
    text-align: left;
    border-bottom: 1px solid var(--Line-Color-Line_01);
    align-items: center;
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.navigation-menu a::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 24px;
    width: 20px;
    height: 20px;
    background: url(/inc/images/icon/icon-arrow01_right_gray.svg) no-repeat center;
    content: "";
    transform: translateY(-50%);
}
.navigation-menu a.on,
.navigation-menu a:focus,
.navigation-menu a:active {
    background: var(--Secondary-Color-Black_Natural);
    color: var(--Primary-Color-Red);
}
.navigation-menu a:hover {background: var(--Secondary-Color-Black_Natural);}
.navigation-menu a.on::after,
.navigation-menu a:focus::after,
.navigation-menu a:active::after {background: url(/inc/images/icon/icon-arrow01_right_red.svg) no-repeat center;}
.navigation-menu a.active {
    color: var(--Primary-Color-Red);
    /* background: var(--Primary-Color-Red); */
}
.navigation-menu a.active::after {background: none;}
.navigation-menu a.active:hover::after {/* background: url(/inc/images/icon/icon-arrow01_right_red.svg) no-repeat center; */}
.navigation-menu a.gnb-outlink:hover {color: var(--Primary-Color-Black) !important;}
.navigation-menu a.gnb-outlink:hover:after {background: url(/inc/images/icon/icon-link.svg) no-repeat center !important;}
.navigation-menu a.gnb-outlink:focus {background: var(--Primary-Color-White) !important;}
.navigation-menu a.gnb-outlink:focus:hover { background: var(--Secondary-Color-Black_Natural) !important;color: var(--Primary-Color-Black) !important;}
.rending-wrap {
    display: flex;
    gap: 20px;
}
.rending-wrap button {
    display: block;
    position: relative;
    height: 48px;
    color: var(--Secondary-Color-Black_555555);
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.rending-wrap button.on {
    color: var(--Primary-Color-Black);
    font-weight: 700;
}
.rending-wrap button:after {
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    content: "";
    background-color: var(--Primary-Color-Black);
    transform: translateX(-50%);
    transition: width 0.2s;
}
.rending-wrap button.on:after {width: 100%;}
.rending-wrap button:hover {color: var(--Primary-Color-Black);}
.navigation_bar .sharing-btn {
    position: relative;
    width: 16px;
    height: 16px;
    padding-right: 48px;
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .sharing-btn::after {
    display: block;
    position: absolute;
    top: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-share.svg) no-repeat center;
    content: "";
    transform: translateY(-50%);
    background-size: 16px;
}
.navigation_bar .sharing-btn:hover {color: var(--Primary-Color-Red);}
.navigation_bar .sharing-btn:hover::after {background: url(/inc/images/icon/icon-share_red.svg) no-repeat center;}
.navigation_bar .btn-write-post {
    position: relative;
    width: 32px;
    height: 48px;
    color: transparent;
    padding-right: 0;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .btn-write-post::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-write-black.svg) no-repeat center;
    content: "";
    background-size: 16px;
    transform: translate(-50%, -50%);
}
.navigation_bar .btn-create-comm {
    position: relative;
    width: 32px;
    height: 48px;
    color: transparent;
    padding-right: 0;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .btn-create-comm::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-comm-black.svg) no-repeat center;
    content: "";
    transform: translate(-50%, -50%);
    background-size: 16px;
}
.navigation_bar .btn-my-comm {
    position: relative;
    width: 32px;
    height: 48px;
    color: transparent;
    padding-right: 0;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .btn-my-comm::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-my-comm-black.svg) no-repeat center;
    content: "";
    transform: translate(-50%, -50%);
    background-size: 16px;
}
.navigation_bar .btn-join-comm {
    position: relative;
    width: 32px;
    height: 48px;
    color: transparent;
    padding-right: 0;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .btn-join-comm::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-check-comm-black.svg) no-repeat center;
    content: "";
    transform: translate(-50%, -50%);
    background-size: 16px;
}
.navigation_bar .btn-point {
    position: relative;
    width: 32px;
    height: 48px;
    color: transparent;
    padding-right: 0;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .btn-point::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-point-black.svg) no-repeat center;
    content: "";
    transform: translate(-50%, -50%);
    background-size: 16px;
}
.navigation_bar .btn-my-challenge {
    position: relative;
    width: 32px;
    height: 48px;
    color: transparent;
    padding-right: 0;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.navigation_bar .btn-my-challenge::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-challenge-black.svg) no-repeat center;
    content: "";
    background-size: 16px;
    transform: translate(-50%, -50%);
}
.navigation_bar .navigation-item01 {
    flex-grow: 1;
    flex-basis: 0;
}
.navigation_bar .navigation-item03 {
    display: flex;
    margin: auto 0;
    flex-grow: 1;
    flex-basis: 0;
    justify-content: flex-end;
}
.btn-navi-wrap {
    display: flex;
    gap: 16px;
    align-items: center;
}
.btn-navi-wrap .btn-box { display: flex; }
.btn-navi-wrap .btn-box:last-child {margin-right: 16px;}
.btn-navi-wrap .btn-box .btn {
    padding: 5px 12px;
    font-size: 16px;
    line-height: 22px;
}
.btn-navi-wrap .btn-box .btn:not(:last-child) { margin-right: 16px; }
.btn-navi-wrap .btn[class*="-primary"] [class*="btn-icon16"] {margin-left: 8px;}
.btn-navi-wrap .btn [class*=btn-icon] {margin-bottom: -3px;}
:lang(ko) {
    .btn-navi-wrap .btn [class*=btn-icon] {margin-bottom: -4px;}
}
.navigation_bar .btn-history-back {
    position: absolute;
    top: 72px;
    left: 24px;
}
.navigation_bar .btn-history-back .btn-back {
    display: block;
    width: 80px;
    height: 80px;
    background: url(/inc/images/icon/icon-arrow02_left.svg) no-repeat 50%;
    background-size: 48px;
    background-color: rgba(255, 255, 255, 0.5);
}
.navigation_bar .btn-history-back .btn-back:after {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
}
.navigation_bar .btn-history-back .btn-back:hover {
    background: url(/inc/images/icon/icon-arrow02_left_red.svg) no-repeat 50%;
    background-size: 48px;
}
@media screen and (max-width: 1023px) {
    .navigation-item02.nav-mo .rending-wrap {
        display: block;
        padding: 20px 24px 32px 24px;
        border-bottom: 1px solid var(--Line-Color-Line_01);
    }
    .navigation-item02.nav-mo .rending-wrap button {height: 20px;}
    .navigation-item02.nav-mo .rending-wrap li:not(:first-child) {padding-top: 20px;}
    .navigation_bar .navigation-item03 {
        flex-grow: 0;
        flex-basis: auto;
    }
    .navigation_bar {display: block;}
    .navigation_bar .navigation-item01 {
        position: relative;
        z-index: 1;
    }
    .navigation_bar .navigation-item02 {
        width: 100%;
        /* height: 48px; */
        padding: 0 24px;
        overflow-x: scroll;
        background-color: var(--Primary-Color-White);
    }
    .navigation_bar .navigation-item02 .rending-wrap {flex-wrap: nowrap;}
    .navigation_bar .navigation-item02 .rending-wrap {width: max-content;}
    .navigation_bar .navigation-item03 {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 10;
    }
    .btn-navi-wrap {gap: 0px;}
    .btn-navi-wrap.mo-only .btn-box {
        display: flex;
        margin-right: 0;
    }
    .btn-navi-wrap.mo-only .btn-box .btn {
        display: block;
        width: 50%;
        padding: 12px 16px;
        border-radius: 0;
        font-size: 14px;
        line-height: var(--lh-sm);
    }
    .btn-navi-wrap.mo-only .btn-box .btn:not(:last-child) {margin-right: 0;}
    .btn-navi-wrap.mo-only .btn-box .btn [class*='btn-icon'] {position: absolute;}
    .navigation_bar-wrap .btn-navi-sub {
        height: 60px;
        background-color: var(--Primary-Color-White);
    }
    .navigation_bar-wrap .btn-navi-sub .inner {
        display: flex;
        justify-content: space-between;
        padding-left: 3px;
    }
    .navigation_bar-wrap .btn-navi-sub .btn-prev-page a {
        display: flex;
        width: 60px;
        height: 60px;
        align-items: center;
        justify-content: center;
        /* background-color: rgba(0, 0, 0, 0.1); */
    }
    .navigation_bar-wrap .btn-navi-sub .btn-prev-page a::after {
        display: block;
        width: 24px;
        height: 24px;
        content: '';
        background-color: var(--Primary-Color-Black);
        mask-image: url(/inc/images/icon/icon-arrow-dash-w.svg);
        mask-repeat: no-repeat;
        mask-size: contain;
    }
    .navigation_bar-wrap .btn-navi-sub .btn-prev-page a:hover {background-color: var(--Primary-Color-Red);}
    .navigation_bar-wrap .btn-navi-sub .btn-prev-page a:hover::after {background-color: var(--Primary-Color-White);}
    .navigation_bar-wrap .btn-navi-sub .info-box-option {
        display: flex;
        height: 60px;
        align-items: center;
        padding-right: 24px;
    }
    .navigation_bar-wrap .btn-navi-sub .info-box-option .selectbox-wrap.type-setting {padding-right: 24px;}
    .navigation_bar .sharing-btn {
        overflow: hidden;
        width: 32px;
        height: 48px;
        color: transparent;
        font-size: xx-small;
    }
    .navigation_bar .sharing-btn::after {right: 24px;}
    .navigation_bar .btn-history-back {
        top: 47px;
        left: 0;
    }
    .navigation_bar .btn-history-back .btn-back {
        width: 48px;
        height: 48px;
        background-size: 24px;
    }
    .navigation_bar .btn-history-back .btn-back:hover {background-size: 24px;}
}
/* snb */
.content-wrap {
    --header-height: 70px;
    --navi-height: 48px;
}
.header-wrap:has(.navigation_bar-wrap) + .content-wrap .content-area {padding-top: var(--navi-height)}
.header-wrap:has(.navigation-item02) + .content-wrap .content-area {padding-top: var(--navi-height)}
.header-wrap:has(.cp-commu-layout__lnb) + .content-wrap .content-area { padding-top: var(--navi-height)}
@media screen and (max-width: 1023px) {
    .header-wrap:has(.navigation_bar-wrap) + .content-wrap .content-area { padding-top: var(--navi-height)}
    .header-wrap:has(.navigation-item02) + .content-wrap .content-area { padding-top: calc(var(--navi-height) * 2) }
    .header-wrap:has(.cp-commu-layout__lnb) + .content-wrap .content-area { padding-top: calc(var(--navi-height) * 2) }
}

/* gnb 1dep*/
.mo-gnb__back-btn {display: none;}
.gnb__tab-btn-wrap {
    display: flex;
    padding: 8px 24px 0 24px;
    gap: 40px;
}
.gnb__tab-btn-wrap [class^="gnb__tab-btn"] {
    position: relative;
    padding: 8px 24px 8px 0;
    color: var(--Secondary-Color-Black_555555);
    text-align: left;
    border-bottom: 0px solid var(--Primary-Color-White);
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
    transition: border-color 1s;
}
.gnb__tab-btn-wrap [class^="gnb__tab-btn"]::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    width: 20px;
    height: 20px;
    background: url(/inc/images/icon/icon-arrow01_down_gray.svg) no-repeat center;
    content: "";
    transform: translateY(-50%);
}
.gnb__tab-btn-wrap a[class^="gnb__tab-btn"]::after { display: none; }
.gnb__tab-btn-wrap li>a[class^="gnb__tab-btn"] {padding-right: 0;}
.gnb__tab-btn-wrap [class*="gnb__tab-btn"].on,
.gnb__tab-btn-wrap [class*="gnb__tab-btn"]:hover,
.gnb__tab-btn-wrap [class*="gnb__tab-btn"]:active,
.gnb__tab-btn-wrap [class*="gnb__tab-btn"]:focus {color: var(--Primary-Color-Red);}
.gnb__tab-btn-wrap button[class^="gnb__tab-btn"].on::after,
.gnb__tab-btn-wrap button[class*="gnb__tab-btn"]:hover:after,
.gnb__tab-btn-wrap button[class*="gnb__tab-btn"]:active:after,
.gnb__tab-btn-wrap button[class*="gnb__tab-btn"]:focus:after {background: url(/inc/images/icon/icon-arrow01_down_red.svg) no-repeat center;}
/* gnb 1dep cont*/
.gnb__tab-cont-wrap [class*="gnb__tab-cont"] {
    display: none;
    overflow: hidden;
    width: 100%;
    padding: 48px 24px 60px 24px;
    /* animation: fadeout 0.3s; */
    /* animation-fill-mode: forwards; */
}
.gnb__tab-cont-wrap [class*="gnb__tab-cont"].on {
    display: flex;
    width: 100%;
    gap: 30px;
    justify-content: space-between;
    animation: fadein 0.3s;
    animation-fill-mode: forwards;
}
.gnb__tab-cont-wrap .gnb-content__dep2 {
    overflow: hidden;
    position: relative;
    margin-left: 20px;
}
/* gnb 3 depth type */
.gnb__panel-depth3 .gnb__tab02-wrap .gnb__panel03 {
    width: calc(100vw / 4 - 48px);
    overflow-y: auto;
    max-height: calc(100vh - 234px);
}
.gnb__panel-depth3 .gnb-content__dep2 {
    flex: 0 1 calc(100vw / 4);
    margin-left: 0;
}
.gnb-content__dep2 .img-area {
    overflow: hidden;
    position: relative;
    height: 100%;
}
.gnb-content__dep2 .img-area img {
    position: relative;
    left: 50%;
    width: auto;
    height: 100%;
    min-width: 100%;
    transform: translate(-50%, 0);
}
.gnb-content__dep2 .text-area {
    position: absolute;
    bottom: -58px;
    left: 0;
    width: 100%;
    color: var(--Primary-Color-White);
    transition: bottom 0.5s;
}
.gnb-content__dep2:active .text-area,
.gnb-content__dep2:hover .text-area,
.gnb-content__dep2:focus .text-area {bottom: 0;}
.gnb-content__dep2:active .link-area,
.gnb-content__dep2:hover .link-area,
.gnb-content__dep2:focus .link-area {margin-top: 0;}
.gnb-content__dep2 .text-area h3 {
    padding: 0 24px;
    font-family: var(--font-head);
    font-size: 28px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.gnb-content__dep2 .text-area p {
    padding: 8px 24px 24px 24px;
    text-align: left;
    font-family: var(--font-head);
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.gnb-content__dep2 .link-area {
    display: flex;
    width: 100%;
    padding: 14px;
    background: var(--Primary-Color-Red);
    margin-top: 10px;
    gap: 24px;
    justify-content: center;
    transition: margin 0.2s;
}
.gnb-content__dep2 .link-area a {
    display: flex;
    color: var(--Primary-Color-White);
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.gnb-content__dep2 .link-area a span {
    width: 16px;
    height: 16px;
}
.gnb-content__dep2 .link-area a span.icon-link-wh {margin-top: -3px;}
.gnb__tab02-wrap {flex: 1;}
.gnb__tab02-wrap {
    display: flex;
    /* flex: 0 0 50%; */
    gap: 30px;
}
.gnb__tab02-wrap .gnb__tab02,
.gnb__tab02-wrap .gnb__panel02,
.gnb__tab02-wrap .gnb__panel03 {width: calc(100vw / 4 - 48px);}
.gnb__tab02-wrap.thumbnail-ui .gnb__panel02,
.gnb__tab02-wrap.thumbnail-ui .gnb__panel03 {width: calc(75vw - 24px);}
.gnb__tab02-wrap.thumbnail-ui+.gnb-content__dep2 {display: none;}
.gnb__tab02-wrap [class*="gnb__tab02-btn"] {
    display: flex;
    position: relative;
    width: 100%;
    height: 60px;
    color: var(--Secondary-Color-Black_555555);
    text-align: left;
    align-items: center;
    border-top: 1px solid var(--Line-Color-Line_01);
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.gnb__tab02-wrap button[class*="gnb__tab02-btn"]::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 24px;
    width: 20px;
    height: 20px;
    background: url(/inc/images/icon/icon-arrow01_right_gray.svg) no-repeat center;
    content: "";
    transform: translateY(-50%);
}
.gnb__tab02-wrap a[class*="gnb__tab02-btn"]::after {display: none;}
.gnb__tab02-wrap [class*="gnb__tab02-btn"].on,
.gnb__tab02-wrap [class*="gnb__tab02-btn"].active,
.gnb__tab02-wrap [class*="gnb__tab02-btn"]:hover,
.gnb__tab02-wrap [class*="gnb__tab02-btn"]:focus,
.gnb__tab02-wrap [class*="gnb__tab02-btn"]:active {color: var(--Primary-Color-Red);}
.gnb__tab02-wrap [class*="gnb__tab02-btn"].on::after,
.gnb__tab02-wrap [class*="gnb__tab02-btn"]:hover::after,
.gnb__tab02-wrap [class*="gnb__tab02-btn"]:focus::after,
.gnb__tab02-wrap [class*="gnb__tab02-btn"]:active::after {background: url(/inc/images/icon/icon-arrow01_right_red.svg) no-repeat center;}
.gnb__tab02-wrap [class*="gnb__tab02-btn"].active::after {background: url(/inc/images/icon/icon-circle_red.svg) no-repeat center;}
.gnb__tab02-wrap [class*="gnb__tab02-btn"].active:hover::after {background: url(/inc/images/icon/icon-arrow01_right_red.svg) no-repeat center;}
.gnb__tab02-wrap.dep3_on {flex: 1;}
.gnb__tab02-wrap.dep3_on+.gnb-content__dep2 {display: none;}
.gnb__tab02-wrap.dep3_on .gnb__tab02 {width: 25%;}
.gnb__panel02,
.gnb__panel03 {
    max-height: calc(100vh - 234px);
    overflow-y: auto;
}
.gnb__panel02>div,
.gnb__panel03>div {display: none;}
.gnb__panel02>div.on,
.gnb__panel03>div.on {
    display: block;
    animation: fadein 0.3s;
    animation-fill-mode: forwards;
}
.gnb__panel02 .type-thumbnail,
.gnb__panel03 .type-thumbnail {
    display: none;
    width: calc(75vw - 28px);
}
.gnb__panel02 .type-thumbnail ul,
.gnb__panel03 .type-thumbnail ul {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.gnb__panel02 .type-thumbnail li,
.gnb__panel03 .type-thumbnail li {
    display: flex;
    width: calc(100% / 3 - 8px);
    padding: 24px 12px 58px 12px;
    background: var(--Secondary-Color-Black_Natural);
    align-items: center;
    justify-content: center;
}
.gnb__panel02 .type-thumbnail li:hover,
.gnb__panel03 .type-thumbnail li:hover {background: var(--Primary-Color-Blue);}
.gnb__panel02 .img-area,
.gnb__panel03 .img-area {
    width: 136px;
    height: 102px;
    margin: 0 auto;
}
.gnb__panel02 .text-area,
.gnb__panel03 .text-area {margin-top: 16px;}
.gnb__panel02 .text-area h3,
.gnb__panel03 .text-area h3 {
    text-align: center;
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.gnb__panel02 .text-area p,
.gnb__panel03 .text-area p {
    text-align: center;
    margin-top: 4px;
    font-size: 14px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.gnb__panel02 .link-area,
.gnb__panel03 .link-area {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 16px;
}
.gnb__panel02 .link-area .link-btn,
.gnb__panel03 .link-area .link-btn {
    display: flex;
    height: 32px;
    text-align: left;
    gap: 3px;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
}
.gnb__panel02 .link-area .link-btn span,
.gnb__panel03 .link-area .link-btn span {
    display: block;
    width: 16px;
    height: 16px;
}
.gnb__panel02 .link-area .link-btn .icon-link,
.gnb__panel03 .link-area .link-btn .icon-link {
    background: url(/inc/images/icon/icon-link.svg);
    margin-top: -2px;
}
.gnb__panel02 .link-area .link-btn:hover,
.gnb__panel03 .link-area .link-btn:hover {color: var(--Primary-Color-Red);}
.gnb__panel02 .link-area .link-btn:hover .icon-right,
.gnb__panel03 .link-area .link-btn:hover .icon-right {
    background: url(/inc/images/icon/icon-arrow01_right_red.svg) no-repeat center;
    background-size: 16px 16px;
}
@media screen and (max-width: 1023px) {
    /* .gnb__tab-cont-wrap,
    .gnb__panel02 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        background-color: var(--Primary-Color-White);
      } */
    .gnb__tab-btn-wrap {
        position: relative;
        padding: 8px 0 0 0;
        flex-direction: column;
        gap: 0px;
        /* overflow-y: auto; */
        /* height: calc(100vh - 370px); */
        /* z-index: 1; */
    }
    .gnb__tab-btn-wrap [class*='gnb__tab-btn'] {
        position: relative;
        width: 100%;
        padding: 16px 24px;
        color: var(--Secondary-Color-Black_555555);
        text-align: left;
        border-bottom: 1px solid var(--Line-Color-Line_01);
        line-height: var(--lh-lg);
        font-family: var(--font-head);
        font-size: 20px;
    }
    .gnb__tab-btn-wrap li:last-of-type [class*='gnb__tab-btn'] {border-bottom: 0;}
    .gnb__tab-btn-wrap [class*='gnb__tab-btn']::after {
        position: absolute;
        top: 50%;
        right: 24px;
        width: 20px;
        height: 20px;
        transform: translateY(-50%);
        background-image: url(/inc/images/icon/icon-arrow01_right_gray_12.svg);
        background-position: center center;
        background-repeat: no-repeat;
    }
    .gnb__tab-btn-wrap a[class*='gnb__tab-btn']::after {background: url(/inc/images/icon/icon-link_gray.svg) no-repeat center top 1px;}
    .gnb__tab-btn-wrap li > a[class^='gnb__tab-btn'] {padding: 16px 24px;}
    .gnb__tab-btn-wrap [class*='gnb__tab-btn'].on {
        color: var(--Primary-Color-Red);
        border-bottom: 1px solid var(--Line-Color-Line_01);
    }
    .gnb__tab-btn-wrap button[class^='gnb__tab-btn'].on::after,
    .gnb__tab-btn-wrap button[class*='gnb__tab-btn']:hover:after,
    .gnb__tab-btn-wrap button[class*='gnb__tab-btn']:active:after,
    .gnb__tab-btn-wrap button[class*='gnb__tab-btn']:focus:after {
        background-image: url(/inc/images/icon/icon-arrow01_bottom_red_12.svg);
    }
    .gnb__tab-btn-wrap [class*='gnb__tab-btn'].active {
        color: var(--Primary-Color-Red);
        border-bottom: 1px solid var(--Line-Color-Line_01);
    }
    .gnb__tab-btn-wrap [class*='gnb__tab-btn'].active::after {background: url(/inc/images/icon/icon-circle_red.svg) no-repeat center;}
    .gnb__tab-cont-wrap {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        /* height: calc(100vh - 70px); */
        background-color: var(--Primary-Color-White);
    }
    .gnb__tab02-wrap.thumbnail-ui {/* height: calc(100vh - 92px); */}
    .gnb__tab02-wrap.thumbnail-ui .gnb__panel02,
    .gnb__tab02-wrap.thumbnail-ui .gnb__panel03 {
        width: 100%;
        height: 100%;
    }
    .gnb__tab02,
    .gnb__tab02_3 {/* padding-top: 82px; */}
    .gnb__tab-cont-wrap [class*='gnb__tab-cont'] {
        padding: 0 0 20px 0;
        /* height: calc(100vh - 70px); */
        background-color: var(--Primary-Color-White);
    }
    .gnb__tab-cont-wrap [class*='gnb__tab-cont'].on {
        display: block;
        padding: 0 0 20px 0;
        min-height: calc(100vh - 70px);
        background-color: var(--Primary-Color-White);
        /* height: 100%; */
    }
    .gnb__tab-cont-wrap [class*='gnb__tab-cont'] > * {
        width: 100%;
        flex: none;
    }
    /* gnb 3 depth type */
    .gnb__panel-depth3 .gnb__tab02-wrap .gnb__panel03 {
        display: none;
        z-index: 2;
        max-height: none;
    }
    .gnb__panel-depth3 .gnb-content__dep2 {flex: unset;}
    .gnb__tab02-wrap {
        display: flex;
        position: relative;
        z-index: 1;
        justify-content: flex-start;
        flex-direction: column;
        gap: 0;
    }
    .gnb__tab02 {order: 2;}
    .gnb__tab02-wrap .gnb__tab02,
    .gnb__tab02-wrap .gnb__tab02_3,
    .gnb__tab-cont03 .gnb__tab02-wrap .gnb__panel02,
    .gnb__tab-cont03 .gnb__tab02-wrap .gnb__panel03 {
        width: 100%;
        /* height: calc(100vh - 360px);
        overflow-y: auto; */
        background-color: var(--Primary-Color-White);
    }
    .gnb__panel02 > div.on,
    .gnb__panel03 > div.on {
        display: flex;
        flex-direction: column;
    }
    .gnb__panel02 > div.on .gnb__tab02_3,
    .gnb__panel03 > div.on .gnb__tab02_3 {order: 2;}
    .sitemap-wrap .mo-title {
        display: block;
        position: relative;
        top: 0;
        left: 0;
        z-index: 2;
        width: calc(100% - 56px);
        padding: 20px 0 20px 0;
        background: var(--Primary-Color-White);
        color: var(--Primary-Color-Black);
        text-align: left;
        order: 1;
        margin-left: 56px;
        font-family: var(--font-head);
        font-size: 30px;
        font-weight: 700;
        line-height: var(--lh-lg);
    }
    .sitemap-wrap .mo-title[aria-hidden='true'] {display: none;}
    .mo-gnb__back-btn {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        /* width: 100%; */
        height: 82px;
        padding: 20px 0 20px 56px;
        background: url(/inc/images/icon/icon-gnb_back.svg) no-repeat left 24px top 28px;
        color: var(--Primary-Color-Black);
        text-align: left;
        order: 1;
        font-family: var(--font-head);
        font-size: 30px;
        font-weight: 700;
        line-height: var(--lh-lg);
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 {
        /* position: absolute;
        top: calc(100vh - 335px); */
        width: 100%;
        padding: 72px 24px 30px 24px;
        margin-left: 0;
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 .img-area {
        overflow: hidden;
        position: relative;
        width: 100%;
        height: 175px;
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 .img-area img {
        position: absolute;
        top: 50%;
        left: 50%;
        width: auto;
        width: 100%;
        height: auto;
        transform: translate(-50%, -50%);
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 .text-area {
        position: static;
        bottom: 0;
        color: var(--Primary-Color-Black);
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 .text-area h3 {
        padding: 8px 0 0 0;
        font-size: 20px;
        line-height: var(--lh-lg);
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 .text-area p {
        padding: 8px 0 0 0;
        font-size: 14px;
        line-height: var(--lh-lg);
    }
    .gnb__tab-cont-wrap .gnb-content__dep2 .link-area {display: none;}
    .gnb__tab02-wrap [class*='gnb__tab02-btn'] {
        height: auto;
        padding: 16px 24px;
        font-family: var(--font-head);
    }
    .gnb__tab02-wrap button[class*='gnb__tab02-btn']::after {
        background-image: url(/inc/images/icon/icon-arrow01_right_gray_12.svg);
        background-position: center center;
        background-repeat: no-repeat;
    }
    .gnb__tab02-wrap [class*='gnb__tab02-btn'].on::after,
    .gnb__tab02-wrap [class*='gnb__tab02-btn']:hover::after,
    .gnb__tab02-wrap [class*='gnb__tab02-btn']:focus::after,
    .gnb__tab02-wrap [class*='gnb__tab02-btn']:active::after {background-image: url(/inc/images/icon/icon-arrow01_bottom_red_12.svg);}
    .gnb__tab02-wrap li:first-of-type [class*='gnb__tab02-btn'] {border-top: 0;}
    .gnb__panel02,
    .gnb__panel03 {
        display: none;
        z-index: 2;
        max-height: none;
    }
    .gnb__panel02 [class*='panel2'],
    .gnb__panel03 [class*='panel2'] {
        position: relative;
        z-index: 1;
        height: 100%;
        background: var(--Primary-Color-White);
        padding-top: 87px;
    }
    .gnb__panel02 .type-thumbnail,
    .gnb__panel03 .type-thumbnail {
        width: 100%;
        height: 100%;
        /* padding-top: 75px; */
    }
    .gnb__panel02 .type-thumbnail ul,
    .gnb__panel03 .type-thumbnail ul {
        padding: 0 24px;
        /* overflow-y: auto; */
        /* height: calc(100vh - 180px); */
        /* padding-top: 82px; */
        order: 2;
    }
    .gnb__panel02 .type-thumbnail li,
    .gnb__panel03 .type-thumbnail li {
        width: 100%;
        height: 344px;
        padding: 24px 24px 36px 24px;
        margin-bottom: 12px;
    }
    .gnb__panel02 .img-area,
    .gnb__panel03 .img-area {
        width: 224px;
        height: 168px;
        margin: 0 auto;
    }
    .gnb__panel02 .text-area,
    .gnb__panel03 .text-area {margin-top: 16px;}
    .gnb__panel02 .text-area h3,
    .gnb__panel03 .text-area h3 {
        text-align: center;
        font-size: 20px;
        font-family: var(--font-head);
        font-size: 20px;
        font-weight: 700;
        line-height: var(--lh-lg);
    }
    .gnb__panel02 .text-area p,
    .gnb__panel03 .text-area p {
        text-align: center;
        margin-top: 4px;
        font-size: 14px;
        font-weight: 400;
        line-height: var(--lh-lg);
    }
    .gnb__panel02 .link-area,
    .gnb__panel03 .link-area {
        display: flex;
        gap: 12px;
        justify-content: center;
        flex-wrap: wrap;
        margin-top: 16px;
    }
    .gnb__panel02 .link-area .link-btn,
    .gnb__panel03 .link-area .link-btn {
        display: flex;
        height: 32px;
        text-align: left;
        align-items: center;
        justify-content: center;
        gap: 3px;
        font-size: 16px;
        font-weight: 700;
    }
    .gnb__panel02 .link-area .link-btn span,
    .gnb__panel03 .link-area .link-btn span {
        display: block;
        width: 16px;
        height: 16px;
    }
    .gnb__panel02 .link-area .link-btn .icon-link,
    .gnb__panel03 .link-area .link-btn .icon-link {
        background: url(/inc/images/icon/icon-link.svg);
        margin-top: -2px;
    }
}
/* 2025-10-22 웹접근성 추가 및 수정 : gnb > 포커스 style 추가 */
.header__event-wrap [class*="header__event-item"] a:focus .text-area {bottom: 0;}
.gnb-content__dep2 a:focus .text-area {bottom: 0;}

/* footer */
.footer-wrap {
    position:relative;
    /* z-index: 1001; */
    padding: 80px 80px 100px;
    color: var(--Primary-Color-White);
    background-color: var(--Primary-Color-Black);
}
.footer-area {
    margin: 0 auto;
    max-width: 1440px;
}
.footer-list-wrap {
    padding-bottom: 36px;
    border-bottom: 1px solid #333;
}
.footer-link-wrap {
    padding: 36px 0;
    border-bottom: 1px solid #333;
}
.footer-etc-wrap {
    position: relative;
    padding-top: 36px;
}
.footer-copy {
    margin-top: 16px;
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.footer-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    row-gap: 32px;
}
.footer-grid.dropdown {
    display: flex;
    background: transparent;
    justify-content: space-between;
}
.footer-list-tit {
    font-size: 20px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
button.footer-list-tit {display: none;}
.footer-list-area {
    width: 100%;
    border: none;
    color: var(--Primary-Color-White);
}
.footer-list li {margin: 16px 0;}
/* [DESC] b3b3b3 변수로 */
.footer-list li a {
    color: #b3b3b3;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    line-height: 19.6px;
    font-family: var(--font-text);
}
.footer-list .text-icon {
    background: url(/inc/images/icon/icon-link_footer.svg) no-repeat top 0 right 0;
    vertical-align: middle;
    margin-left: 8px;
    padding-right: 24px;
}
.footer-link-tit {
    margin-bottom: 20px;
    padding-right: 16px;
    font-size: 16px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.footer-link {
    display: flex;
    column-gap: 16px;
}
.footer-link li a.icon-instagram-wh:hover {
    background: url(/inc/images/icon/Icon-Instagram_white_hover.svg);
    background-size: contain;
}
.footer-link li a.icon-youtube-wh:hover {
    background: url(/inc/images/icon/icon-youtube_white_hover.svg);
    background-size: contain;
}
.footer-link li a.icon-link-wh:hover {
    background: url(/inc/images/icon/icon-link_white_hover.svg);
    background-size: contain;
}
.footer-etc {display: flex;}
.footer-etc li {
    position: relative;
    padding: 0 12px;
}
.footer-etc li::before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 1px;
    height: 10px;
    content: "";
    transform: translateY(-50%);
    background-color: #595c5f;
}
.footer-etc li:first-of-type {padding-left: 0;}
.footer-etc li:first-of-type::before {content: none;}
.footer-etc li:last-of-type {padding-right: 0;}
.footer-etc li a {
    color: #b3b3b3;
    font-size: 14px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.footer-etc li:nth-child(3) a {
    color: var(--Primary-Color-White);
    font-weight: 800;
}
.footer-etc li a:hover {text-decoration: underline;}
/* [DESC] 사용안하고있음. 확인되면 삭제 */
/* .footer-top-btn {
    position: absolute;
    right: 0;
    top: 36px;
    display: flex;
    align-items: center;
    column-gap: 12px;
    font-family: var(--font-head);
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    color: var(--Primary-Color-White);
} */
.footer-copy + .footer-award {margin-top: 16px;}
.footer-award__list {
    display: flex;
    align-items: center;
    gap: 20px;
}
.web-award__badge img {width: 40px;}
.web-accessibility {
    display: flex;
    align-items: center;
    gap: 10px;
}
.web-accessibility__badge img {width: 48px;}
.web-accessibility__title {
    font-size: 14px;
    font-weight: 500;
    font-family: var(--font-head);
    line-height: var(--lh-lg);
}
@media screen and (max-width: 1023px) {
    .footer-wrap {padding: 40px 24px 100px;}
    .footer-list-wrap {
        padding-bottom: 0;
        border-bottom: none;
    }
    .footer-link-wrap {
        padding: 0;
        padding-top: 60px;
        border-bottom: none;
    }
    .footer-copy {
        margin-top: 24px;
        font-size: 14px;
        font-weight: 500;
        line-height: var(--lh-lg);
    }
    .footer-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        row-gap: 32px;
    }
    .footer-grid.dropdown {display: block;}
    .footer-list-area {
        width: 100%;
        border: none;
        background: var(--Primary-Color-Black);
        color: var(--Primary-Color-White);
    }
    .footer-list-tit {
        width: 100%;
        padding: 16px 0;
        color: var(--Primary-Color-White);
        justify-content: space-between;
        border-bottom: 1px solid var(--Secondary-Color-Black_333333);
        font-size: 17px;
    }
    button.footer-list-tit {display: flex;}
    p.footer-list-tit {display: none;}
    .footer-list-area:first-of-type .footer-list-tit {padding-top: 0;}
    .footer-list {
        display: none;
        padding: 12px 0 28px 0;
        border-bottom: 1px solid #333;
    }
    .footer-list.dropdown-on {display: block;}
    .footer-list li {
        margin: 0;
        padding: 0;
    }
    .footer-list li + li {margin-top: 16px;}
    .footer-link-tit {
        margin-bottom: 16px;
        padding-right: 40px;
    }
    .footer-link-area {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .footer-etc {
        width: 100%;
        flex-wrap: wrap;
        row-gap: 16px;
    }
    .footer-etc li {
        position: relative;
        padding: 0 12px;
    }
    .footer-etc li::before {
        position: absolute;
        top: 50%;
        left: 0;
        width: 1px;
        height: 10px;
        content: "";
        background-color: #595c5f;
        transform: translateY(-50%);
    }
    /* [DESC] 사용안하고있음. 확인되면 삭제 */
    /* .footer-top-btn {
        top: auto;
        bottom: 0;
        column-gap: 8px;
        font-size: 14px;
        font-weight: 500;
        line-height: var(--lh-lg);
    }
    .footer-top-btn span {
        width: 16px;
        height: 16px;
    } */
    .footer-copy + .footer-award {margin-top: 24px; }
    .web-award__badge img {width: auto;}
    .web-accessibility {gap: 8px;}
}
/* top button */
.top-btn-area {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 99;
}
.top-btn-area .btn {
    display: none;
    width: 60px;
    height: 60px;
    flex-direction: column;
    background-color: var(--Secondary-Color-Black_Natural);
    font-size: 14px;
    font-weight: 700;
    line-height: var(--lh-lg);
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
    border-radius: 50%;
}
.top-btn-area .btn::before {
    display: block;
    width: 16px;
    height: 16px;
    content: "";
    background-image: url(/inc/images/icon/icon-arrow01_down.svg);
    background-size: contain;
    transform: rotate(180deg);
}
.btn-floating {
    /* display: none; */
    position: fixed;
    right: 20px;
    bottom: 96px;
    z-index: 99;
}
.btn-floating .btn {
    width: 60px;
    height: 60px;
    flex-direction: column;
    background-color: var(--Primary-Color-Red);
    border-radius: 50%;
}
.btn-floating .btn::before {
    display: block;
    width: 36px;
    height: 36px;
    content: "";
    background-image: url(/inc/images/icon/icon-write.svg);
    background-size: contain;
}

/* layout */
.content-visual {
    position: relative;
    height: calc(var(--vh, 1vh) * 100 - 70px);
    background-color: #1c1c1c;
}
.content-box--main {
    padding-top: 240px;
    padding-bottom: 240px;
}
.content-box--sub {
    padding-top: 200px;
    padding-bottom: 200px;
}
.content-box--main + .content-box--sub,
.content-box--sub + .content-box--sub { padding-top: 0; }
.content-box--sub[class*="bg-"]+ .content-box--sub {
    padding-top: 200px;
}
.content-box-sub-md {
    padding-top: 160px;
    padding-bottom: 140px;
}
.content-box-sub-md + .content-box-sub-md {padding-top: 0;}
.content-box-sub-md + .content-box-sub-md.bg-gray {padding-top:100px;}
.content-box--sub-sm {
    padding-top: 80px;
    padding-bottom: 200px;
}
.content-box--banner {
    padding-top: 100px ;
    padding-bottom: 200px;
}
.content-box:last-child,
.content-box--sub:last-child,
.content-box--sub-sm:last-child,
.content-box--banner:last-child { padding-bottom: 240px; }
.container {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 0 80px;
    max-width: 1600px; /*1440*/
}
.container--full {
    padding: 0;
    max-width: unset;
}
.container--wide {max-width: 1920px;}
.container--xl {max-width: 1800px;}
.container--sm {max-width: 1280px;}
.content-header {
    display: flex;
    text-align: center;
    gap: 80px;
    flex-direction: column;
    align-items: center;
}
.content-header--l-md {
    text-align: left;
    max-width: 1228px;
    align-items:normal;
}
.content-header--md {
    margin: 0 auto;
    max-width: 1228px;
}
.content-header--sm {
    margin: 0 auto;
    max-width: 1196px;
}
.content-header--gap-sm {gap: 40px;}
.content-header + .content-body {
    padding-top: 80px;
}
.content-header + .content-body:has(.c-spec-detail) {
    padding-top: 40px;
}
.content-header .c-text__title {font-weight: 700;}
.content-header .c-text__subtitle {}
.content-header .c-text__desc {font-weight: 500;}
.c-text__title + .c-text__subtitle { margin-top: 20px; }
.content-body__section {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding-top: 80px;
}
.content-body__section:first-child {padding-top: 0;}
@media screen and (max-width: 1023px) {
    .content-box--main {
        padding-top: 152px;
        padding-bottom: 152px;
    }
    .content-box--sub {
        padding-top: 120px;
        padding-bottom: 120px;
    }
    .content-box-sub-md {
        padding-top: 100px;
        padding-bottom: 120px;
    }
    .content-box--sub-sm {
        padding-top: 44px;
        padding-bottom: 120px;
    }
    .content-box--banner {
        padding-top: 80px ;
        padding-bottom: 120px;
    }
    .content-box:last-child,
    .content-box--sub:last-child,
    .content-box--sub-sm:last-child,
    .content-box--banner:last-child { padding-bottom: 152px; }
    .container {padding: 0 24px;}
    .container--full-mo {padding: 0;}
    .content-header {gap: 44px;}
    .content-header--gap-sm {gap: 20px;}
    .c-text__title + .c-text__subtitle { margin-top: 12px; }
    .content-header + .content-body { padding-top: 44px; }
    .content-header + .content-body:has(.c-spec-detail) { padding-top: 28px; }
}
.grid-layout {
    display: grid;
    justify-content: center;
}
.grid-layout--aside {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
}
.grid-layout--aside .grid-layout__item { width: 100%; }
.grid-layout--aside .grid-layout__item:first-child { grid-row: 1 / 3; }
.flex-layout {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.flex-layout--full {}
.flex-layout--2col {
    --gap-2: 24px;
    justify-content: space-between;
    row-gap: 80px;
    column-gap: var(--gap-2);
}
.flex-layout--2col.is-no-gap {
    --gap-2: 0px;
    row-gap: 0;
}
.flex-layout--2col.gap-xs {
    --gap-2:20px;
}
.flex-layout--2col > div,
.flex-layout--2col > li {width: calc((100% - var(--gap-2) * 1) / 2);}
.flex-layout--3col {
    --gap-3: 24px;
    gap: var(--gap-3);
}
.flex-layout--3col > div,
.flex-layout--3col > li {width: calc((100% - var(--gap-3) * 2) / 3);}
.flex-layout--3col-mo-scroll {
    --gap-3: 24px;
    gap: var(--gap-3);
}
.flex-layout--3col-mo-scroll > div,
.flex-layout--3col-mo-scroll > li {width: calc((100% - var(--gap-3) * 2) / 3);}
.flex-layout--4col {
    --gap-4: 24px;
    gap: var(--gap-4);
}
.flex-layout--4col > div,
.flex-layout--4col > li {width: calc((100% - var(--gap-4) * 3) / 4);}
@media (min-width: 1024px) {
    .flex-layout-pc {
        display: flex;
    }
    .flex-layout-pc > * { flex: 1; }
    .flex-layout-pc > [class*="c-text__"] {margin: 0;}
}
@media screen and (max-width: 1023px) {
    .flex-layout { flex-direction: column; }
    .flex-layout--2col > div,
    .flex-layout--2col > li,
    .flex-layout--3col > div,
    .flex-layout--3col > li { width: 100%; }
    .flex-layout--2col { row-gap: 44px; }
    .flex-layout--2col.gap-xs {row-gap: 16px;}
    .flex-layout--3col { gap: 20px; }
    .flex-layout--3col-mo-scroll {
        display: flex;
        overflow-x: scroll;
        justify-content: space-between;
        flex-direction: unset;
        flex-wrap: unset;
        gap: 12px;
        padding: 0 24px;
    }
    .flex-layout--3col-mo-scroll .c-card {
        flex-shrink: 0;
        width: 100%;
        min-width: 258px;
        max-width: calc(33.3% - 12px);
    }
    .flex-layout--3col-mo-scroll .c-card:only-child { width: 100%; }
    .flex-layout--4col {
        --gap-4: 12px;
        flex-direction: row;
        row-gap: 28px;
    }
    .flex-layout--4col > div,
    .flex-layout--4col > li {
        width: calc((100% - var(--gap-4)) / 2);
    }
    .content-body:has(.flex-layout--3col-mo-scroll) {
        overflow: hidden;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .grid-layout--aside {
        display: flex;
        flex-direction: column;
    }
    .grid-layout--aside .grid-layout__item:first-child { grid-row: auto; }
}

/* keyvisual */
.content-visual--text {
    height: auto;
    background: none;
}
.content-visual--text .content-visual__header {
    display: flex;
    height: 440px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.content-visual--text .content-visual__title {
    color: var(--Primary-Color-Black);
    text-align: center;
    font-family: var(--font-head);
    font-weight: 700;
    font-size: 80px;
    line-height: var(--lh-base);
}
.content-visual--text .content-visual__subtitle {
    color: var(--Primary-Color-Black);
    margin-top: 16px;
    font-family: var(--font-head);
    font-size: 32px;
    font-weight: 500;
    line-height: var(--lh-lg);
    text-align: center;
}
.content-visual__desc {padding: 22px 24px 0;}
.content-visual--overlay {
    /* 오버레이타입 */
}
.content-visual__video {position: relative;}
.content-visual__video video {
    object-fit: cover;
    width: 100%;
    max-height: calc(var(--vh, 1vh) * 100 - 70px);
}
.content-visual__video .btn-groups {
    position: absolute;
    right: 20px;
    bottom: 20px;
}
.content-visual__video .btn-groups .btn:hover,
.content-visual__video .btn-groups .btn:active {background-color: var(--Primary-Color-Red);}
@media screen and (max-width: 1023px) {
    .content-visual--text .content-visual__header {
        height: 400px;
        padding: 0 24px;
    }
    .content-visual--text .content-visual__title {font-size: 40px;}
    .content-visual--text .content-visual__subtitle {font-size: 20px;}
    .content-visual__video video { height: 480px; }
    .content-visual__video .btn-groups {
        right: 12px;
        bottom: 12px;
    }
    .content-visual__desc {padding: 16px 0 0 24px;}
}

/* related-wrap */
.related-wrap .content-box {
    padding: 100px 0 120px;
    background-color: var(--Secondary-Color-Black_Natural);
}
.content-banner + .related-wrap {margin-top: 240px;}
.related-wrap .content-header {text-align: left;}
.related-wrap .content-header + .content-body { padding-top: 40px; }
.related-wrap .related-list { 
    gap: 24px;
    flex-wrap: nowrap;
}
.related-wrap .c-card__body { padding-top: 20px; }
@media screen and (max-width: 1023px) {
    .content-banner + .related-wrap {margin-top: 152px;}
    .related-wrap .content-box { padding: 80px 0px 120px 0px; }
    .related-wrap .content-header { padding-left: 24px; }
    .related-wrap .related-list {
        display: inline-flex;
        padding: 0 24px;
        flex-direction: row;
        gap: 12px;
    }
    .related-wrap .related-list__item {
        display: inline-block;
        position: relative;
        width: 258px;
    }
    .related-wrap .related-list__item:only-child {
        width: 100%;
    }
    .related-wrap .content-body:has(.related-list__item) {
        overflow: hidden;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}
.ui-fctab-s {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
}
.ui-fctab-e {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
}
.header-dimmed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100vw;
    height: 100vh;
    background: var(--Primary-Color-Black);
    opacity: 0.5;
}
.dimmed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100vw;
    height: 100vh;
    background: var(--Primary-Color-Black);
    opacity: 0.5;
}
.m-dimmed {display: none;}
@media screen and (max-width: 1023px) {
    .m-dimmed {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1002;
        width: 100vw;
        height: 100vh;
        background: var(--Primary-Color-Black);
        opacity: 0.5;
    }
}
.pop-dimmed {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100%;
    height: 100%;
    background: var(--Primary-Color-Black);
    opacity: 0.5;
}
.ani-dimmed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    width: 100vw;
    height: 100vh;
    background: var(--Primary-Color-Black);
    opacity: 0.5;
    /* transition: width 0.3s; */
}
.ani-dimmed.on {
    animation: aniDimmed 0.3s;
    animation-fill-mode: forwards;
}
/* animation */
@-webkit-keyframes fadein {
    0% { display: block; opacity: 0; }
    100% { opacity: 1; }
}
@keyframes fadein {
    0% { display: block; opacity: 0; }
    100% { opacity: 1; }
}
@-webkit-keyframes fadeout {
    0% { opacity: 1; }
    100% { display: none; opacity: 0; }
}
@keyframes fadeout {
    0% { opacity: 1; }
    100% { display: none; opacity: 0; }
}
@-webkit-keyframes fade-in-out {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
@keyframes fade-in-out {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
@-webkit-keyframes bottomSlideDown {
    0% { bottom: -100%; }
    100% { bottom: 0%; }
}
@keyframes bottomSlideDown {
    0% { bottom: -100%; }
    100% { bottom: 0%; }
}
@-webkit-keyframes bottomSlideUp {
    0% { bottom: 0; }
    100% { display: none; bottom: -100%; }
}
@keyframes bottomSlideUp {
    0% { bottom: 0; }
    100% { display: none; bottom: -100%; }
}
@-webkit-keyframes aniDimmed {
    0% { width: 0; }
    100% { width: 100vw; }
}
@keyframes aniDimmed {
    0% { width: 0; }
    100% { width: 100vw; }
}
@-webkit-keyframes aniDimmedClose {
    0% { width: 100vw; }
    100% { width: 0; }
}
@keyframes aniDimmedClose {
    0% { width: 100vw; }
    100% { width: 0; }
}
@-webkit-keyframes sideAni {
    0% { right: -100%; }
    100% { right: 0px; }
}
@keyframes sideAni {
    0% { right: -100%; }
    100% { right: 0px; }
}
@-webkit-keyframes sideAniClose {
    0% { display: block; right: 0%; }
    99% { display: block; right: -100%; }
    100% { display: none; right: -100%; }
}
@keyframes sideAniClose {
    0% { display: block; right: 0%; }
    99% { display: block; right: -100%; }
    100% { display: none; right: -100%; }
}
@-webkit-keyframes swiperTransition {
    0% { width: 0; }
    100% { width: 84px; }
}
@keyframes swiperTransition {
    0% { width: 0; }
    100% { width: 84px; }
}
@-webkit-keyframes bounce {
    0%, 100% { -webkit-transform: scale(0.5); transform: scale(0.5); }
    50% { -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes bounce {
    0%, 100% { -webkit-transform: scale(0.5); transform: scale(0.5); }
    50% { -webkit-transform: scale(1); transform: scale(1); }
}
@-webkit-keyframes bounce-wide {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.1); transform: scale(1.1); }
}
@keyframes bounce-wide {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.1); transform: scale(1.1); }
}
@-webkit-keyframes bounce-wide2 {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.3); transform: scale(1.3); }
}
@keyframes bounce-wide2 {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.3); transform: scale(1.3); }
}
@-webkit-keyframes bounce-wide3 {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.15); transform: scale(1.15); }
}
@keyframes bounce-wide3 {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.15); transform: scale(1.15); }
}
@-webkit-keyframes bounce-wide4 {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.5); transform: scale(1.5); }
}
@keyframes bounce-wide4 {
    0%, 100% { -webkit-transform: scale(1); transform: scale(1); }
    50% { -webkit-transform: scale(1.5); transform: scale(1.5); }
}
@-webkit-keyframes bounce-unset {
    0% { -webkit-transform: scale(1); transform: scale(1); }
    100% { -webkit-transform: scale(0.3); transform: scale(0.3); }
}
@keyframes bounce-unset {
    0% { -webkit-transform: scale(1); transform: scale(1); }
    100% { -webkit-transform: scale(0.3); transform: scale(0.3); }
}
@-webkit-keyframes bounce-wide-unset {
    0% { -webkit-transform: scale(1.1); transform: scale(1.1); }
    100% { -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes bounce-wide-unset {
    0% { -webkit-transform: scale(1.1); transform: scale(1.1); }
    100% { -webkit-transform: scale(1); transform: scale(1); }
}
@-webkit-keyframes fade-scale-in {
    0% { -webkit-transform: scale(var(--start-scale)); transform: scale(var(--start-scale)); opacity: 0; }
    20% { opacity: 1; }
    70% { -webkit-transform: scale(1); transform: scale(1); }
}
@keyframes fade-scale-in {
    0% { -webkit-transform: scale(var(--start-scale)); transform: scale(var(--start-scale)); opacity: 0; }
    20% { opacity: 1; }
    70% { -webkit-transform: scale(1); transform: scale(1); }
}
@-webkit-keyframes step-01 {
    to { stroke-dashoffset: 882.957; }
}
@keyframes step-01 {
    to { stroke-dashoffset: 882.957; }
}
@-webkit-keyframes step-02 {
    to { stroke-dashoffset: 789.957; }
}
@keyframes step-02 {
    to { stroke-dashoffset: 789.957; }
}
@-webkit-keyframes step-03 {
    to { stroke-dashoffset: 693.957; }
}
@keyframes step-03 {
    to { stroke-dashoffset: 693.957; }
}
@-webkit-keyframes step-04 {
    to { stroke-dashoffset: 492.957; }
}
@keyframes step-04 {
    to { stroke-dashoffset: 492.957; }
}
@-webkit-keyframes step-05 {
    to { stroke-dashoffset: 372.957; }
}
@keyframes step-05 {
    to { stroke-dashoffset: 372.957; }
}
@-webkit-keyframes step-06 {
    to { stroke-dashoffset: 187.957; }
}
@keyframes step-06 {
    to { stroke-dashoffset: 187.957; }
}
@-webkit-keyframes step-07 {
    to { stroke-dashoffset: 85.957; }
}
@keyframes step-07 {
    to { stroke-dashoffset: 85.957; }
}
@-webkit-keyframes step-08 {
    to { stroke-dashoffset: 0; }
}
@keyframes step-08 {
    to { stroke-dashoffset: 0; }
}
@-webkit-keyframes fadeInUp {
    0% { -webkit-transform: translateY(30%); transform: translateY(30%); opacity: 0; }
    100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
}
@keyframes fadeInUp {
    0% { -webkit-transform: translateY(30%); transform: translateY(30%); opacity: 0; }
    100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
}
@-webkit-keyframes fadeInUpSmall  {
    0% { -webkit-transform: translateY(20%); transform: translateY(20%); opacity: 0; }
    100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
}
@keyframes fadeInUpSmall  {
    0% { -webkit-transform: translateY(20%); transform: translateY(20%); opacity: 0; }
    100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
}
.anim-fade-up {
    -webkit-animation: fadeInUp 1.5s;
    animation: fadeInUp 1.5s;
}
.anim-fade-up-sm {
    -webkit-animation: fadeInUpSmall  1.5s;
    animation: fadeInUpSmall  1.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}

/* popup  */
.popup { position: fixed; }
/* popup common */
/* popup-wrapper */
.popup .popup-wrapper {
    position: relative;
    width: 100%;
    margin: 0 auto;
}
@media screen and (max-width: 1280px) {
    .popup-wrapper .popup-header .inner-header-txt h3 {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .popup-wrapper .popup-header > h3 {
        overflow: hidden;
        width: calc(100% - 30px);
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    .popup-wrapper .popup-header > h3.no-over {
        overflow: visible;
        white-space: pre-line;
        text-overflow: initial;
    }
    /* .ellip.small의 경우 제목이 조금 더 길 때 */
    .popup-wrapper .popup-header .ellip.small { width: 100%; }
    /* [DESC] .wrap-model-video 안쓰는거 같음 -> 확인되면 삭제하기 */
    /* .popup.model-popup.forModel .popup-wrapper .popup-body .inner-body-model .wrap-model-video { height: fit-content; } */
}
@media screen and (max-width: 820px) {
    .popup-wrapper .popup-header .ellip.small { width: 100%; }
}
@media screen and (max-width: 580px) {
    .popup .popup-wrapper .popup-header .inner-header-txt {
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* popup-header */
.popup .popup-header {
    display: flex;
    position: relative;
    z-index: 200;
    padding: 27.5px 40px;
    background: var(--Primary-Color-White);
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--Line-Color-Line_02);
}
.popup .popup-header h3 {
    font-size:32px;
    line-height: var(--lh-lg);
    font-family: var(--font-head);
    font-weight: 600;
}

/* popup-body */
.popup .popup-body {
    display: grid;
    overflow-y: auto;
    padding: 40px 40px 60px 40px;
    gap: 40px 0;
    max-height: calc(100vh - 349px);
}
.popup .popup-body * { max-width: 100%; }
.popup .popup-body.height-longer-mobile * {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
}
.popup .popup-body .m10 {
    display: flex;
    gap: 10px;
    flex-direction: column;
}
.popup .popup-body .m20 {
    display: flex;
    gap: 20px;
    flex-direction: column;
}
.popup .popup-body .m40 {
    display: flex;
    gap: 40px;
    flex-direction: column;
}
.popup .popup-body .m40:has(.wrap-bottom-comment) { gap: 0; }
.popup .popup-body .m40:has(.wrap-bottom-comment > .wrap-comment) { gap: 40px; }
.popup .popup-body textarea::placeholder {
    width: fit-content;
    color: var(--Line-Color-Line_02);
    white-space: pre-line;
}
/* n festival notice */
.popup .popup-body .wrap-label-reward .tit-type04 { font-size: 40px; }
/* NOC 반려 게시물 */
.popup .popup-body.owners-post .wrap-label-reward .tit-type04 {
    font-family: var(--font-head);
    font-size: 32px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
/* 댓글 있는 경우 더보기 버튼 여백 */
.popup .popup-body .type-modal-more {
    padding-bottom: 0;
    padding-top: 0;
}
/* 댓글 없는 경우 더보기 버튼 여백 */
.popup .popup-body:not(:has(.wrap-comment)) .type-modal-more { padding-top: 40px; }
.popup .popup-body .instruct-wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* popup - footer */
.popup .popup-footer {
    display: flex;
    position: relative;
    z-index: 200;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    align-self: stretch;
    width: 100%;
    padding: 24px 0px;
    background: var(--Primary-Color-White);
    border-top: 1px solid var(--Secondary-Color-Black_555555);
}
.popup .popup-footer.footer-no-pd {
    position: relative;
    padding: 0;
    border-top: none;
}
/* default: class="btn btn-lg- */
.popup .popup-footer .btn-wrap {
    display: flex;
    gap: 0 8px;
}
.popup .popup-footer .btn-wrap.type-row {
    justify-content: center;
    gap: 8px;
}
/* for class="btn btn-md- */
.popup .popup-footer .btn-wrap.md {
    display: flex;
    gap: 0 10px;
}

/* popup - btn(close, navigation) */
/* popup - btn: close */
.popup .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x {
    position: absolute;
    top: 32px;
    right: 35px;
    bottom: calc(100% - 105px);
    z-index: 1000;
    height: fit-content;
}
/* share-popup 팝업 내 x버튼 (조금 작아요) */
.popup .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x.smallX {
    top: 17px;
    right: 24px;
}
/* side-popup 팝업 내 x버튼 */
.popup.side-popup .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x { top: 28px; }
.popup .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x.smallX span.icon-close {
    width: 24px;
    height: 24px;
}
/* popup - btn: navigation */
.popup .wrap-navigation {
    display: flex;
    position: fixed;
    justify-content: space-between;
    align-items: center;
    top: 50%;
    left: 50%;
    width: 100vw;
    max-width: calc(1765px - 40px);
    height: auto;
    margin: 0 auto;
    transform: translateX(-50%);
}
.popup .wrap-navigation .modal-btn {
    width: 60px;
    height: 60px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 0;
}
.popup .wrap-navigation .modal-btn.left {
    position: absolute;
    top: 50%;
    left: 3%;
    transform: translateY(-50%);
}
.popup .wrap-navigation .modal-btn.right {
    position: absolute;
    top: 50%;
    right: 3%;
    transform: translateY(-50%);
}
.popup .wrap-navigation .modal-btn.left:hover [class*="icon-left"],
.popup .wrap-navigation .modal-btn.left:active [class*="icon-left"] {
    background: url(/inc/images/icon/icon-arrow01_left_white.svg);
    background-size: contain;
}

@media screen and (max-width: 1280px) {
    .popup .wrap-navigation { max-width: 1200px; }
    .popup .wrap-navigation .modal-btn.left { left: 16px; }
    .popup .wrap-navigation .modal-btn.right { right: 16px; }
}
/* invite */
.popup .invite .popup-body p {
    font-family: var(--font-text);
    font-weight: 500;
    line-height: var(--lh-lg);
}
.popup .popup-body.invite p:first-child { margin: 0 0 40px 0; }
.popup .invite {
    display: flex;
    padding: 40px;
    flex-direction: column;
    align-items: center;
}
.popup .invite .popup-header {
    padding: 0;
    border-bottom: 0;
}
.popup .invite .popup-body { padding: 0; }
.popup .invite .popup-body p {
    font-family: var(--font-text);
    font-weight: 500;
}
.popup .invite .popup-body p.tit-type05 {
    font-weight: 700;
    font-family: var(--font-head);
}
.popup .invite .popup-body p span.accent {
    color: var(--Primary-Color-Red);
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .invite .popup-body .btn-wrap {
    display: flex;
    gap: 0 8px;
    justify-content: center;
}
.popup .invite .popup-footer {
    padding: 0;
    border-top: 0;
}
.break-no-pc-only { display: none; }
/* popup - onlyTxt */
.popup .onlyTxt .popup-body.double-pop-body { padding: 40px; }
.popup .onlyTxt .popup-body .popup-body-innerbox .mt8 { margin-top: 8px; }
.popup .onlyTxt .popup-body .popup-body-innerbox .mt24 { margin-top: 24px; }
.popup .onlyTxt .popup-body .popup-body-innerbox p.popup-tit-lg {
    margin-bottom: 40px;
    font-family: var(--font-head);
    font-size: 40px;
    font-weight: 700;
    line-height:  var(--lh-base);
    text-transform: capitalize;
}
.popup .onlyTxt .popup-body .popup-body-innerbox p.popup-tit-lg.no-mb {
    margin-bottom: 0;
    font-family: var(--font-head);
    font-size: 40px;
    font-weight: 700;
    line-height:  var(--lh-base);
    text-transform: capitalize;
}
.popup .onlyTxt .popup-body .popup-body-innerbox p.txt-type01 {
    font-family: var(--font-head);
    font-size: 24px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .onlyTxt .popup-body .popup-body-innerbox .tit-type03 {
    margin-bottom: 10px;
    font-size: 20px;
}
.popup .onlyTxt .popup-body .popup-body-innerbox .txt-type03 { font-weight: 500; }
.popup .onlyTxt .popup-body .popup-body-innerbox .txt-type03.inquiry { margin-top: 28px; }
.popup .onlyTxt .popup-body .popup-body-innerbox .txt-type03.accent,
.popup .onlyTxt .popup-body .popup-body-innerbox .txt-type03 span.accent {
    color: var(--Primary-Color-Red);
    font-weight: 700;
}
.popup .onlyTxt .popup-body .txt-type03 .accent {
    color: var(--Primary-Color-Red);
    font-weight: 700;
}
.popup .onlyTxt .popup-body .popup-body-innerbox .txt-type03 .accent {
    color: var(--Primary-Color-Red);
    font-weight: 500;
}
.popup .onlyTxt .popup-body .popup-body-innerbox .selectbox-wrap { width: 100%; }
.popup .onlyTxt .popup-body .popup-body-innerbox .selectbox-wrap > div { width: 100%; }
.popup .onlyTxt .popup-body .popup-body-innerbox .selectbox-wrap > div button.selectbox-trigger { width: 100%; }
.popup .onlyTxt .popup-body .popup-body-innerbox .selectbox-wrap ul { width: 100%; }
.popup .onlyTxt .popup-body .popup-body-innerbox .selectbox-options { left: 0; }
.popup .onlyTxt .popup-body-innerbox ul {
    width: calc(100% - 40px);
    margin: 0 auto;
    padding: 0;
}
.popup .onlyTxt .popup-body-innerbox ul.li-aparted {
    width: 100%;
    margin: 0 0 0 20px;
}
.popup .onlyTxt .popup-body-innerbox ul.li-aparted li { margin-bottom: 22px; }
.popup .onlyTxt .popup-body-innerbox ul li { list-style: disc; }
.popup .onlyTxt .popup-body-innerbox ul li::marker {
    margin: 0;
    padding: 0;
}
.popup .onlyTxt .popup-body-innerbox ul li p.tit-type05 {
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.popup .onlyTxt .popup-body-innerbox p.tit-type05.desc { font-weight: 500; }
.popup .onlyTxt .popup-body-innerbox ul li p.tit-type05:last-child { margin: 0; }
.popup .onlyTxt .popup-con:last-child { margin-bottom: 40px; }
.popup .onlyTxt .popup-body-innerbox ul li p.tit-type05 span.accent {
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 700;
    line-height: var(--lh-lg);
    color: var(--Primary-Color-Red);
}
.popup .onlyTxt .popup-body-innerbox .popup-footer {
    position: relative;
    padding: 0;
    border-top: none;
}
/* checkmail */
.popup .popup-body-innerbox .wrap-checkmail {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 8px 0 0 0;
    padding: 30px;
    background: var(--Secondary-Color-Black_Natural);
}
.popup .popup-body-innerbox .wrap-checkmail p:nth-child(1) {
    font-family: var(--font-text);
    font-size: 20px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.popup .popup-body-innerbox .wrap-checkmail .btn-wrap {
    padding: 8px 0;
}
.popup .popup-body-innerbox .wrap-checkmail.changeMail {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 40px;
    align-items: flex-start;
    padding: 0;
    background: var(--Primary-Color-White);
}
.popup .wrap-checkmail.changeMail .wrap-form.text { width: 100%; }
.popup .wrap-checkmail.changeMail .btn-wrap .btn.md-txt-btn01 { margin-top: 8px; }
.popup .inner-textarea-comment { border-radius: 0; }
.popup .inner-textarea-comment button.btn-lg-primary01 {
    background: var(--Line-Color-Line_e6e6e6);
    color: var(--Line-Color-Line_a1a1a1);
    border-radius: 0;
}
.popup .wrap-form.textarea textarea:focus+.btn.btn-lg-primary01 {
    background: var(--Primary-Color-Black);
    color: var(--Primary-Color-White);
}

/* profile area in popup */
.popup .wrap-popup-profile {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: flex-start;
    gap: 0 8px;
    width: 100%;
}
.popup .wrap-popup-profile > button {
    display: flex;
    position: relative;
    justify-content: flex-start;
    align-items: center;
    gap: 0 8px;
    width: 100%;
}
.popup .wrap-popup-profile > button:hover .groupname { text-decoration: underline; }
.popup .wrap-popup-profile button {
    cursor: pointer;
}
.popup .wrap-popup-profile .box-profile-img {
    position: relative;
    width: 40px;
    height: 40px;
    background: url(/inc/images/img/img_Nful_profile_default.png) center no-repeat;
    background-size: contain;
}
.popup .wrap-popup-profile .box-profile-img:has(img) { background: unset; }
.popup .wrap-popup-profile .box-profile-img.close::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    background-color: rgba(0, 0, 0, 0.5);
}
.popup .wrap-popup-profile .box-profile-img img {
    position: relative;
    width: 40px;
    height: 40px;
    background-color: var(--Primary-Color-Blue);
}
.popup .wrap-popup-profile .box-profile-img.bg-contain { background-color: var(--Secondary-Color-Black_Natural_30); }
.popup .wrap-popup-profile .box-profile-img.bg-contain img { z-index: 0; }
.popup .wrap-form.textarea .inner-textarea-comment button { position: relative; }
.popup .wrap-popup-profile .box-profile-txt {
    display: flex;
    position: relative;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    width: calc(100% - 48px);
    max-width: inherit;
}
.popup .wrap-popup-profile .box-profile-txt p.txt-type04.nickname {
    display: flex;
    overflow: hidden;
    align-items: center;
    max-width: 800px;
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 700;
    line-height: var(--lh-lg);
    white-space: nowrap;
    word-wrap: break-word;
    text-overflow: ellipsis;
}
.popup .wrap-popup-profile .box-profile-txt p.txt-type04.nickname .icon {
    display: block;
    width: 20px;
    height: 20px;
    margin-left: 8px;
}
.popup .wrap-popup-profile .box-profile-txt p.txt-type04.groupname {
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.popup .wrap-popup-profile .box-profile-txt div {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}
.popup .club-popup {
    top: 45px;
    left: 0;
    width: 100%;
    max-width: 402px;
}

/* profile info modal */
.card_comment .club-popup { top: 20px; }
.card_profile .club-popup,
.card_comment .club-popup {
    overflow: hidden;
    height: 0;
}
.card_profile .club-popup.on,
.card_comment .club-popup.on { height: auto; }
.card_comment .club-popup { top: 20px; }
.card_profile .club-popup,
.card_comment .club-popup {
    overflow: hidden;
    height: 0;
}
.card_profile .club-popup.on,
.card_comment .club-popup.on { height: auto; }
.popup .wrap-popup-profile .club-popup {
    display: none;
    left: -48px;
}
.popup .wrap-popup-profile .club-popup.on { display: block; }
.popup .wrap-popup-profile .club-popup .pop-profile { justify-content: flex-start; }
.card_comment .club-popup:has(.pop-page) .pop-des,
.card_profile .club-popup:has(.pop-page) .pop-des,
.popup .wrap-popup-profile .club-popup:has(.pop-page) .pop-des,
.popup .box-comment .club-popup:has(.pop-page) .pop-des,
.card_detail .club-popup:has(.pop-page) .pop-des {
    padding: 20px 16px;
    min-height: 80px;
}
.card_comment .club-popup .pop-page,
.card_profile .club-popup .pop-page,
.popup .wrap-popup-profile .club-popup .pop-page,
.popup .box-comment .club-popup .pop-page,
.card_detail .club-popup:has(.pop-page) .pop-page {
    display: flex;
    justify-content: center;
    background-color: var(--Secondary-Color-Black_Natural);
}
.card_comment .club-popup .pop-page .btn-wrap,
.card_profile .club-popup .pop-page .btn-wrap,
.popup .wrap-popup-profile .club-popup .pop-page .btn-wrap,
.popup .box-comment .club-popup .pop-page .btn-wrap,
.card_detail .club-popup:has(.pop-page) .btn-wrap {
    display: flex;
    gap: 60px;
    width: auto;
    padding: 24px;
}
.card_comment .club-popup .pop-page .btn-wrap .btn,
.card_profile .club-popup .pop-page .btn-wrap .btn,
.popup .wrap-popup-profile .club-popup .pop-page .btn-wrap .btn,
.popup .box-comment .club-popup .pop-page .btn-wrap .btn,
.card_detail .club-popup:has(.pop-page) .btn-wrap .btn { font-size: 16px; }
.card_comment .club-popup .popup-footer,
.card_profile .club-popup .pop-page .club-popup .popup-footer,
.popup .wrap-popup-profile .club-popup .popup-footer,
.popup .box-comment .club-popup .popup-footer {
    margin-top: 26px;
    border-radius: 4px;
}
.card_comment .club-popup .popup-footer .btn-wrap,
.card_profile .club-popup .popup-footer .btn-wrap,
.popup .wrap-popup-profile .club-popup .popup-footer .btn-wrap,
.popup .box-comment .club-popup .popup-footer .btn-wrap,
.card_detail .club-popup .popup-footer .btn-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 16px;
}
.card_comment .club-popup .popup-footer .btn,
.card_profile .club-popup .pop-page .club-popup .popup-footer .btn,
.popup .wrap-popup-profile .club-popup .popup-footer .btn,
.popup .box-comment .club-popup .popup-footer .btn {
    padding: 17px 20px;
    flex: 0 1 auto;
    font-size: 16px;
}
/* mention profile modal */
.popup .box-comment .club-popup {
    top: 20px;
    width: 402px;
}
/* popup reward, mission*/
.popup .popup-body .m20 .wrap-desc .txt-type03 { font-weight: 500; }
.popup .popup-body .m20 .wrap-label-reward {
    display: flex;
    gap: 12px 0;
    flex-direction: column;
}
.popup .popup-body .m20 .wrap-label-reward .el-category {
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .popup-body .m20 .wrap-label-reward .el-title {
    font-family: var(--font-head);
    font-size: 32px;
    font-weight: 700;
    line-height: var(--lh-lg);
    word-break: break-word;
}
.popup .popup-body .m20 .wrap-desc p,
.popup .popup-body .m20 .wrap-desc pre {
    white-space: pre-line;
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 500;
    line-height: var(--lh-lg);
    word-break: break-word;
}
.popup .popup-body .item-detail {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 16px;
    margin-bottom: -20px;
    background-color: var(--Primary-Color-Blue);
}
.popup .popup-body .item-detail .el-subject {
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .popup-body .item-detail .el-date {
    margin-top: 8px;
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.popup .popup-body .item-detail .el-members {
    display: flex;
    align-items: center;
}
.popup .popup-body .item-detail .el-members .icon {
    display: flex;
    align-items: center;
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .popup-body .item-detail .el-members .icon::before {
    display: inline-block;
    width: 20px;
    height: 20px;
    content: '';
    margin-right: 8px;
    background-color: var(--Primary-Color-Black);
    -webkit-mask-image: url(/inc/images/icon/icon-member.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-image: url(/inc/images/icon/icon-member.svg);
    mask-repeat: no-repeat;
    mask-size: contain;
}
.popup .popup-body .item-detail.is-complete {background-color: var(--Primary-Color-Black);}
.popup .popup-body .item-detail.is-complete .el-subject {color: var(--Primary-Color-White);}
.popup .popup-body .item-detail.is-complete .el-date {color: var(--Primary-Color-White);}
.popup .popup-body .item-detail.is-complete .icon {color: var(--Primary-Color-White)}
.popup .popup-body .item-detail.is-complete .icon::before {background-color: var(--Primary-Color-White)}
.popup .popup-body .item-detail.is-disabled {background-color: var(--Line-Color-Line_02);}
.popup .popup-body .item-detail.is-disabled .el-subject {color: var(--Line-Color-Line_02);}
.popup .popup-body .item-detail.is-disabled .el-date {color: var(--Line-Color-Line_02);}
.popup .popup-body .item-detail.is-disabled .icon {color: var(--Line-Color-Line_02);}
.popup .popup-body .item-detail.is-disabled .icon::before {background-color: var(--Line-Color-Line_02);}
.popup .popup-body .post-swiper { margin-bottom: 20px; }
.popup .popup-body .post-swiper .swiper-slide {
    display: flex;
    width: 100% !important;
    height: 440px;
    max-width: 100%;
    justify-content: center;
    background-color: var(--Secondary-Color-Black_Natural);
}
.popup .popup-body .post-swiper .swiper-slide img {
    width: auto;
    height: auto;
    max-width: 100%;
}
.popup .popup-body .post-swiper .swiper { padding-bottom: 42px; }
.popup .popup-body .post-swiper .swiper .swiper-button-prev,
.popup .popup-body .post-swiper .swiper .swiper-button-next { margin-top: -51px; }
.popup .popup-body .m20 .wrap-hashtag .hashtags {
    display: flex;
    gap: 4px 12px;
    flex-wrap: wrap;
    margin-bottom: 40px;
}
.popup .popup-body .m20 .wrap-hashtag .hashtags .txt-type04 { width: fit-content; }
.popup .popup-body .m20 .wrap-hashtag .hashtags .txt-type04:hover { text-decoration: underline; }
.popup .wrap-form.textarea textarea {
    z-index: 1;
    word-break: break-word;
}
/* comment */
.popup .wrap-form.textarea p.title-comment {
    margin-bottom: 20px;
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .wrap-bottom-comment {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.popup .wrap-comment {
    display: grid;
    gap: 20px;
    margin: 0 0 20px 0;
    padding-top: 40px;
    border-top: 1px solid var(--Line-Color-Line_02);
}
.popup .wrap-comment:first-child { border-top: none; }
.popup .wrap-comment .box-userinfo {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: space-between;
}
.popup .wrap-comment .box-comment+.subReply-wrap.owners-reply { margin-top: 20px; }
.popup .wrap-comment .box-date .icon-trans { cursor: pointer; }
.popup .wrap-comment .box-userinfo .wrap-popup-profile .box-profile-txt { position: relative; }
.popup .wrap-popup-profile .box-profile-txt div { display: block; }
.popup .wrap-comment .box-userinfo [class*="btn-only-icon-bg"] {
    position: absolute;
    top: 0;
    right: 0;
    width: 16px;
    height: 16px;
    padding: 3px;
    margin-left: auto;
}
.popup .wrap-comment .box-comment p {
    position: relative;
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
    word-break: break-all;
}
.popup .wrap-comment .box-date {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 20px;
}
.popup .wrap-comment .box-date p { font-size: 12px }
.popup .wrap-comment .comment-btn-wrap {
    display: flex;
    gap: 12px;
}
.popup .wrap-comment .comment-btn-wrap .btn-only-icon-notbg {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 8px;
}
.popup .wrap-comment .comment-btn-wrap .txt-type03 {
    font-size: 16px;
    line-height: var(--lh-sm);
}
.popup .mention-nickname {
    color: var(--Primary-Color-Red);
    font-size: 14px;
    font-family: var(--font-text);
    font-weight: 700;
}
.popup .wrap-form:has(.mention-nickname) textarea { padding-top: 43px; }
.popup .mention-nickname + p {
    display: inline;
    padding-left: 5px;
}
/* 댓글에서 맨션 */
.popup .mention-nickname + p .mention-nickname { padding-right: 3px; }
.popup .wrap-comment .wrap-form.textarea {
    padding: 40px 32px;
    background: var(--Secondary-Color-Black_Natural);
}
.popup .subReply-wrap {
    display: flex;
    flex-direction: column;
    position: relative;
    gap: 20px;
    padding: 20px 32px 0;
    background-color: var(--Secondary-Color-Black_Natural);
}
.popup .subReply-wrap .wrap-form.textarea {
    padding: 0;
    background: var(--Secondary-Color-Black_Natural);
}
.popup .wrap-comment .reply-write {
    position: relative;
    padding: 40px 0 20px 40px;
    background: none;
    border-top: 1px solid var(--Line-Color-Line_02);
}
.popup .wrap-comment .reply-write::after {
    content: '';
    display: block;
    position: absolute;
    top: 40px;
    left: 0px;
    width: 20px;
    height: 20px;
    border: 1px solid var(--Line-Color-Line_02);
    border-width: 0 0 1px 1px;
}
.popup .wrap-comment .reply-write.sub-reply { padding-left: 0; }
.popup .wrap-comment .reply-write.sub-reply::after { display: none; }
.popup .wrap-comment .reply-write .wrap-form.textarea {
    padding: 0;
    background: none;
    margin-top: 0;
}
.popup .wrap-comment .reply-write .wrap-form.textarea .mention-nickname {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 10;
}
.popup .wrap-comment .reply-write .wrap-form.textarea textarea { padding-left: 16px; }
.popup .subReply-wrap .wrap-form.textarea .mention-nickname {
    top: 16px;
    left: 12px;
}
.popup .subReply-wrap .wrap-comment {
    position: relative;
    margin: 0;
    padding: 0 0 40px;
}
.popup .subReply-wrap .wrap-comment.private { padding-bottom: 20px; }
.popup .subReply-wrap .box-comment {
    position: relative;
    line-height: var(--lh-lg);
}
.mention-nickname-wrap {
    display: inline-block;
    position: relative;
}
.popup .subReply-wrap+.subReply-wrap::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 1px;
    background-color: var(--Line-Color-Line_02);
}
.popup .subReply-wrap .wrap-comment:last-child { border: none; }
.popup .subReply-wrap .textarea { margin-top: 20px; }
.popup .subReply-wrap+*:has(.wrap-comment) { padding-top: 40px; }
.popup .subReply-wrap.owners-reply {
    padding: 0;
    background: none;
    gap: 40px;
}
.popup .subReply-wrap.owners-reply .wrap-comment {
    position: relative;
    padding: 40px 0 0 40px;
    border-top: 1px solid var(--Line-Color-Line_02);
}
.popup .subReply-wrap.owners-reply .wrap-comment::after {
    display: block;
    position: absolute;
    top: 40px;
    left: 0px;
    width: 20px;
    height: 20px;
    border: 1px solid var(--Line-Color-Line_02);
    content: '';
    border-width: 0 0 1px 1px;
}
.popup .wrap-form .comment-type-delete {
    display: flex;
    color: var( --Secondary-Color-Black_999999);
    align-items: center;
    gap: 4px;
    font-size: 14px;
}
.popup .wrap-form .mention-nickname {
    z-index: 10;
    position: absolute;
    top: calc(16px + 40px);
    left: calc(12px + 32px);
}
.popup .wrap-form.textarea-type-bottom { margin-top: 0; }
.popup .wrap-form.textarea-type-bottom .mention-nickname {
    top: 16px;
    left: 12px;
}
.popup .wrap-comment.private > .box-comment p {
    position: relative;
    padding-left: 20px;
    color: var(--Line-Color-Line_02);
}
.popup .wrap-comment.private > .box-comment p:before {
    content: "";
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 0;
    width: 16px;
    height: 16px;
    background: url(/inc/images/icon/icon-noti-gray.svg) no-repeat center top / 100%;
    transform: translateY(-50%);
}
/* reply mention */
.wrap-form .mention-list {
    overflow-y: auto;
    width: fit-content;
    max-height: 220px;
    border: 1px solid var(--Primary-Color-Black);
    background-color: var(--Primary-Color-White);
}
.wrap-form .mention-item { padding: 10px 32px 10px 12px; }
.wrap-form .mention-item.active,
.wrap-form .mention-item:hover {
    color: var(--Primary-Color-White);
    background-color: var(--Primary-Color-Red);
}
.wrap-form .mention-item-link {
    display: flex;
    gap: 10px;
}
.wrap-form .mention-item .wrap-popup-nickname { font-family: var(--font-text); }
.wrap-form .mention-item.active .wrap-popup-nickname,
.wrap-form .mention-item:hover .wrap-popup-nickname {
    color: var(--Primary-Color-White);
    letter-spacing: -0.28px;
    font-weight: 700;
}
.wrap-form .mention-item .wrap-popup-profile { width: auto }
.wrap-form .mention-item .box-profile-img {
    width: 24px;
    height: 24px;
    background: none;
}
.wrap-form .mention-item .box-profile-img img {
    width: 100%;
    height: 100%;
    object-fit: scale-down;
}
/* 신청 결과 안내 문구 박스, 하단 진행상태 */
.popup .wrap-requested-msg {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-bottom: 40px;
    border-bottom: 1px solid var(--Primary-Color-Black);
}
.popup .wrap-requested-msg p.txt-type03 { font-weight: 500; }
.popup .wrap-requested-msg .box-msg-summary {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: var(--Secondary-Color-Black_Natural);
    padding: 32px 40px;
    border-left: 4px solid var(--Secondary-Color-Error-color);
}
.popup .wrap-requested-msg .box-msg-summary p.tit-type05 {
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    color: var(--Secondary-Color-Error-color);
}
.popup .wrap-requested-msg .box-msg-summary p.txt-type02 {
    font-weight: 500;
    font-size: 20px;
}
.popup .wrap-requested-msg .box-msg p.txt-type03 .accent {
    color: var(--Primary-Color-Red);
    font-weight: 700;
}
.popup .wrap-requested-msg .box-userinfo button.btn-only-icon-bg01-circle span.icon-close-wh {
    width: 14px;
    height: 14px;
}
.popup .popup-footer .box-result {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 8px;
}
.popup .popup-footer .box-result.pd-sm { padding: 14px 40px; }
.popup .popup-footer .box-result.pd-md { padding: 16px 40px; }
.popup .popup-footer .box-result.pd-lg { padding: 22px 40px; }
.popup .popup-footer .box-result.bg-red {
    background: var(--Primary-Color-Red);
    color: var(--Primary-Color-White);
}
.popup .popup-footer .box-result.bg-blue {
    background: var(--Primary-Color-Blue);
    color: var(--Primary-Color-Black);
}
.popup .popup-footer .box-result.bg-gray { background: var(--Line-Color-Line_02) !important; }
.popup .popup-footer .box-result.bg-blk {
    background: var(--Primary-Color-Black);
    color: var(--Primary-Color-White);
}
.popup .popup-footer .box-result.bg-brown { background: var(--Secondary-Color-Error-color); }
.popup .popup-footer .box-result.bg-gray p,
.popup-wrapper .popup-footer .box-result.bg-gray button { color: var(--Secondary-Color-Black_777777); }
.popup .popup-footer .box-result.bg-red p { color: var(--Primary-Color-White); }
.popup .popup-footer .box-result.bg-blue p { color: var(--Primary-Color-Black); }
.popup .popup-footer .box-result.bg-blk p { color: var(--Primary-Color-White); }
.popup .popup-footer .box-result.bg-blk.compelete p { color: var(--Primary-Color-White); }
.popup .popup-footer .box-result.bg-blk.compelete button { color: var(--Primary-Color-White); }
.popup .popup-footer .box-result.bg-blk p.popup-tit-lg.no-action { color: var(--Primary-Color-Red); }
.popup .popup-footer .box-result.bg-brown p { color: var(--Primary-Color-White); }
.popup .popup-footer .box-result .btn-wrap a.btn {
    display: flex;
    width: fit-content;
    padding: 8px 0;
    gap: 8px;
}
.popup .popup-footer .box-result p { line-height: normal; }
.popup .popup-footer .box-paticipants {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.popup .popup-footer .box-paticipants .participant-nums {
    display: flex;
    align-items: center;
    color: var(--Primary-Color-Black);
    font-weight: 700;
}
.popup .popup-footer .box-paticipants .participant-nums:hover { text-decoration: underline; }
.popup .popup-footer .box-paticipants .blk { font-weight: 500; }
.popup .popup-footer .box-paticipants .participant-nums .btn-icon16 { margin-right: 4px; }
.popup .popup-footer .box-result .bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 8px;
}
.popup .popup-footer .box-result .bottom p.txt-type03:last-child {
    margin-top: 0;
    font-weight: 500;
}
.popup .popup-footer .box-confirm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 24px 40px;
    border-top: 1px solid var(--Primary-Color-Black);
    background: var(--Primary-Color-White);
}
.popup .popup-footer .box-confirm.center { justify-content: center; }
.popup .popup-footer .box-confirm .wrap-reaction-icon {
    display: flex;
    gap: 10px;
    align-items: center;
}
.popup .popup-footer .box-confirm .wrap-reaction-between {
    width: auto;
    justify-content: space-between;
}
.popup .popup-footer .box-confirm .wrap-reaction-between.icon-right-area { width: 100%; }
.popup .popup-footer .box-confirm .wrap-reaction-between > div { gap: 10px; }
.popup .popup-footer .box-confirm .wrap-reaction-icon div,
.popup .popup-footer .box-confirm .wrap-reaction-icon .btn-only-icon-notbg {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 8px;
    cursor: pointer;
}
.popup .popup-footer .box-confirm .wrap-reaction-icon div { gap: 0 12px; }
.popup .popup-footer .box-confirm .wrap-reaction-icon button.btn .txt-type03 { line-height: 1; }
.popup .popup-footer .box-confirm .wrap-reaction-icon div:nth-child(1) + p { width: 100%; }
.popup .popup-wrapper p.popup-tit-lg {
    color: var(--Primary-Color-Black);
    font-size: 24px;
    font-family: var(--font-head);
    font-weight: 700;
}
/* wrap-reaction-icon 내 아이콘이 양쪽에 치우치는 경우 */
.popup .popup-footer .box-confirm .wrap-reaction-icon.divided {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr auto auto;
    gap: 20px;
}
.popup .popup-footer .box-confirm .wrap-reaction-icon.divided div:nth-child(1) {
    justify-content: flex-start;
    margin-right: 0;
}
.popup .popup-footer .box-confirm button.btn { width: auto; }
.popup .popup-footer .box-confirm button.btn.btn-disabled { cursor: auto; }
.popup .popup-footer .box-confirm button.btn.btn-disabled-lg {
    cursor: auto;
    min-width: 235px;
}
/* mypage */
.popup .popup-body.for-switch { max-height: 100%; }
.popup .for-switch .wrap-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.popup .for-switch .wrap-switch.all {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--Primary-Color-Black);
}
.popup .for-switch .wrap-switch.all p {
    font-family: var(--font-head);
    font-size: 24px;
    font-weight: 700;
}
.popup .for-switch .wrap-switch p {
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .for-switch .switch-to-select {
    display: flex;
    flex-direction: column;
    gap: 36px;
}
.popup .for-switch .switch-to-select .wrap-switch:first-child { margin-top: 34px; }
.popup .for-switch .switch-to-select:last-child { margin-bottom: 22px; }
/* wrap-review-info */
.popup .popup-body .wrap-review-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.popup .popup-body .wrap-review-info img.img-uploaded {
    width: 80px;
    height: 80px;
    background-color: var(--Secondary-Color-Black_Natural_30);
}
.popup .popup-body .wrap-review-info .img-profile {
    position: relative;
    width: 80px;
    height: 80px;
    background-color: var(--Secondary-Color-Black_Natural_30);
}
.popup .popup-body .wrap-review-info .img-profile .btn-upload {
    position: absolute;
    align-items: center;
    right: -4px;
    bottom: -4px;
    width: 28px;
    height: 28px;
    border: 1px solid var(--Primary-Color-Black);
    background-color: var(--Primary-Color-White);
    border-radius: 0;
}
.popup .popup-body .wrap-review-info .bg-commu {
    overflow: hidden;
    position: relative;
    height: 160px;
}
.popup .popup-body .wrap-review-info .bg-commu img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.popup .popup-body .wrap-review-info {font-weight: 500;}
.popup .popup-body .wrap-review-info .wrap-radio {
    margin: 0;
    padding: 0;
}
.popup textarea::placeholder {
    width: fit-content;
    color: var(--Line-Color-Line_02);
    white-space: pre-line;
}
.popup .popup-body .wrap-notice-info .box-infotxt .txt-type03 { font-weight: 500; }
/* 팝업 내 프로필 사진 추가 영역 */
.popup .wrap-form.attach {
    width: 100%;
    justify-content: flex-start;
    flex-direction: row;
}
.popup .wrap-form.attach .attach-box {
    width: 94px;
    height: 94px;
    background: url(/inc/images/img/img_upload_image_new.png) no-repeat;
    background-size: cover;
    margin-right: 16px;
}
.popup .wrap-form.attach .upload-btn {
    display: flex;
    height: 100%;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    max-width: 100%;
}
.popup .wrap-form.attach .upload-btn .img-profile {
    position: relative;
    background-color: var(--Secondary-Color-Black_Natural_30);
}
.popup .wrap-form.attach .upload-btn .img-profile img {
    width: 90px;
    object-fit: cover;
}
.popup .wrap-form.attach .upload-btn .img-profile .btn-upload {
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 28px;
    height: 28px;
    border: 1px solid var(--Primary-Color-Black);
    background-color: var(--Primary-Color-White);
    border-radius: 0;
    align-items: center;
}
.popup .wrap-form.attach .wrap-form-bottom.comment-type04 ul li:first-child { margin: 0 0 15px 0; }
.popup .wrap-form.attach .wrap-form-bottom.comment-type04 {
    margin-top: 0;
    align-items: flex-start;
}
.popup .wrap-form.attach .wrap-form-bottom.comment-type04 ul { margin-block-end: 0; }
/* 마케팅 수신 동의 */
.popup-notice-wrap .box-line+.box-line {
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px solid var(--Line-Color-Line_02);
}
.popup-notice-wrap .box-line .el-title {
    font-family: var(--font-head);
    font-weight: 700;
    font-size: 24px;
    line-height: var(--lh-lg);
}
.popup-notice-wrap .box-line .el-desc {
    font-family: var(--font-text);
    font-weight: 500;
    font-size: 16px;
    line-height: var(--lh-lg);
}
.popup-notice-wrap .box-line p {
    font-family: var(--font-text);
    font-size: 14px;
}
.popup-notice-wrap .box-line p {
    font-family: var(--font-text);
    font-size: 14px;
    line-height: var(--lh-lg);
}
.popup-notice-wrap input[type="checkbox"],
.popup-notice-wrap input[type="radio"] {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border: 0;
    opacity: 0;
    -webkit-appearance: none;
    z-index: -1;
}
.popup-notice-wrap .cp-input-check label {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-family: var(--font-text);
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}
.popup-notice-wrap .cp-input-check input + label::before {
    content: "";
    display: block;
    flex-shrink: 0;
    padding-top: 0.12rem;
    width: 1.5rem;
    height: 1.5rem;
    background-image: url(/inc/images/icon/icon-checkbox.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.popup-notice-wrap .cp-input-check input:checked + label::before {
    background-image: url(/inc/images/icon/icon-checkbox-checked.svg);
}

/* model-popup */
.model-popup {
    display: none;
    overflow-x: initial;
    z-index: 1001;
    top: 50%;
    left: 50%;
    width: calc(100% - 40px);
    max-width: 960px;
    max-height: calc(var(--vh, 1vh) * 100);
    background: var(--Primary-Color-White);
    transform: translate(-50%, -50%);
}
.model-popup.size-xl { max-width: 1200px; }
.model-popup.layer-360-bottom {
    width:100%;
    max-width: 360px;
}
.model-popup.fullWidth {
    width: 100%;
    max-width: 100%;
}
.model-popup.fullWidth .popup-wrapper { max-width: 960px; }
.model-popup.fullWidth .popup-wrapper .popup-body { max-height: calc(100vh - 286px); }

/* model-popup - forModel */
.model-popup.forModel {
    overflow: hidden;
    max-width: 1200px;
}
.model-popup.forModel .popup-header { padding: 28px 40px 27px 40px; }
.model-popup.forModel .popup-body {
    padding: 40px 40px 160px 40px;
    max-height: calc(100vh - 160px);
    margin-bottom: 0;
}
.model-popup.forModel .inner-body-model {
    padding: 40px 0 0 0;
    gap: 60px;
    max-height: 100%;
}
.model-popup.forModel .inner-body-model:first-child { padding-top: 0; }
.model-popup.forModel .inner-body-model .popup-body-innerbox {
    padding: 60px 0 0 0;
    border-bottom: 1px solid var(--Line-Color-Line_02);
}
.model-popup.forModel .inner-body-model .popup-body-innerbox:first-child {
    padding-top: 0;
    padding-bottom: 0;
}
.model-popup.forModel .inner-body-model .popup-body-innerbox:last-child {
    padding-top: 60px;
    padding-bottom: 0;
    border-bottom: 0;
}
.model-popup.forModel .inner-body-model .container-desc {
    display: flex;
    width: 100%;
    flex-direction: column;
    gap: 32px;
    padding: 24px 0 60px 0;
}
.model-popup.forModel .inner-body-model .container-desc:first-child { padding: 0 0 60px 0; }
.model-popup.forModel .inner-body-model .popup-body-innerbox:last-child .container-desc:not(.video-func) { padding: 24px 0 0 0; }
.model-popup.forModel .inner-body-model .wrap-function {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.model-popup.forModel .inner-body-model .desc-note {
    margin-top: 8px;
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
    color: var(--Secondary-Color-Black_555555);
}
.model-popup.forModel .inner-body-model .wrap-desc {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.model-popup.forModel .inner-body-model .wrap-desc.lg { gap: 12px; }
.model-popup.forModel .inner-body-model .wrap-desc.sm { gap: 4px; }
.model-popup.forModel .inner-body-model .box-desc-divide {
    display: flex;
    flex-direction: column;
    gap: 0;
}
/* popup > models > video */
.model-popup.forModel .inner-body-model .video-func {
    display: flex;
    width: 100%;
    padding: 0 0 60px 0;
    gap: 40px;
}
.model-popup.forModel .inner-body-model .popup-body-innerbox:last-child .video-func { padding-bottom: 0; }
.model-popup.forModel .inner-body-model .video-func .wrap-video-func {
    display: flex;
    width: 100%;
    align-items: flex-start;
    gap: 20px;
}
.model-popup.forModel .inner-body-model .video-func .box-video-func {
    display: grid;
    width: calc(100% / 3);
    gap: 20px;
}
.model-popup.forModel .inner-body-model .video-func .box-video {
    position: relative;
    width: 100%;
    height: 100%;
}
.model-popup.forModel .inner-body-model .video-func .box-video video { 
    width: 100%;
    height: 100%;
    object-fit: fill;
}
.model-popup.forModel .inner-body-model .video-ratio--rectangle .box-video video {
    object-fit: cover;
    aspect-ratio: 4 / 3;
}
.model-popup.forModel .inner-body-model .video-func .box-video button {
    position: absolute;
    right: 20px;
    bottom: 20px;
    background-color: rgba(0, 0, 0, 0.5);
}
.model-popup.forModel .inner-body-model .video-func .box-video button.btn:not(.btn-only-icon-notbg):hover,
.model-popup.forModel .inner-body-model .video-func .box-video button.btn:not(.btn-only-icon-notbg):active { background-color: var(--Primary-Color-Red); }
.model-popup.forModel .inner-body-model .video-func [class*=t-body-] { display: flex; }
.model-popup.forModel .inner-body-model .video-func [class*=t-body-] span { margin-right: 10px; }
.model-popup.forModel .inner-body-model .model-video-wrap { position: relative; }
.model-popup.forModel .inner-body-model .model-video-wrap .img-wrap a:before {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 138px;
    height: 138px;
    background: url(/inc/images/icon/icon-play-video.svg) no-repeat center center / 100%;
    content: "";
    transform: translate(-50%, -50%);
    cursor: pointer;
}
.model-popup.forModel .inner-body-model .model-video-wrap:hover .img-wrap a::before { background-image: url(/inc/images/icon/icon-play-video-hover.svg); }
/* popup > models > single contents */
.model-popup.forModel .popup-body.single .inner-body-model {
    padding: 0;
    gap: 60px;
    max-height: calc(100vh - 250px);
}
.model-popup.forModel .popup-body.single .popup-body-innerbox { padding-top: 0; }
.model-popup.forModel .popup-body.single .container-desc { padding: 24px 0 160px 0; }
.model-popup.forModel .popup-body.single .container-desc.video-func { padding-bottom: 0; }
/* popup > models > close */
.model-popup.forModel .popup-wrapper .btn-wrap button.pop-close { 
    display: flex;
    top: 32px;
    align-items: center;
}
.model-popup.forModel .popup-wrapper button.pop-close .icon-close { position: relative; }
@media screen and (max-width: 1023px) {
    .model-popup {
        width: 100vw;
        height: 100vh;
        max-width: none;
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
    .popup .popup-wrapper .inner-header-txt { padding-right: 35px; }
    .model-popup.size-xl {
        width: 100vw;
        max-width: none;
    }
    .model-popup.layer-360-bottom {
        top: auto;
        bottom: 0;
        left: auto;
        width: 100%;
        height: auto;
        background: var(--Primary-Color-White);
        max-width: none;
        min-height: auto;
        transform: translate(0);
    }
    /* model-popup - forModel */
    .model-popup.forModel {
        height: 100vh;
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
    .model-popup.forModel .popup-header {
        position: sticky;
        width: 100%;
        padding: 16px 24px;
    }
    .model-popup.forModel .popup-wrapper {
        height: 100vh;
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
    .model-popup.forModel .popup-body {
        padding: 40px 24px 024px;
        max-height: calc(100% - 60px);
    }
    .model-popup.forModel .video-wrapper .popup-body {
        padding: 40px 24px 0 24px;
        max-height: calc(100vh - 60px);
    }
    /* popup - onlyTxt */
    .popup .onlyTxt .popup-body .popup-body-innerbox p.txt-type01,
    .popup .onlyTxt .popup-body .popup-body-innerbox .tit-type03 {
        font-size: 18px;
        font-weight: 600;
    }
    .popup .onlyTxt .popup-body .popup-body-innerbox p.popup-tit-lg { font-size: 24px; }
    /* single */
    .model-popup.forModel .popup-body.single {
        padding: 40px 24px 100px 24px;
        max-height: calc(100% - 60px);
    }
    .model-popup.forModel .popup-body.single .inner-body-model {
        padding: 0;
        max-height: calc(100% - 60px);
    }
    .model-popup.forModel .popup-body.single .container-desc { padding: 24px 0 36px 0; }
    .model-popup.forModel .inner-body-model {
        padding: 0 0 100px 0;
        gap: 36px;
        max-height: 100%;
    }
    .model-popup.forModel .inner-body-model {
        display: grid;
        padding: 40px 0 100px 0;
        gap: 36px;
    }
    .model-popup.forModel .inner-body-model .type01 {
        padding: 40px 24px 100px 24px;
        gap: 36px;
    }
    .model-popup.forModel .inner-body-model .type02 {
        padding: 28px 24px 100px 24px;
        gap: 36px;
    }
    .model-popup.forModel .inner-body-model .wrap-model-video { height: 256px; }
    .model-popup.forModel .inner-body-model .wrap-model-video button img {
        width: 100px;
        height: 100px;
    }
    .model-popup.forModel .inner-body-model .popup-body-innerbox {
        padding: 0;
        border-bottom: 1px solid var(--Line-Color-Line_02);
    }
    .model-popup.forModel .inner-body-model .container-desc { padding: 24px 0 36px 0; }
    .model-popup.forModel .inner-body-model .popup-body-innerbox:last-child .container-desc { padding: 24px 0 0 0; }
    .model-popup.forModel .inner-body-model .popup-body-innerbox:first-child {
        padding-top: 0;
        padding-bottom: 0;
    }
    .model-popup.forModel .inner-body-model .popup-body-innerbox:last-child {
        padding-top: 0;
        padding-bottom: 0;
        border-bottom: 0;
    }
    .model-popup.forModel .inner-body-model .wrap-desc.lg { gap: 12px; }
    .model-popup.forModel .btn-wrap button.pop-close {
        top: 12px;
        right: 18px;
        width: 36px;
        height: 36px;
    }
    .model-popup.forModel button.pop-close .icon-close {
        width: 24px;
        height: 24px;
    }
    /* popup > models > video */
    .model-popup.forModel .inner-body-model .video-func {
        padding: 0 0 36px 0;
        gap: 28px;
    }
    .model-popup.forModel .inner-body-model .popup-body-innerbox:last-child .video-func { padding: 0 0 0 0; }
    .model-popup.forModel .inner-body-model .video-func .wrap-video-func {
        flex-direction: column;
        gap: 28px;
    }
    .model-popup.forModel .inner-body-model .video-func .box-video-func {
        display: grid;
        width: 100%;
        gap: 12px;
    }
    .model-popup.forModel .inner-body-model .video-func .box-video button {
        right: 12px;
        bottom: 16px;
        width: 20px;
        height: 20px;
    }
    .model-popup.forModel .inner-body-model .video-func .box-video button [class*=btn-icon] {
        width: 12px;
        height: 12px;
    }
    .model-popup.forModel .inner-body-model .model-video-wrap .img-wrap a:before {
        width: 66px;
        height: 66px;
    }
}
/* 마케팅 동의 팝업 */
.pop-wrap.text-wrap{
  padding: 2.5rem;  
  max-width: 400px;
  border-radius: 0.25rem;
}
.pop-wrap.text-wrap .text-area{
  padding-bottom:40px;
}
.pop-wrap.text-wrap .text-area p{
  font-family: 'Hyundai Sans Text';
  font-weight: 500;
  font-size: 14px;
  line-height: 140%;
}
.pop-wrap.text-wrap .color-red{color:var(--Primary-Color-Red);}
.pop-wrap.text-wrap .btn-wrap-type2{
  margin-top:26px;
}
@media screen and (max-width: 1023px) {
    /* 마케팅 동의 팝업 */
    .pop-wrap.text-wrap{
      max-width: 100%;
    }
}
/* bottom-popup */
.bottom-popup,
.bottom-popup2 {
    display: none;
    top: 50%;
    left: 50%;
    z-index: 1003;
    background: var(--Primary-Color-White);
    /* width: calc(100% - 40px); */
    max-width: 500px;
    transform: translate(-50%, -50%);
}
@media screen and (max-width: 1023px) {
    /* bottom-popup */
    .bottom-popup,
    .bottom-popup2 {
        display: none;
        top: auto;
        bottom: 0;
        left: 0;
        width: 100%;
        background: var(--Primary-Color-White);
        max-width: none;
        transform: translate(0);
    }
}
/* ajax-popup */
.ajax-popup {
    display: none;
    top: 50%;
    left: 50%;
    z-index: 1001;
    width: calc(100% - 40px);
    background: var(--Primary-Color-White);
    max-width: 960px;
    transform: translate(-50%, -50%);
}

/* side-popup */
.side-popup {
    display: none;
    top: 0;
    right: -100%;
    z-index: 1001;
    width: 720px;
    height: 100vh;
    background: var(--Primary-Color-White);
}
.side-popup.on {
    display: block;
    animation: sideAni 0.3s;
    animation-fill-mode: forwards;
}
.side-popup .popup-header {
    padding: 24px 40px;
    border-bottom: 1px solid var(--Line-Color-Line_02);
}
.side-popup .popup-header .tit-type03 {
    font-size: 32px;
}
.side-popup .popup-body {
    padding: 40px 40px 100px 40px;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}
.side-popup .popup-body article:not(:last-child)::after {
    display: block;
    width: 100%;
    height: 1px;
    margin: 60px 0;
    background: var(--Line-Color-Line_02);
    content: "";
}
.side-popup .popup-body .wrap-popup-title {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 24px;
}
.side-popup .popup-body .wrap-popup-title .tit-type04 { font-weight: 700; }
.side-popup .popup-body .wrap-popup-title .wrap-desc .txt-type03 { font-weight: 500; }
.side-popup .popup-body .wrap-zone-info {
    display: grid;
    width: 100%;
    gap: 40px 28px;
    margin-top: 60px;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    justify-content: center;
}
.side-popup .popup-body .wrap-zone-info .box-info {
    display: flex;
    width: 100%;
    height: 100%;
    height: 100%;
    flex-direction: column;
    gap: 8px;
}
.side-popup .popup-body .box-info.full {
    display: flex;
    width: 100%;
    margin: 40px 0 0 0;
    flex-direction: column;
    gap: 8px;
}
.side-popup .popup-body .wrap-zone-info a { text-decoration: underline; }
.side-popup .popup-body .wrap-zone-info .box-info .tit-type05 {
    font-size: 20px;
    font-weight: 700;
}
.side-popup .popup-body .wrap-zone-info .box-info .txt-type02,
.side-popup .popup-body .box-info.full .txt-type02 {
    font-family: var(--font-text);
    font-size: 20px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.side-popup .popup-body .wrap-zone-info .box-info .txt-type02.cutoff-desc { max-width: 172px; }
@media screen and (max-width: 1023px) {
    .side-popup {
        display: none;
        top: 0;
        right: 0;
        z-index: 1001;
        width: 100%;
        height: 100vh;
        background: var(--Primary-Color-White);
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }
}
/** share-popup **/
.share-popup.popup-wrapper .popup-header { padding: 13px 24px; }
.share-popup.popup-wrapper .popup-header h3 { font-size: 24px; }
.share-popup.popup-wrapper .popup-body.share-icn-wrap { padding: 80px 98px; }
.share-popup.popup-wrapper .popup-body.share-icn-wrap .box-row {
    --count: 0;
    display: grid;
    grid-template-columns: repeat(var(--count), 1fr);
    gap: 48px;
    justify-content: center;
    align-items: center;
}
.share-popup.popup-wrapper .popup-body.share-icn-wrap .box-row .box-icn {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* toast-popup */
.toast-popup {
    display: none;
    position: fixed;
    bottom: 30px;
    left: 50%;
    z-index: 1100;
    padding: 14px 16px;
    background: var(--Primary-Color-Blue);
    transform: translateX(-50%);
    border-radius: 4px;
    box-shadow: 0px 4px 8px 3px rgba(0, 0, 0, 0.15),
        0px 1px 3px 0px rgba(0, 0, 0, 0.3);
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}

@media screen and (max-width: 1023px) {
    /* popup common */
     /* popup-wrapper */
    .popup-wrapper {
        margin: 0 auto;
        padding: 0;
    }
    /* popup-header */
    .popup-wrapper .popup-header {
        z-index: 8;
        padding: 16px 24px;
    }
    /* popup-body */
    .popup-wrapper .popup-body {
        display: grid;
        position: relative;
        overflow-y: auto;
        gap: 40px 0;
        z-index: 6;
        height: 100%;
        /* max-height: calc(100vh - 130px); */
        max-height: calc(var(--vh, 1vh) * 100 - 130px);
        padding: 40px 24px 60px 24px;
    }
    .popup-wrapper .popup-body.layer-noc-member {
        max-height: calc(var(--vh, 1vh) * 100);
        padding-bottom: 130px;
    }
    .popup-wrapper .popup-body.height-longer-mobile {
        z-index: 6;
        max-height: calc(var(--vh, 1vh) * 100 - 190px);
        padding: 28px 24px 70px 24px;
    }
    .popup-wrapper .popup-body.height-longer-mobile.owners-post {
        z-index: 6;
        max-height: calc(var(--vh, 1vh) * 100 - 150px);
        padding: 28px 24px 70px 24px;
    }
    .popup-wrapper .popup-body.height-longer-mobile * { max-width: 100%; }
    .popup-wrapper .popup-body.body-pop-mobile { max-height: calc(var(--vh, 1vh) * 100 - 200px);
    }
    /* 더보기 있는 챌린지 팝업 높이 */
    .popup-wrapper:has(.box-confirm > button) .popup-body:has(.type-modal-more) { max-height: calc(var(--vh, 1vh) * 100 - 160px); }
    /* 더보기 있는 일반 팝업 높이 */
    .popup-wrapper .popup-body:has(.type-modal-more) { max-height: calc(var(--vh, 1vh) * 100 - 97px); }
    /* 댓글 있는 경우 더보기 버튼 여백 */
    .popup-wrapper .popup-body .type-modal-more {
        padding-top: 4px;
        padding-bottom: 0;
    }
    /* 댓글 없는 경우 더보기 버튼 여백 */
    .popup-wrapper .popup-body:not(:has(.wrap-comment)) .type-modal-more { padding-top: 16px; }
    .popup-wrapper .popup-body.height-longer-mobile .wrap-hashtag .wrap-date.ty01 { margin-bottom: 72px; }

    /* popup - btn(close, navigation) */
    /* popup - btn: close */
    .popup .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x {
        top: 11px;
        right: 24px;
        width: 24px;
        height: 24px;
    }
    .popup button.btn-only-icon-notbg.popup-close-btn-x span.icon-close {
        top: 0;
        width: 100%;
    }
    /* popup - btn: navigation */
    .popup-wrapper .wrap-navigation {
        display: flex;
        top: 50%;
        z-index: 6;
        width: 100%;
    }
    .popup-wrapper .wrap-navigation .modal-btn {
        width: 48px;
        height: 48px;
        background: rgba(0, 0, 0, 0.5);
        border-radius: 0;
    }
    .popup-wrapper .wrap-navigation .modal-btn.left { left: 0; }
    .popup-wrapper .wrap-navigation .modal-btn.right { right: 0; }
    .popup-wrapper .wrap-navigation .modal-btn .icon-left,
    .popup-wrapper .wrap-navigation .modal-btn .icon-right { width: 24px; height: 24px; }
    .popup-wrapper .wrap-navigation .modal-btn .icon-left {
        background: url(/inc/images/icon/icon-arrow01_left_white.svg);
        background-size: contain;
    }
    .popup-wrapper .wrap-navigation .modal-btn .icon-right {
        background: url(/inc/images/icon/icon-arrow01_right_white.svg);
        background-size: contain;
    }
    .popup-wrapper .wrap-comment {
        margin: 0 0 20px 0;
        gap: 20px;
    }
    .popup-wrapper .wrap-comment:last-child { margin-bottom: 0; }
    .popup-wrapper .wrap-bottom-comment { margin-bottom: 20px; }
    .popup-wrapper .wrap-bottom-comment:last-child { margin-bottom: 0; }
    .popup-wrapper .wrap-comment .wrap-form.textarea { padding: 20px 20px 40px; }
    .popup-wrapper .subReply-wrap { padding: 20px 20px 0; }
    .popup-wrapper .subReply-wrap .wrap-form.textarea { padding: 0; }
    .popup-wrapper .subReply-wrap .textarea { margin-bottom: 20px; }
    .popup-wrapper .subReply-wrap .wrap-comment::after {
        right: -20px;
        left: -20px;
    }
    .popup-wrapper .wrap-form .mention-nickname {
        top: calc(16px + 20px);
        left: calc(12px + 20px);
    }
    /* 신청 결과 안내 문구 박스, 하단 진행상태 */
    .popup-wrapper .popup-body .wrap-requested-msg .box-msg-summary {padding: 20px 24px;}
    .popup .wrap-requested-msg .box-msg-summary p.tit-type05 { font-size: 18px; }
    .popup .wrap-requested-msg .box-msg-summary p.txt-type02 { font-size: 17px; }
    .popup-wrapper .popup-body .instruct-wrap { gap: 24px; }
    .popup-wrapper .popup-body .m20 .wrap-label-reward .tit-type04 { font-size: 24px; }
    .popup-wrapper .popup-body .m20.mo-m12 { gap: 12px 0; }
    .popup-wrapper .popup-body .post-swiper .swiper-slide {
        height: auto;
        max-height: 555px;
    }
    /* 댓글 모달 */
    .card_comment .club-popup,
    .card_profile .club-popup,
    .popup-wrapper .wrap-popup-profile .club-popup,
    .popup-wrapper .box-comment .club-popup {
        position: fixed;
        top: unset;
        bottom: 0;
        left: 0;
        width: 100%;
        height: auto;
        border: none;
        min-height: unset;
        max-width: unset;
        transform: unset;
    }
    .model-popup.on .popup-wrapper .popup-body:has(.club-popup.on) { z-index: 9999; }
    .popup-wrapper .popup-footer {
        position: fixed;
        bottom: 0%;
        z-index: 6;
        width: 100%;
        padding: 16px 24px;
    }
    .card_comment .club-popup .popup-footer .btn,
    .card_profile .club-popup .pop-page .club-popup .popup-footer .btn,
    .popup-wrapper .wrap-popup-profile .club-popup .popup-footer .btn,
    .popup-wrapper .box-comment .club-popup .popup-footer .btn { flex: 1; }
    .popup.club-info-popup.bottom-popup {
        position: fixed;
        z-index: 1005;
        top: auto;
        left: auto;
        width: 100%;
    }
    .popup-wrapper .popup-footer.footer-no-pd { position: fixed; }
    .popup-wrapper .popup-footer .btn-wrap {
        width: 100%;
        flex: 1;
    }
    .popup-wrapper .popup-footer .btn-wrap button[class*="btn-lg"],
    .popup-wrapper .popup-footer .btn-wrap button[class*="btn-md"] {
        width: 100%;
        padding: 17px 20px;
        align-self: stretch;
        font-size: 16px;
    }
    .popup-wrapper .popup-footer+.btn-wrap {
        width: 100%;
        padding: 0 24px 18px 0;
    }
    .popup-wrapper .wrap-navigation+.btn-wrap {
        position: absolute;
        top: 0;
        width: 100%;
        height: fit-content;
        padding: 0 24px 18px 0;
    }
    .popup-wrapper .popup-body-innerbox { margin: 0; }
    .popup-wrapper .popup-header h3 { font-size: 20px; }
    .popup-wrapper.invite {
        width: 100%;
        min-width: 100%;
    }
    .popup-wrapper.invite .popup-header {
        height: auto;
        padding: 0;
        font-family: var(--font-head);
        font-weight: 700;
    }
    .popup-wrapper.invite p.tit-type05 { font-size: 18px; }
    .popup-wrapper.invite .popup-body { width: 100%; }
    .popup-wrapper.invite .popup-body p.txt-type02 { font-size: 17px; }
    .popup-wrapper.invite .popup-body .btn-wrap {
        width: 100%;
        padding: 0;
        flex-direction: column;
        gap: 8px 0;
    }
    .popup-wrapper.invite .popup-body .btn-wrap button {
        width: 100%;
        padding: 14px 27px;
        font-size: 16px;
    }
    .popup-wrapper.invite .popup-footer .btn-wrap button {
        padding: 14px 24px;
        font-size: 16px;
    }
    .popup-wrapper.invite .popup-footer { position: relative; }
    .popup-body-innerbox .wrap-form.attach { flex-direction: column; }
    .popup-body-innerbox .wrap-form.attach .attach-box {
        margin-right: 0;
        margin-bottom: 16px;
    }
    .popup-body-innerbox .wrap-form.attach .wrap-form-bottom.comment-type04 { margin-top: 20px; }
    .popup-body-innerbox .wrap-form.attach .wrap-form-bottom.comment-type04 ul {
        margin-left: 0;
        padding-inline-start: 20px;
    }
    .popup-body-innerbox .wrap-form.attach .wrap-form-bottom.comment-type04 ul li { line-height: var(--lh-lg); }
    .popup-body-innerbox .wrap-form.attach .wrap-form-bottom.comment-type04 ul li+li { margin-top: 6px; }

    /* onlyTxt */
    .onlyTxt {
        width: 100%;
        min-width: 100%;
    }
    .onlyTxt .popup-body {
        z-index: 6;
        padding: 20px;
    }
    .onlyTxt .popup-body.pd-24 { padding: 40px 24px; }
    .onlyTxt .popup-body p.tit-type05 { margin-bottom: 0; }
    .onlyTxt .popup-body-innerbox p.tit-type05 { font-size: 18px; }
    .onlyTxt .popup-body-innerbox ul.li-aparted { width: calc(100% - 40px); }
    .onlyTxt .popup-body-innerbox ul.li-aparted li:last-child { margin-bottom: 0; }
    .onlyTxt .popup-body .popup-body-innerbox p.popup-tit-lg { font-size: 24px; }
    .onlyTxt .popup-body .popup-body-innerbox p.popup-tit-lg.no-mb {
        font-size: 24px;
        margin-bottom: 0;
    }
    .onlyTxt .popup-body .popup-body-innerbox p.tit-type05.desc {
        font-weight: 500;
        font-size: 14px;
    }
    .onlyTxt .popup-body .popup-body-innerbox p.txt-type01,
    .onlyTxt .popup-body .popup-body-innerbox .tit-type03 { font-size: 18px; }
    .onlyTxt .popup-footer { left: 0; }
    .onlyTxt .popup-footer.borderline {
        padding: 16px 24px;
        border-top: 1px solid var(--Primary-Color-Black);
    }
    .onlyTxt .popup-footer .btn-wrap {
        display: flex;
        flex-direction: column;
        gap: 8px 0;
    }

    /* 폼 요소가 없는 팝업: 푸터의 버튼이 2개일 때 */
    .onlyTxt .popup-footer.wrap-multi-btn {
        display: flex;
        padding: 16px 24px;
    }
    .onlyTxt .popup-footer.wrap-multi-btn .btn-wrap.multi-btn {
        width: 100%;
        flex-direction: row;
        gap: 8px;
    }
    .onlyTxt .popup-footer.wrap-multi-btn .btn-wrap.multi-btn button[class*="btn-lg"],
    .onlyTxt .popup-footer.wrap-multi-btn .btn-wrap.multi-btn button[class*="btn-md"] { width: 100%; }
    .popup .popup-body-innerbox .wrap-checkmail {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 8px;
        padding: 40px 24px;
    }
    .popup .popup-body-innerbox .wrap-checkmail p:nth-child(1) {
        font-family: var(--font-text);
        font-size: 17px;
        font-weight: 500;
        line-height: var(--lh-lg);
    }
    .popup .popup-body-innerbox .wrap-checkmail .btn-wrap { padding: 8px 0; }
    .popup .popup-body-innerbox .wrap-checkmail.changeMail {
        display: flex;
        padding: 0;
        gap: 28px;
        justify-content: center;
        align-items: center;
    }
    .popup .popup-body-innerbox .wrap-checkmail.changeMail>div:nth-child(1) { width: 100%; }
    .popup .popup-body-innerbox .wrap-checkmail.changeMail .btn-wrap .btn.md-txt-btn01 {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 0;
        font-size: 16px;
    }
    .popup .popup-footer .box-result { padding: 14px 24px; }
    .popup .popup-footer .btn-wrap-type3 button { width: 100%; }
    .popup .popup-footer .box-result.pd-sm { padding: 14px 24px; }
    .popup .popup-footer .box-result.pd-md { padding: 13px 24px; }
    .popup .popup-footer .box-result.pd-lg { padding: 14px 16px; }
    .popup .popup-footer .box-result p.popup-tit-lg { font-size: 18px; }
    .popup .popup-footer .box-confirm {
        width: 100%;
        padding: 16px 24px;
        flex-direction: column;
        gap: 20px;
    }
    .popup .popup-footer .box-confirm .wrap-reaction-icon { width: 100%; }
    .popup .popup-footer .box-confirm .wrap-reaction-icon.wrap-reaction-between { width: 100%; }
    .popup .popup-footer .box-confirm .wrap-reaction-icon div {
        position: relative;
        top: -1px;
        gap: 0 10px;
    }
    .popup .popup-footer .box-confirm .wrap-reaction-icon.wrap-reaction-between>div { gap: 10px; }
    .popup .popup-footer .box-confirm .wrap-reaction-icon div p.txt-type03 {
        width: 100%;
        word-break: keep-all;
    }
    .popup .popup-footer .box-confirm .wrap-reaction-icon div:nth-child(3) { margin-left: auto; }
    .popup .popup-footer .box-confirm .wrap-reaction-icon .btn-only-icon-notbg {
        justify-content: flex-start;
        align-items: center;
    }
    .popup .popup-footer .box-confirm>button.btn { width: 100%; }
    .popup .popup-footer .box-confirm .wrap-reaction-icon.divided button.btn { width: auto; }
    .popup .popup-body .wrap-image-reward { z-index: -1; }
    .popup .popup-body .wrap-image-reward .wrap-date { margin-bottom: 44px; }
    .wrap-image-reward img { max-width: 100%; }
    /* 마이페이지 스위치 */
    .popup .popup-body.for-switch .wrap-switch {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-template-columns: 60% auto;
    }
    .popup .popup-body.for-switch .wrap-switch .wrap-switch:first-child { margin-top: 32px; }
    .popup .popup-body.for-switch .wrap-switch .wrap-switch:last-child { margin-bottom: 0; }
    .popup .popup-body.for-switch .wrap-switch.all p,
    .popup .popup-body.for-switch .wrap-switch p { font-size: 18px; }
    /* 마이페이지 notice */
    .popup .popup-body .tit-type04.notice-header { font-size: 24px; }
    .popup .popup-body .tit-type04 { font-size: 18px; }
    .popup .popup-body .tit-type04.main-header { font-size: 24px; }
    .popup .popup-body .wrap-notice-info .tit-type05 { font-size: 18px; }
    .popup .popup-body .selectbox-wrap .selectbox-trigger { position: relative; }
    .popup .popup-body .popup-body-innerbox .selectbox-wrap ul.selectbox-options {
        position: fixed;
        top: 0;
        z-index: 3;
        overflow-y: auto;
        max-height: 100vh;
        padding-bottom: 100px;
    }
    .popup .owners-post .selectbox-wrap ul.selectbox-options {
        top: auto !important;
        bottom: 83px;
        left: 0;
        max-height: 65% !important;
        padding-bottom: 0 !important;
    }
    .popup .owners-post .popup-body-innerbox .selectbox-wrap ul.selectbox-options li:nth-child(2) {margin-top: 0;}
    .popup .popup-body .selectbox-wrap ul.selectbox-options li.moclose-btn {
        display: flex;
        position: fixed;
        justify-content: flex-end;
        z-index: 1;
        top: -0.5px;
        width: 100%;
        padding: 18px 24px 18px 0;
        border-bottom: 1px solid var(--Line-Color-Line_01);
        background: var(--Primary-Color-White);
    }
    .popup .popup-body .selectbox-wrap ul.selectbox-options li:nth-child(2) {
        position: relative;
        margin-top: 60px;
    }
    .popup .popup-body .selectbox-wrap ul.selectbox-options li.option {
        width: 100%;
        border-top: 0;
        border-left: 0;
        border-right: 0;
        border-bottom: 1px solid var( --Line-Color-Line_01);
    }

    /* share popup */
    .share-popup.popup-wrapper {
        height: fit-content;
        max-width: 100%;
    }
    .share-popup.popup-wrapper .popup-header h3 { font-size: 18px; }
    .share-popup.popup-wrapper .popup-body.share-icn-wrap { padding: 44px 28px; }
    .share-popup.popup-wrapper .popup-close-btn-x { top: 13px; }

    /* side-popup */
    .side-popup .popup-header { padding: 16px 24px; }
    .side-popup .popup-header .tit-type03 { font-size: 20px; }
    .side-popup .popup-body {
        padding: 28px 24px 64px 24px;
        max-height: calc(100vh - 60px);
    }
    .side-popup .popup-body article:not(:last-child)::after { margin: 36px 0; }
    .side-popup .popup-body .wrap-popup-title .tit-type04 { font-size: 18px }
    .side-popup .popup-body .wrap-zone-info {
        gap: 28px 0;
        grid-template-columns: auto;
        justify-content: flex-start;
        margin-top: 36px;
    }
    .side-popup .popup-body .box-info.full { margin: 28px 0 0 0; }
    .side-popup .popup-body .wrap-zone-info .box-info { width: 100%; }
    .side-popup .popup-body .wrap-zone-info .box-info .txt-type02,
    .side-popup .popup-body .box-info.full .txt-type02 { font-size: 17px; }
    .side-popup .popup-body .wrap-zone-info .box-info .tit-type05,
    .side-popup .popup-body .box-info.full .tit-type05 { font-size: 18px }
    .side-popup .popup-body .wrap-zone-info .box-info .cutoff-desc { max-width: 100%; }
    .side-popup .btn-wrap button.popup-close-btn-x span.icon-close {
        width: 24px;
        height: 24px;
    }
    .popup.side-popup .btn-wrap button.popup-close-btn-x { top: 17px; }

    /* club-info-popup */
    .popup.club-info-popup.bottom-popup .popup-body .pop-gray { gap: 20px; }
    .popup.club-info-popup.bottom-popup .popup-footer .btn-wrap { flex: 0 0 auto; }
    .club-info-popup .popup-footer { position: relative; }
}

@media screen and (max-width: 920px) {
    .popup .wrap-popup-profile .box-profile-txt p.txt-type04.nickname { max-width: 360px; }
}

@media screen and (max-width: 500px) {
    .break-no-pc-only { display: block; }
    .popup .wrap-popup-profile .box-profile-txt p.txt-type04.nickname { max-width: 180px; }
}
/* popup - member */
.popup .popup-body .layer-member-option * { max-width: none; }
.popup .popup-body .layer-member-option .selectbox-options {width: auto;}
.popup .popup-body .layer-member-list {
    display: grid;
    margin-top: 40px;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}
.popup .popup-body .layer-member-list .item {
    display: flex;
    padding: 0 0;
    align-items: center;
}
.popup .popup-body .layer-member-list .item .num {
    text-align: center;
    flex: 0 0 77px;
    font-family: var(--font-head);
    font-size: 40px;
    font-weight: 700;
    line-height:  var(--lh-base);
}
.popup .popup-body .layer-member-list .profile-area {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
}
.popup .popup-body .layer-member-list .profile-img {
    height: 60px;
    min-width: 60px;
    margin-right: 16px;
    background: url(/inc/images/img/img_Nful_profile_default.png) no-repeat;
    background-size: 100%;
}
.popup .popup-body .layer-member-list .profile-img img {
    width: 60px;
    height: 100%;
    min-height: 60px;
    background-color: var(--Primary-Color-Blue);
}
.popup .popup-body .layer-member-list .profile-area .name {
    display: flex;
    gap: 8px;
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 700;
    line-height: var(--lh-lg);
    word-break: break-all;
}
.popup .popup-body .layer-member-list .profile-area .name .icon {
    width: 20px;
    height: 20px;
    min-width: 20px;
}
.popup .popup-body .layer-member-list .profile-area .com-name {
    margin-top: 8px;
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 700;
    line-height: var(--lh-lg);
    word-break: break-all;
}
.popup .popup-report-inner {
    display: flex;
    padding-bottom: 330px;
}
.popup .popup-report-inner .el-title {
    padding: 8px 0;
    min-width: 74px;
    margin-right: 24px;
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .popup-report-inner .required { position: relative; }
.popup .popup-report-inner .required::after {
    position: absolute;
    right: -12px;
    color: var(--Primary-Color-Red);
    content: " *";
}
.popup .popup-report-inner .sort-inner .selectbox-trigger { width: 312px; }
@media screen and (max-width: 1023px) {
    .popup .popup-body .layer-member-list {
        display: block;
        margin-top: 0;
    }
    .popup .popup-body .layer-member-list .item + .item { margin-top: 20px; }
    .popup .popup-body .layer-member-list .item .num {
        flex: 0 0 50px;
        margin-right: 8px;
        font-size: 24px;
    }
    /* popup - member */
    .popup .popup-body .layer-member-option .selectbox-options {width: 100%;}
    .popup .popup-body .selectbox-wrap ul.selectbox-options li.option:nth-child(2) {
        margin-top: 0;
    }
    .popup .popup-body .selectbox-wrap ul.selectbox-options li.moclose-btn {
        position: absolute;
    }
    .popup .popup-report-inner {
        flex-direction: column;
        row-gap: 8px;
    }
    .popup .popup-report-inner .sort-inner .selectbox-trigger { width: 100%; }
}
.popup .layer-owners-profile .popup-header { padding: 16px 55px 16px 24px; }
.popup .layer-owners-profile .popup-header h3 {
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .layer-360-bottom .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x {
    top: 18px;
    right: 24px;
}
.popup .layer-owners-profile .popup-body.inner-owners {
    display: block;
    padding: 24px;
}
.popup .layer-owners-profile .inner-owners .profile-area {
    display: flex;
    position: relative;
    align-items: center;
}
.popup .layer-owners-profile .inner-owners .profile-area .profile-open { display: block; }
.popup .layer-owners-profile .inner-owners .profile-area .club-popup {
    top: 65px;
    left: 0;
}
.popup .layer-owners-profile .inner-owners .profile-area .profile-img {
    width: 60px;
    height: 60px;
    background: url(/inc/images/img/img_Nful_profile_default.png) no-repeat;
    margin-right: 8px;
    background-size: 100%;
}
.popup .layer-owners-profile .inner-owners .profile-area .profile-img img {
    width: 60px;
    height: 60px;
    background-color: var(--Primary-Color-Blue);
}
.popup .layer-owners-profile .inner-owners .profile-area .name {
    display: flex;
    gap: 8px;
    font-family: var(--font-text);
    font-size: 14px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup .layer-owners-profile .inner-owners .profile-area .name .icon {
    width: 20px;
    height: 20px;
}
.popup .layer-owners-profile .inner-owners .profile-area .com-name {
    margin-top: 8px;
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.popup .layer-owners-profile .inner-owners .profile-info-txt { margin-top: 24px; }
.popup .layer-owners-profile .inner-owners .profile-info-txt .el-desc {
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.popup .layer-owners-profile .inner-owners .profile-btn-box { margin-top: 24px; }
.popup .layer-owners-profile .inner-owners .profile-btn-box .btn-wrap {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.popup .layer-owners-profile .inner-owners .profile-btn-box .btn-wrap .btn { width: 50%; }
.popup .layer-owners-profile .inner-owners .profile-full-box {
    display: flex;
    position: relative;
    flex-direction: column;
    gap: 16px;
    max-width: none;
    padding: 24px;
    margin: 0 -24px;
    margin-top: 24px;
    margin-bottom: -24px;
    background-color: var(--Secondary-Color-Black_Natural);
}
.popup .layer-owners-profile .inner-owners .profile-full-box .list-item {
    display: flex;
    justify-content: space-between;
}
.popup .layer-owners-profile .inner-owners .profile-full-box .list-item + .list-item {
    padding-top: 16px;
    border-top: 1px solid var(--Line-Color-Line_01);
}
.popup .layer-owners-profile .inner-owners .profile-full-box .list-item .stit {
    flex: 1 0 37.77%;
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.popup .layer-owners-profile .inner-owners .profile-full-box .info {
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 400;
    line-height: var(--lh-lg);
}
.popup .layer-owners-profile .inner-owners .profile-full-box .info .btn {
    width: 22px;
    height: 22px;
}
.popup .layer-owners-profile .inner-owners .profile-full-box .info .txt-em { font-weight: 700; }
.popup .layer-owners-profile .inner-owners .profile-full-box .btn-link {
    display: flex;
    align-items: center;
}
.popup .layer-owners-profile .inner-owners .profile-full-box .btn-link .icon-right { margin-left: 4px; }
.popup .layer-owners-profile .inner-owners .profile-full-box .btn-link:hover { color: var(--Primary-Color-Red); }
.popup .layer-owners-profile .inner-owners .profile-full-box .btn-link:hover .icon-right { background-image: url(/inc/images/icon/icon-arrow01_right_red.svg); }
.popup .layer-owners-profile .inner-owners .profile-full-box .txt-em-1line {
    display: -webkit-box;
    overflow: hidden;
    max-width: 175px;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
.popup .layer-owners-profile .btn-wrap button.pop-close {
    top: 18px;
    right: 24px;
}
@media screen and (max-width: 359px) {
    .popup .layer-owners-profile .inner-owners .profile-full-box .txt-em-1line { width: calc(100vw - 178px) }
}
/* main popup */
.main-popup {
    overflow-x: initial;
    display: none;
    z-index: 1001;
    top: 50%;
    left: 50%;
    width: calc(100% - 40px);
    max-width: 480px;
    max-height: calc(var(--vh, 1vh) * 100);
    transform: translate(-50%, -50%);
}
.main-popup .popup-wrapper {
    position:relative;
    background: var(--Primary-Color-White);
    border-radius: 4px;
}
.main-popup .popup-wrapper .btn-wrap {
    position: absolute;
    z-index:5;
    top: 0;
    right: 0;
    padding:16px;
}
.main-popup .popup-wrapper .btn-wrap button.btn-only-icon-notbg.popup-close-btn-x {
    position:static;
    top: 0;
    right: 0;
}
.main-popup .popup-wrapper .popup-today {
    padding:15px 24px;
    border-radius: 0px 0px 4px 4px;
    background: var(--Secondary-Color-Black_Natural);
}
.main-popup .popup-wrapper .popup-swiper { padding-bottom:24px; }
.main-popup .popup-wrapper .popup-swiper .swiper-container { position:relative; }
.main-popup .popup-wrapper .popup-swiper .swiper-container .swiper-button-prev { left:-80px; }
.main-popup .popup-wrapper .popup-swiper .swiper-container .swiper-button-next { right:-80px; }
.main-popup .popup-wrapper .popup-swiper .swiper-slide {
    overflow-y: auto;
    max-height: calc(var(--vh, 1vh) * 100 - 23.75rem);
}
.main-popup .popup-wrapper .popup-swiper .swiper-inner { padding-top:44px; }
.main-popup .popup-wrapper .popup-swiper .swiper-inner .inner-head { padding:0 40px 16px; }
.main-popup .popup-wrapper .popup-swiper .swiper-inner .el-title {
    font-family: var(--font-head);
    font-weight: 700;
    font-size: 32px;
    line-height: var(--lh-lg)
}
.main-popup .popup-wrapper .popup-swiper .swiper-inner .text-area {
    margin-top:8px;
    padding:0 40px;
}
.main-popup .popup-wrapper .popup-swiper .swiper-inner .text-area p,
.main-popup .popup-wrapper .popup-swiper .swiper-inner .text-img-area p {
    margin-top:12px;
    font-family: var(--font-text);
    font-weight: 500;
    font-size: 20px;
    line-height: var(--lh-lg)
}
.main-popup .popup-wrapper .popup-swiper .swiper-inner .text-img-area {
    margin-top:8px;
    padding: 0;
}
.main-popup .popup-wrapper .popup-swiper .swiper-inner .text-img-area p { padding: 0 40px; }
.main-popup .popup-wrapper .popup-swiper .swiper-inner .inner-btn {
    display:flex;
    justify-content: center;
    margin-top:24px;
    padding:8px 0;
}
@media screen and (max-width: 1023px) {
    .main-popup {
        display: none;
        overflow-x: initial;
        z-index: 1001;
        top: 50%;
        left: 50%;
        width: calc(100% - 96px);
        max-width: auto;
        max-height: calc(var(--vh, 1vh) * 100);
        transform: translate(-50%, -50%);
    }
    .main-popup .popup-wrapper .popup-today { padding:11px 24px; }
    .main-popup .popup-wrapper .popup-swiper { padding-bottom:16px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-container .swiper-button-prev,
    .main-popup .popup-wrapper .popup-swiper .swiper-container .swiper-button-next {
        width:48px;
        height:48px;
    }
    .main-popup .popup-wrapper .popup-swiper .swiper-container .swiper-button-prev { left:-48px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-container .swiper-button-next { right:-48px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-slide { max-height: calc(var(--vh, 1vh) * 100 - 120px); }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner{ padding-top:44px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .inner-head{ padding:0 24px 16px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .el-title{ font-size: 20px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .text-area {
        margin-top:0;
        padding:0 24px;
    }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .text-area p,
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .text-img-area p { font-size: 16px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .text-img-area { margin-top:0; }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .text-img-area p { padding: 0 24px; }
    .main-popup .popup-wrapper .popup-swiper .swiper-inner .inner-btn {
        display:flex;
        justify-content: center;
        margin-top:8px;
        padding:8px 0;
    }
}
/* login popup */
.logout_popup_wrap {
    padding: 40px;
    width: fit-content;
    min-width: 400px;
    border-radius: 400px;
}
.logout_popup_wrap .logout_popup_text {
    margin-bottom:106px;
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.logout_popup_wrap .logout_popup_text span { color: var(--Primary-Color-Red); }
.logout_popup_wrap .btn-wrap-type2,
.logout_popup_wrap .btn-wrap-type3 { gap: 10px }
@media screen and (max-width: 1023px) {
    .logout_popup_wrap {
        padding: 40px;
        width: 100%;
        min-width: 0;
        border-radius: 4px 4px 0 0;
    }
    .logout_popup_wrap .logout_popup_text {
        margin-bottom: 158px;
    }
    .logout_popup_wrap.ty02 .logout_popup_text {
        font-size: 16px;
    }
}

/* inquiry popup */
.inquiry_popup_wrap {
    padding: 40px;
    border-radius: 4px;
}
.inquiry_popup_wrap p {
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg)
}
.inquiry_popup_wrap ul { margin: 40px 0; }
.inquiry_popup_wrap ul li {
    position: relative;
    padding-left: 22px;
    font-size: 14px;
    font-weight: 500;
    line-height: var(--lh-lg);
}
.inquiry_popup_wrap ul li::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 8px;
    display: block;
    width: 3.5px;
    height: 3.5px;
    border-radius: 50%;
    background-color: var(--Primary-Color-Black);
}
.inquiry_popup_wrap ul li+li { margin-top: 24px }
.inquiry_popup_wrap ul li span { color: var(--Primary-Color-Red); }
@media screen and (max-width: 1023px) {
    .inquiry_popup_wrap p { font-size: 18px; }
}
/* form */
.wrap-form input[type="checkbox"],
.wrap-form  input[type="radio"] {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border: 0;
    opacity: 0;
    -webkit-appearance: none;
    z-index: -1;
}
input[type="checkbox"]:focus + label,
input[type="radio"]:focus + label {
    outline: 1px solid var(--Link-Color-Blue);
    z-index: 1;
}
.wrap-form {
    position: relative;
    display: flex;
    flex-direction: column;
    width: auto;
}
.wrap-form.label-tit-type01 label,
.wrap-form.label-tit-type02 label {
    position: relative;
    width: 100%;
    font-family: var(--font-head);
    font-size: 20px;
    font-weight: 700;
    line-height: 28px;
    text-align: left;
}
.wrap-form.label-tit-type01 label span,
.wrap-form.label-tit-type02 label span {
    position: relative;
    word-break: break-word;
}
.wrap-form.label-tit-type02 label.required span:after {
    content: " *";
    position: absolute;
    right: -12.8px;
    color: var(--Primary-Color-Red);
}
.wrap-form .wrap-form__group {padding-bottom: 80px;}
.wrap-form .wrap-form__group:last-child {
    padding-bottom: 0;
    border-bottom: 1px solid var(--Primary-Color-Black);
}
.label-box p {
    display: flex;
    width: fit-content;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 4px 12px;
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 700;
    line-height: var(--lh-lg);
    border-radius: 15px;
    background: var(--Secondary-Color-Black_555555);
    color: var(--Primary-Color-White);
}
.label-box h1 {
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 16px;
    font-family: var(--font-head);
    font-size: 40px;
    font-weight: 700;
    line-height: var(--lh-base);
    text-transform: capitalize;
}
.wrap-form.text {
    display: flex;
    flex-direction: row;
    padding-right: 8px;
    column-gap: 10px;
    border-bottom: 4px solid var(--Primary-Color-Black);
}
.wrap-form input[type="text"] {
    width: 100%;
    margin-top: 8px;
    padding: 10px 8px;
    font-size: 16px;
    font-weight: 500;
    line-height: var(--lh-lg);
    font-family: var(--font-text);
    color: var(--Primary-Color-Black);
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: none;
}
.wrap-form input[type="text"]::placeholder,
.wrap-form textarea::placeholder {
    font-size: 16px;
    font-weight: 500;
    line-height: var(--lh-lg);
    color: var(--Secondary-Color-Black_777777);
    font-family: var(--font-text);
}
.wrap-form.input-type-readonly input::placeholder {
    color: var(--Primary-Color-Black);
    font-size: 16px;
    font-weight: 500;
    font-family: var(--font-text);
}
.wrap-form.input-type-readonly input:focus-visible { outline: none; }
.wrap-form textarea {
    position: relative;
    height: 160px;
    padding: 14px 12px;
    margin-top: 0 ;
    font-family: var(--font-text);
    font-size: 16px;
    font-weight: 500;
    line-height: var(--lh-lg);
    text-align: left;
    border: 1px solid var(--Primary-Color-Black);
}
.wrap-form .text-comment {
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
    color: var(--Secondary-Color-Black_777777);
}
.wrap-form .wrap-form-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 8px;
    line-height: var(--lh-base);
}
.wrap-form .wrap-form-bottom.comment-type02 {align-items: baseline;}
.wrap-form .wrap-form-bottom.comment-type03 ul li { margin: 0; }
.wrap-form .wrap-form-bottom.comment-type03 ul li::marker {
    font-family: "Hyundai Sans Text KR", "Hyundai Sans Text", sans-serif;
}
.wrap-form.textarea {margin-top: 8px;}
.wrap-form.textarea .inner-textarea-comment {
    display: flex;
    justify-content: space-between;
    position: relative;
    align-items: stretch;
    margin-top: 0;
    border: 1px solid var(--Primary-Color-Black);
    border-radius: 0;
}
.wrap-form.textarea .inner-textarea-comment textarea {
    z-index: 1;
    width: 100%;
    margin-top: 0;
    border: none;
    border-radius: 0;
    word-break: break-word;
}
.owners-post .wrap-form textarea {height: 128px;}
.wrap-form p.text-num-chk {
    font-size: 12px;
    color: var(--Secondary-Color-Black_777777);
}
.wrap-form.chk-txtLimit .wrap-form-bottom.comment-type02 p.text-num-chk {
    width: 100%;
    max-width: 64px;
    text-align: right;
}
.wrap-form.attach {
    justify-content: flex-start;
    flex-direction: row;
    width: 100%;
    margin-top: 8px;
}
.wrap-form.attach input[type="file"] { display: none; }
.wrap-form.attach .wrap-form-bottom.comment-type04 {
    align-items: flex-start;
    margin-top: 0;
}
.wrap-form .wrap-form-bottom.comment-type01 span.comment,
.wrap-form .wrap-form-bottom.comment-type02 span.comment {
    font-size: 12px;
    font-weight: 400;
    color: var(--Secondary-Color-Black_777777);
}
.wrap-form .wrap-form-bottom.comment-type02 .comment-type02-1 {flex: 1 0 0;}
.wrap-form .wrap-form-bottom.comment-type03 ul,
.wrap-form .wrap-form-bottom.comment-type04 ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 0;
    margin-block-end: 16px;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 24px;
    margin-left: 14px;
}
.wrap-form.attach .wrap-form-bottom.comment-type04 ul { margin-block-end: 0; }
.wrap-form .wrap-form-bottom.comment-type03 ul li,
.wrap-form .wrap-form-bottom.comment-type04 ul li {
    display: list-item;
    text-align: -webkit-match-parent;
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
    color: var(--Secondary-Color-Black_777777);
    list-style: disc;
    unicode-bidi: isolate;
}
.popup .wrap-form.attach .wrap-form-bottom.comment-type04 ul li:first-child,
.wrap-form .wrap-form-bottom.comment-type04 ul li { margin: 0 0 6px; }
.wrap-form-bottom .text-comment {
    font-family: var(--font-text);
    font-size: 12px;
    font-weight: 400;
    line-height: var(--lh-lg);
    color: var(--Secondary-Color-Black_777777);
}
.wrap-radio {
    padding: 10px 0;
    margin-top: 8px;
}
.wrap-radio.horizontal {
    display: flex;
    flex-direction: row;
}
.wrap-radio .radio {
    display: flex;
    align-items: center;
}
.wrap-radio input[type="radio"] {
    position: static;
    width: 1px;
    height: 1px;
    opacity: 0;
}
.wrap-radio .radio input[type="radio"] + .radio-label {
    display: flex;
    align-items: center;
    cursor: pointer;
}
.wrap-radio .radio input[type="radio"]:checked + .radio-label {
    box-shadow: none !important;
    border: none;
}
.wrap-radio.horizontal .radio input[type="radio"] + .radio-label {margin-right: 40px;}
.wrap-radio .radio input[type="radio"]:checked + .radio-label:before { background-image: url(/inc/images/icon/icon-radio-checked.svg); }
.wrap-radio .radio input[type="radio"] + .radio-label:before {
    content: "";
    width: 22px;
    height: 22px;
    background-image: url(/inc/images/icon/icon-radio.svg);
    background-size: contain;
    background-repeat: no-repeat;
}
.radio label.radio-label span.txt {
    margin-left: 8px;
    font-weight: 400;
    line-height: var(--lh-lg);
    font-size: 16px;
    font-family: var(--font-text);
}
/* post */
.topics-area .topics-area__inner {
    display: flex;
    align-items: center;
}
.topics-area .topics-area__inner .selectbox-container {
    flex: 1 0 auto;
    max-width: 312px;
    margin-left: 24px;
}
.topics-area .topics-area__inner .selectbox-container .selectbox-wrap {display: block;}
.topics-area .topics-area__inner .selectbox-container .selectbox-trigger {width: 100%;}
.owners-post .selectbox-wrap .selectbox-trigger.js-placeholder {color: var(--Secondary-Color-Black_777777);}
.owners-post .selectbox-wrap .selectbox-options {width: 100%;}
.topics-area .topics-area__inner .selectbox-container .selectbox-wrap > div {display: block;}
.topics-area .topics-area__inner .selectbox-container .selectbox-options {width: 100%;}
/* img upload */
.owners-post .image-dropdwon {margin-top: 8px;}
.owners-post .image-dropdwon .inner {
    height: 320px;
    border-radius: 10px;
    border: 1px dashed var(--Line-Color-Line_02);
    background-color: var(--Secondary-Color-Black_Natural);
}
.owners-post .image-dropdwon .inner.type-txt {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px;
}
.owners-post .image-dropdwon .inner.type-bg-commu {
    height: auto;
    overflow-y: auto;
    padding: 40px;
}
.owners-post .image-dropdwon .inner.type-photo {
    overflow-y: auto;
    display: flex;
    justify-content: center;
    padding: 40px 0 40px 40px
}
.owners-post .image-dropdwon .inner .photo-list {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
}
.owners-post .image-dropdwon .inner .bg-commu-list .item {
    position: relative;
    overflow: hidden;
    height: 160px;
}
.owners-post .image-dropdwon .inner .photo-list .item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 182px;
    background-color: var(--Line-Color-Line_01);
}
.owners-post .image-dropdwon .inner .bg-commu-list .item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.owners-post .image-dropdwon .photo-list .item img {
    width: auto;
    height: auto;
    max-height: 182px;
}
.owners-post .image-dropdwon .inner .photo-list .item .btn-del,
.owners-post .image-dropdwon .inner .bg-commu-list .item .btn-del {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 12px;
    right: 12px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.6);
}
.owners-post .image-dropdwon .inner .photo-list .item .btn-del::before,
.owners-post .image-dropdwon .inner .bg-commu-list .item .btn-del::before {
    content: '';
    display: block;
    width: 12px;
    height: 12px;
    background: url(/inc/images/icon/icon-close_white_12.svg) center no-repeat;
}
.owners-post .image-dropdwon .inner .info {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.owners-post .image-dropdwon .inner .info::before {
    content: '';
    display: block;
    width: 40px;
    height: 40px;
    background: url(/inc/images/icon/icon-file-upload.svg) center no-repeat;
}
.owners-post .image-dropdwon .inner .info {
    font-family: var(--font-text);
    line-height: var(--lh-lg);
}
.owners-post .image-dropdwon .inner .info .el-title {
    margin-top: 14px;
    font-size: 16px;
    font-weight: 700;
}
.owners-post .image-dropdwon .inner .info .el-desc {
    margin-top: 10px;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    color: var(--Secondary-Color-Black_777777);
}
.owners-post .image-dropdwon .btn-wrap {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}
.owners-post .image-dropdwon .wrap-form-bottom.comment-type02 { margin-top: 8px; }
@media screen and (max-width: 1023px) {
    /* form */
    .wrap-form.label-tit-type01 label,
    .wrap-form.label-tit-type02 label {font-size: 18px;}
    .wrap-form input[type="text"]::placeholder,
    .wrap-form textarea::placeholder {
        font-size: 16px;
        font-weight: 500;
        color: var(--Primary-Color-Black);
    }
    .wrap-form.tit-type02 input[type="text"]::placeholder { font-size: 14px; }
    .wrap-form .wrap-form__group {padding-bottom: 60px;}
    .owners-post .popup-body-innerbox .wrap-form input[type="text"]::placeholder { font-size: 14px; }
    .wrap-form .wrap-form-bottom.comment-type02 {
        display: grid;
        grid-template-columns: 2fr auto;
        width: 100%;
        margin-block-end: 8px;
    }
    .wrap-form .wrap-form-bottom.comment-type02 .comment-type02-1 {
        flex: unset;
        max-width: 250px;
    }
    .wrap-form .wrap-form-bottom.comment-type01 span.comment,
    .wrap-form .wrap-form-bottom.comment-type02 span.comment { line-height: calc(var(--lh-base) * 1.2); }
    .wrap-radio.horizontal { flex-direction: column; }
    .wrap-radio.horizontal .radio { margin-bottom: 20px; }
    .wrap-radio.horizontal .radio:last-child { margin-bottom: 0; }
    /* post */
    .topics-area .topics-area__inner {
        flex-direction: column;
        align-items: flex-start;
    }
    .topics-area .topics-area__inner .selectbox-container {
        width: 100%;
        max-width: 100%;
        margin-top: 8px;
        margin-left: 0;
    }
    .owners-post .wrap-form textarea { height: 228px; }
    /* img upload */
    .owners-post .image-dropdwon .inner.type-bg-commu {
        height: auto;
        overflow-y: auto;
        padding: 20px;
    }
}
/* toggle switch */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 32px;
    vertical-align: middle;
}
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--Line-Color-Line_01);
    -webkit-transition: 0.4s;
    transition: 0.4s;
}
.slider:before {
    position: absolute;
    content: "";
    height: 28px;
    width: 28px;
    left: 2px;
    bottom: 2px;
    background-color:var(--Primary-Color-White);
    -webkit-transition: 0.4s;
    transition: 0.4s;
}
input:checked + .slider { background-color: var(--Primary-Color-Red); }
input:focus + .slider { box-shadow: 0 0 1px var(--Primary-Color-Red); } input:checked + .slider:before {
    -webkit-transform: translateX(28px);
    -ms-transform: translateX(28px);
    transform: translateX(28px);
}
.slider.round { border-radius: 32px; }
.slider.round:before { border-radius: 50%; }
.popup-wrapper .popup-body.for-switch { max-height: 100%; }
.popup-wrapper .popup-body.for-switch .wrap-switch {
    display: flex; 
    align-items: center; 
    justify-content: space-between;
}
.popup-wrapper .popup-body.for-switch .wrap-switch.all {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--Primary-Color-Black);
}
.popup-wrapper .popup-body.for-switch .wrap-switch.all p {
    font-family: var(--header-height);
    font-size: 24px;
    font-weight: 700;
}
.popup-wrapper .popup-body.for-switch .wrap-switch p {
    font-family: var(--header-height);
    font-size: 20px;
    font-weight: 700;
    line-height: var(--lh-lg);
}
.popup-wrapper .popup-body.for-switch .switch-to-select {
    display: flex;
    flex-direction: column;
    gap: 36px;
}
.popup-wrapper .popup-body.for-switch .switch-to-select .wrap-switch:first-child { margin-top: 34px; }
.popup-wrapper .popup-body.for-switch .switch-to-select:last-child { margin-bottom: 22px; }
@media screen and (max-width: 1023px) {
    .popup-wrapper .popup-body.for-switch .wrap-switch {
        display: grid;
        align-items: center;
        justify-content: space-between;
        grid-template-columns: 60% auto;
    }
    .popup-wrapper .popup-body.for-switch .wrap-switch .wrap-switch:first-child { margin-top: 32px; }
    .popup-wrapper .popup-body.for-switch .wrap-switch .wrap-switch:last-child { margin-bottom: 0; }
    .popup-wrapper .popup-body.for-switch .wrap-switch.all p,
    .popup-wrapper .popup-body.for-switch .wrap-switch p { font-size: 18px; }
}

/* cp-table-line */
.cp-table-line table th {
    padding:10px;
    font-family: var(--font-text);
    font-weight:400;
    background-color: var(--Secondary-Color-Black_Natural);
    border:1px solid var(--Primary-Color-Black);
}
.cp-table-line table td {
    padding:10px;
    font-family: var(--font-text);
    border:1px solid var(--Primary-Color-Black);
    text-align: center;
}
.cp-table-line table td.align-c { text-align: center; }
.cp-table-line table td.align-l { text-align: left; }
.is-visible {
    overflow: visible;
    height: auto;
    padding-bottom: 10px;
}
/* cp-dot-list */
.cp-dot-list li {
    position:relative;
    padding-left:20px;
    font-family: var(--font-text);
    font-size: 14px;
    line-height: var(--lh-lg)
}
.cp-dot-list li::before {
    content:'·';
    display:block;
    position:absolute;
    top:0;left:8px;
}