@charset "utf-8";

@import url('fonts.css');
@import url('reset.css');

:root{
    /* color */
    --color-pry: #0c57c4;
    --color-sec: #0e4da4;
    --color-trd: #093576;
    --color-orange:#d74a16;
    --color-pink:#ca3b3b;

    /* background */
    --bg-light1: #e0e7f2;
    --bg-light2: #e7f0ff;
    --bg-light3: #e0e7f2;
    --bg-light4: #f1f1f1;
    --bg-light5: #dfebfc;
    --bg-light6: #e6e6e6;
    --bg-gr900: #1e1e1e;
    --bg-gr700: #515151;
    --bg-gr500: #5b5b5b;
    --bg-gr300: #7a7a7a;
    --bg-white: #fff;
    --bg-cell: #1b498c;

    /* border */
    --border-white: #fff;
    --border-gray: #e7e7e7;
    --border-gray-light: #cdd1d5; 
    --border-muted: #9e9b9b;
    --border-gr900: #1e1e1e;

    /* text */
    --text-gr900: #1e1e1e;
    --text-gr700: #515151;
    --text-gr500: #5b5b5b;
    --text-gr400: #464c53;
    --text-gr300: #7a7a7a;
    --text-gr200: #8a949e; /* disabled */
    --text-black: #000;
    --text-white: #fff;
    --text-wrn: #fb5332;
    --text-red: #ff0000;

    /* weight */
    --font-light: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;

    /* font-size */
    --font-size-heading-xxl: 54px;
    --font-size-heading-xl: 44px;
    --font-size-heading-lg: 36px;
    --font-size-heading-md: 24px;

    --font-size-subtitle: 22px;
    --font-size-body-lg: 20px;
    --font-size-body: 19px;
    --font-size-body-sm: 18px;

    --letter-spacing-tight: -0.05em;

    /* dimensions */
    --content-width: 1200px;
    --gnb-height: 94px;
    --spacing-y : 20px;
    --spacing-y-neg : -20px;

    --radius-sm: 10px;
    --radius-md: 20px;
    --radius-lg: 30px;

    @media all and (max-width: 1023px) {
        --gnb-height: 60px;
    }
}

/* ====================
	COMMON
==================== */

.bold {font-weight:var(--font-bold);}

/* HIDDEN */
.hide {display:none !important;}
.blind {overflow:hidden; position:absolute !important; width:1px !important; height:1px !important; margin:-1px; border:0; clip:rect(1px, 1px, 1px, 1px); -webkit-clip-path:inset(50%); clip-path:inset(50%);}

/* 말줄임 */
.ellipsis {display:inline-block; overflow:hidden; max-width:100%; text-overflow:ellipsis; white-space:nowrap;}
.ellipsis2 {display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2;}
.ellipsis3 {display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3;}

/* 각주 */
/*.footnote-marker .marker {}*/
.footnote {margin-top:20px; font-size:15px; color:var(--text-gr700);}
/*.footnote .marker {}*/

/* 정렬 */
.align-l {text-align:left !important;}
.align-c {text-align:center !important;}
.align-r {text-align:right !important;}

/* 디스플레이 */
.disp-b {display:block !important}
.disp-i {display:inline !important;}
.disp-ib {display:inline-block !important;}
.disp-none {display:none !important}
.isMo {display:none !important;}
.isPc {display:block !important;}
.isPc-ib {display:inline-block !important;}

@media all and (max-width: 1023px) {
    .isMo {display:block !important;}
    .isPc {display:none !important;}
    .isPc-ib {display:none !important;}
}


/* ====================
	LAYOUT
==================== */

/* SKIP */
.skip-navi a {display:block; position:fixed; top:0; left:0; width:100%; height:0; background-color:var(--color-trd); color:var(--text-white); font-size:12px; font-weight:bold; line-height:1; text-align:center; overflow:hidden; z-index:9999;}
.skip-navi a:focus,
.skip-navi a:active {height:auto; margin-top:0; padding:10px 0; border:2px dashed var(--border-white);}

@media all and (max-width: 1023px) {
    .skip-navi .go-gnb {display:none;}
}

/* COMMON */
html {background-color:var(--bg-white); font-size:16px;}
body {min-height:100%; background-color:var(--bg-white); overflow-y:scroll;}
.wrapper {position:relative; width:100%; background:var(--bg-white); overflow-x:hidden; overflow-x:clip;}
.wrapper.lock {position:fixed; right:0; bottom:0; width:100%; -webkit-overflow-scrolling:none;}

/* HEADER */
.header {position:relative; z-index:99;}
.header .util-wrap {height:50px; padding:0 var(--spacing-y); background-color:#d8e6f2;}
.header .util-wrap .inner {display:flex; max-width:var(--content-width); height:100%; margin:0 auto;}
.header .util-wrap .nav > ul {display:flex; height:100%;}
.header .util-wrap .nav > ul > li {padding:2px; color:var(--text-black);}
.header .util-wrap .nav > ul > li.on {background-color:var(--bg-white); border-radius:10px 10px 0 0; color:var(--color-trd);}
.header .util-wrap .nav > ul > li a {display:inline-flex; align-items:center; justify-content:center; min-width:160px; height:100%; padding:0 24px; font-size:15px; font-weight:var(--font-bold);}
.header .util-wrap .login-area {display:flex; margin-left:auto; font-weight:var(--font-medium);}
.header .util-wrap .login-area > * {display:inline-flex; align-items:center; justify-content:center; margin-left:28px; font-size:14px;}
.header .util-wrap .login-area .login-text {color:#5b5b5b;}
.header .util-wrap .login-area .login-text > span {color:var(--text-black); font-weight:var(--font-bold);}

.header .gnb-wrap {display:flex; align-items:center; justify-content:space-between; max-width:var(--content-width); margin:0 auto; padding:0 20px 0 10px; letter-spacing:var(--letter-spacing-tight);}
.header .gnb-wrap .mo-util,
.header .gnb-wrap .btn-gnb-open,
.header .gnb-wrap .btn-gnb-close {display:none;}

.header .gnb-wrap .logo {flex-shrink:0; max-width:158px;}
.header .gnb-wrap .logo img {max-width:100%;}
.header .gnb-wrap .logo a {display:block;}
.header .gnb-wrap .btn-search {flex:0 0 auto; width:24px; height:24px; background:url('../img/common/icon_header_search.svg') no-repeat center; background-size:21px;}

.header .totalmenu {width:100%;}
.header .gnb-bg {position:absolute; top:100%; left:0; right:0; height:0; background-color:var(--color-sec); transition:height 0.3s var(--easeOutSine);}
.header .gnb-list {display:flex; line-height:1.2;}
.header .gnb-list > li {position:relative; flex:1 1; z-index:2;}
.header .gnb-list > li > a {display:flex; align-items:center; justify-content:center; height:var(--gnb-height); font-size:20px; font-weight:var(--font-semibold); text-align:center;}
.header .gnb-list > li.on > a {font-weight:var(--font-extrabold); color:var(--color-sec);}
.header .gnb-list > li .sub-menu {position:absolute; top:100%; left:0; right:0; height:0; padding:0 20px; border-left:1px solid #4c8ec7; text-align:center; overflow:hidden; z-index:1; transition:height 0.3s var(--easeOutSine);}
.header .menu-box {display:inline-block; padding:30px 0 50px; color:var(--text-white); text-align:left; opacity:0; transform:translateY(-20px); transition:0.4s;}
.header .menu-box.on {opacity:1; transform:translateY(0);}
.header .menu-box > li {min-height:2.4em;}
.header .menu-box > li:not(:first-child) {margin-top:30px;}
.header .menu-box > li > a {display:block;}
.header .menu-box > li > a:hover,
.header .menu-box > li > a.on {color:#ffe816; text-decoration:underline;}

/* SUB NAV */
.sub-nav {min-height:72px; margin-bottom:80px; padding:0 var(--spacing-y); background-color:var(--color-sec);}
.sub-nav .inner {max-width:1200px; margin:0 auto;}
.sub-nav .inner > ul {display:flex; align-items:center; gap:120px; height:72px;}
.sub-nav .inner > ul > li {height:100%; display:inline-flex; align-items:center; height:100%; color:#fff; font-size:20px;}
.sub-nav .inner > ul > li.on > a {color:#ffe816;}
.sub-nav .inner > ul > li > a:hover {text-decoration:underline;}

/* BREADCRUMB */
.breadcrumb {position:relative; margin:80px 0 20px;}
.breadcrumb ol {display:flex; align-items:center; justify-content:center; max-width:var(--content-width); margin:0 auto;}
.breadcrumb li {font-size:15px; font-weight:var(--font-medium); overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.breadcrumb li:first-child {flex-shrink:0; width:18px; height:19px; background:url(../img/common/icon_breadcrumb_home.svg) no-repeat center; background-size:18px auto;}
.breadcrumb li:not(:first-child)::before {content:''; display:inline-block; width:9px; height:14px; margin:0 10px; background:url(../img/common/icon_breadcrumb_arrow.svg) no-repeat; background-size:9px auto; vertical-align:middle;}
.breadcrumb li a {display:block; height:100%;}

/* PAGE */
.container.has-bg {background-color:#f8f8f8;}
.content-inr {max-width:var(--content-width); margin:0 auto; padding:80px var(--spacing-y); box-sizing:content-box;}
.cont-wrap:not(:first-child) {margin-top:80px;}
.cont-wrap-box {padding:50px; background-color:var(--bg-white); border-radius:12px;}
.cont-wrap-box:not(:first-child) {margin-top:80px;}
.cont-wrap-box.no-radius {border-radius:0;}

/* FOOTER */
.footer .banner {padding:55px var(--spacing-y); border-top:1px solid var(--border-muted);}
.footer .banner .slide {max-width:var(--content-width); margin:0 auto; padding:0 var(--spacing-y); overflow:hidden; text-align:center;}
.footer .banner .slide a {display:inline-block; margin:2px;}
.footer .banner .slide .swiper-navigation .swiper-button-disabled {display:none;}
.footer .banner .slide .swiper-navigation button {width:30px; height:30px; margin-top:-15px; background-color:#bbb; border-radius:50%;}
.footer .banner .slide .swiper-navigation button::after {width:24px; height:24px; background:url('../img/common/icon_slide_arrow_white.svg') no-repeat center; background-size:22px; font-size:0;}
.footer .banner .slide .swiper-navigation .swiper-button-next::after {transform:rotate(180deg);}
.footer .cont {padding:55px 0 107px; background-color:var(--bg-light6); line-height:1.2;}
.footer .cont .inner {display:flex; max-width:var(--content-width); margin:0 auto; padding:0 var(--spacing-y);}
.footer .foot-logo {margin-right:86px;}
.footer .foot-logo .logo {width:125px;}
.footer .foot-logo .mark-wa {width:50px; margin-top:20px; margin-left:auto;}
.footer .foot-logo img {max-width:100%;}
.footer .menu-list {display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:center; margin:0 -23px -8px; color:var(--text-black); font-size:15px;}
.footer .menu-list > li {margin:0 23px 8px}
.footer .menu-list > li a {display:block;}

.footer .info {margin-top:26px; color:#5b5b5b; font-size:14px; font-weight:var(--font-medium); word-break:break-word;}
.footer .info > p:not(:first-child) {margin-top:7px;}


@media all and (max-width: 1023px) {
    /* HEADER */
    body.gnb-open {overflow:hidden;}

    .header .util-wrap {display:none;}
    .header .gnb-wrap {height:var(--gnb-height); padding:0 var(--spacing-y);}
    .header .gnb-wrap .mo-util {display:block;}
    .header .gnb-wrap .btn-gnb-open {position:absolute; left:var(--spacing-y); display:inline-block; width:24px; height:24px; background:url('../img/common/icon_header_menu.svg') no-repeat center; background-size:24px;}
    .header .gnb-wrap .btn-gnb-close {position:absolute; top:22px; right:23px; display:inline-block; width:16px; height:16px; background:url('../img/common/icon_header_close.svg') no-repeat center; background-size:16px;}
    .header .gnb-wrap .logo {margin:0 auto;}
    .header .gnb-wrap .logo img {height:21px;}
    .header .gnb-wrap .btn-search {position:absolute; right:var(--spacing-y); background-image:url('../img/common/icon_header_search_mo.svg'); background-size:24px;}

    .header .mo-util .logo {position:absolute; left:var(--spacing-y); top:19px; line-height:1;}
    .header .mo-util .login-area {display:flex; align-items:stretch; min-height:var(--gnb-height); background-color:var(--bg-gr700);}
    .header .mo-util .login-area > * {display:inline-flex; align-items:center; justify-content:center; width:100%; margin:2px; color:var(--text-white); font-size:16px; text-align:center;}
    .header .mo-util .login-text {display:flex; align-items:center; justify-content:center; min-height:var(--gnb-height); background-color:#f1eded; font-size:16px;}
    .header .mo-util .login-text .icon {width:24px; height:24px; margin-right:10px; background:url('../img/common/icon_login.svg') no-repeat center; background-size:24px;}

    .header .totalmenu {visibility:hidden; position:fixed; top:0; left:-100%; width:100%; height:100%; margin:0; padding-top:var(--gnb-height); background-color:var(--bg-white); overflow-y:auto; z-index:10; transition:left .3s ease, visibility .3s ease;}
    .header .totalmenu.on {visibility:visible; left:0;}

    .header .gnb-list {display:block;}
    .header .gnb-list a:focus-visible {outline-offset:-2px;}
    .header .gnb-list > li > a {position:relative; justify-content:space-between; padding:0 30px; font-weight:var(--font-bold);}
    .header .gnb-list > li.is-open > a {color:var(--color-sec);}
    .header .gnb-list > li .sub-menu {position:static; height:auto; padding:0; background-color:var(--color-sec); transition:none;}
    .header .gnb-list > li > a[aria-expanded]::after {content:''; width:24px; height:24px; -webkit-mask-image:url(../img/common/icon_menu_arrow.svg); mask-image:url(../img/common/icon_menu_arrow.svg); mask-repeat:no-repeat; mask-size:100%; background-color:#33363d; transition:all .3s ease;}
    .header .gnb-list > li > a[aria-expanded="true"]::after {background-color:var(--color-sec); transform:rotate(180deg);}
    .header .menu-box {display:block; padding:0; opacity:1; transform:translateY(0);}
    .header .menu-box > li {min-height:auto;}
    .header .menu-box > li:not(:first-child) {margin-top:0;}
    .header .menu-box > li > a {display:flex; align-items:center; min-height:var(--gnb-height); padding:15px 30px;}

    /* SUB NAV */
    .sub-nav {display:none;}

    /* BREADCRUMB */
    .breadcrumb {height:51px; margin:0 0 30px; padding:0 var(--spacing-y); background-color:var(--bg-light6);}
    .breadcrumb ol {height:100%;}

    /* PAGE */
    .container.has-bg {background-color:transparent;}
    .content-inr {padding:30px var(--spacing-y);}
    .cont-wrap:not(:first-child) {margin-top:30px;}
    .cont-wrap-box {padding:0; background-color:transparent; border-radius:0;}
    .cont-wrap-box:not(:first-child) {margin-top:30px;}

    /* FOOTER */
    .footer .banner {padding:20px var(--spacing-y) 0; border-top:0 none;}
    .footer .cont {padding:34px 0 51px; background-color:transparent;}
    .footer .cont .inner {flex-direction:column-reverse;}
    .footer .foot-logo {display:flex; justify-content:center; margin-top:20px; margin-right:0;}
    .footer .foot-logo .mark-wa {margin:0 0 0 20px;}
    .footer .menu-list {margin:0 -9px -8px;}
    .footer .menu-list > li {margin:0 9px 8px}
    .footer .info {margin-top:34px;}
}

/* ====================
	FLOATING MENU
==================== */
.floating-menu {display:flex; flex-direction:column; align-items:center; gap:10px; position:fixed; left:50%; bottom:50px; max-width:1920px; margin-left:960px; padding-right:18px; transform:translateX(-100%); z-index:98;}
.floating-menu > a,
.floating-menu > button {position:relative; align-items:center; justify-content:center; border-radius:50%; color:var(--text-white); font-weight:var(--font-bold); text-align:center; box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.25);}
.floating-menu > a,
.floating-menu > button:not(.btn-top) {display:inline-flex; width:70px; height:70px; font-size:13px;}
.floating-menu .btn-chatbot {background:var(--color-pry) url(../img/common/icon_floating_chatbot.png) no-repeat 50%; background-size:100%;}
.floating-menu .btn-link {background-color:var(--color-orange)}
.floating-menu .btn-link > span::before {content:''; display:block; width:37px; height:17px; margin:2px auto; background:url(../img/common/icon_floating_1365.png) no-repeat 0 0; background-size:100% auto;}
.floating-menu .btn-top {width:90px; height:0; background-color:rgba(110, 110, 110, 0.5); font-size:16px; opacity:0; transform:scale(0); transition:all .3s ease-out;}
.floating-menu .btn-top.on{display:inline-flex; height:90px; transform:scale(1); opacity:1;}
.floating-menu .btn-top > span::before {content:''; display:block; width:30px; height:19px; margin:0 auto 2px; background:url(../img/common/icon_floating_top.svg) no-repeat 0 0; background-size:100% auto; animation:topArrow 1.2s ease infinite;}

@keyframes topArrow {
    0% {opacity:1; transform:translateY(0);}
    50% {opacity:.9; transform:translateY(-3px);}
    100% {opacity:1; transform:translateY(0);}
}

@media all and (max-width: 1920px) {
    .floating-menu {left:auto; right:0; margin-left:auto; transform:translateX(0);}
}
@media all and (max-width: 1023px) {
    .floating-menu {gap:8px; bottom:30px;}
    .floating-menu > a,
    .floating-menu > button:not(.btn-top) {width:52px; height:52px; font-size:10px;}
    .floating-menu .btn-link > span::before {width:27px; height:12px;}
    .floating-menu .btn-top {width:58px; background-color:rgba(110, 110, 110, 0.7); font-size:12px;}
    .floating-menu .btn-top.on{height:58px;}
    .floating-menu .btn-top > span::before {width:20px; height:13px;}
}


/* ====================
	FLAG
==================== */
.flag {display:inline-block; min-width:72px; padding:7px 20px; border-radius:12px; color:var(--text-white); font-size:18px; font-weight:var(--font-bold); line-height:1.2; text-align:center; vertical-align:middle; white-space:nowrap}
.flag.pry {background-color:var(--color-pry);}
.flag.sec {background-color:var(--color-sec);}
.flag.trd {background-color:var(--color-pink);}
.flag.gray {background-color:var(--bg-gr700);}
.flag.off {background-color:#cccbcb; color:var(--text-gr500);}
.flag.round {border-radius:var(--radius-lg);}
.flag.sm {min-width:auto; padding:5px 10px; font-weight:var(--font-medium);}

.flag-area {margin:-4px; text-align:left;}
.flag-area .flag {margin:4px;}


/* ====================
	TITLE
==================== */
[class^=tit-h] {position:relative; font-weight:var(--font-bold); color:var(--text-black); line-height:1.2;}
.tit-h1 {font-size:40px; letter-spacing:var(--letter-spacing-tight);}
.content > .tit-h1 {max-width:var(--content-width); margin:0 auto; padding:0 var(--spacing-y); text-align:center;}
.tit-h2 {font-size:24px;}
.tit-h3 {font-size:22px;}
.tit-h4 {font-size:18px;}
.tit-h5 {font-size:16px;}
.tit-bull {position:relative; margin-bottom:40px; padding-left:38px; font-size:24px; font-weight:var(--font-bold); line-height:1.2;}
.tit-bull:not(:first-child) {margin-top:60px;}
.tit-bull::before {content:''; position:absolute; top:50%; left:0; width:28px; height:18px; background:url(../img/common/icon_tit_bullet.svg) no-repeat center; background-size:28px 18px; transform:translateY(-50%); z-index:1;}
.tit-em {margin-bottom:20px; color:var(--color-sec); font-size:22px; font-weight:var(--font-bold); line-height:1.2;}
.tit-em:not(:first-child) {margin-top:40px;}
.tit-dot {position:relative; margin-bottom:20px; padding-left:0.9em; font-weight:var(--font-bold); line-height:1.2;}
.tit-dot:not(:first-child) {margin-top:30px;}
.tit-dot::before {content:'•'; position:absolute; left:0; z-index:1;}
.tit-dot-sub {position:relative; margin-bottom:20px; padding-left:0.9em; color:var(--text-gr500); font-weight:var(--font-bold); line-height:1.2;}
.tit-dot-sub:not(:first-child) {margin-top:30px;}
.tit-dot-sub::before {content:''; position:absolute; left:0; top:0.36em; width:9px; height:9px; border:2px solid var(--text-gr300); border-radius:50%; box-sizing:border-box; z-index:1;}

.tit-area {display:flex; align-items:center; flex-wrap:wrap;}
.tit-area.sm {margin:30px 0 20px;}
.tit-area[class*=bg-] {min-height:60px; padding:14px 20px;}
.tit-area[class*=bg-]:has(.icon) {flex-wrap:nowrap;}
.tit-area[class*=bg-] .icon {flex-shrink:0; margin-right:8px;}
.tit-area[class*=bg-] .icon img {max-width:100%; height:auto;}
.tit-area[class*=bg-] [class^=tit-h] .sub {display:inline-block; margin-right:8px; font-size:18px; font-weight:var(--font-medium); vertical-align:middle;}
.tit-area.bg-light {background-color:var(--bg-light2);}
.tit-area.bg-gray {background-color:var(--bg-light4);}
.tit-area.bg-light [class^=tit-h] {color:var(--color-sec);}
.tit-area.bg-light .tooltips .btn-tooltip {border-color:var(--color-sec); color:var(--color-sec);}
.tit-area.bg-pry {background-color:var(--color-pry); border-radius:8px;}
.tit-area.bg-pry [class^=tit-h] {color:var(--text-white);}
.tit-area .tit-dot,
.tit-area .tit-dot-sub {margin:0;}
.tit-area .right {margin-left:auto; max-width:100%;}
.tit-area .tbl-txt {margin-left:auto;}
.tit-area .total {font-size:15px; font-weight:var(--font-medium);}

@media all and (max-width: 1023px) {
    .tit-h1 {font-size:24px;}
    .tit-h3 {font-size:20px;}
    .tit-bull {margin-bottom:30px;}
    .tit-bull:not(:first-child) {margin-top:30px;}
}
@media all and (max-width: 767px) {
    .tit-area {gap:5px;}
    .tit-area .tbl-txt {font-size:15px;}

    .tit-area[class*=bg-] [class^=tit-h] .sub {display:block; margin:0 0 5px 0; font-size:16px;}
}

/* ====================
	TEXT
==================== */
.font-c1 {color:var(--text-gr900) !important;}
.font-c2 {color:var(--text-gr700) !important;}
.font-c3 {color:var(--text-gr500) !important;}
.font-c4 {color:var(--text-gr400) !important;}
.font-c5 {color:var(--text-gr300) !important;}
.color-pry {color:var(--color-pry) !important;}
.color-sec {color:var(--color-sec) !important;}
.color-trd {color:var(--color-trd) !important;}
.color-wrn {color:var(--text-wrn) !important;}
.color-red {color:var(--text-red) !important;}

/* TEXT LIST */
.txt-list {margin-top:10px; text-align:left; line-height:1.6;}
.area-tbl + .txt-list {margin-top:20px;}
.txt-list:not(ul) {position:relative;}
.txt-list:first-child {margin-top:0 !important;}
.txt-list > li {position:relative; margin:0.22em 0;}
.txt-list .txt-list {margin-top:5px !important;}
.txt-list .txt-list > li {margin:0;}
.txt-list > li:first-child {margin-top:0 !important;}
.txt-list > li:last-child {margin-bottom:0 !important;}
.txt-list:not(ul):before,
.txt-list > li:before {position:absolute; left:0; z-index:1;}

.txt-list.dot:not(ul),
.txt-list.dot > li {padding-left:0.9em;}
.txt-list.dot:not(ul):before,
.txt-list.dot > li:before {content:'•';}

.txt-list.dash:not(ul),
.txt-list.dash > li {padding-left:0.8em;}
.txt-list.dash:not(ul):before,
.txt-list.dash > li:before {content:'-';}

.txt-list.remark:not(ul),
.txt-list.remark > li {padding-left:1em;}
.txt-list.remark:not(ul):before,
.txt-list.remark > li:before {content:'※';}

.txt-list.num-decimal {counter-reset:decimal-counter;}
.txt-list.num-decimal > li {padding-left:1.2em; counter-increment:decimal-counter;}
.txt-list.num-decimal > li:before {content: counter(decimal-counter) ". ";}

.txt-list.num-paren {counter-reset:paren-counter;}
.txt-list.num-paren > li {padding-left:1.2em; counter-increment:paren-counter;}
.txt-list.num-paren > li:before {content: counter(paren-counter) ") ";}
.txt-list.num-paren > li:nth-child(n+10) {padding-left:1.822em;}

.no-indent .txt-list:not(ul),
.no-indent .txt-list > li {padding-left:0 !important;}
.no-indent .txt-list:not(ul):before,
.no-indent .txt-list > li:before {position:static;}
.indent.txt-list:not(ul),
.indent.txt-list > li {padding-left:0.9em;}

.txt-list:not(ul).has-btn,
.txt-list > li.has-btn {display:flex; align-items:center;}
.txt-list > li.has-btn [class^=btns-] {flex-shrink:0; margin-left:auto;}

.txt-list.row {display:flex; flex-wrap:wrap; gap:0 8px;}
.txt-list.row > li {margin-top:0;}

@media all and (max-width: 767px) {
    .txt-list > li.has-btn [class^=btns-] {min-width:auto; min-height:34px; padding:0 8px; font-size:15px;}
    .txt-list > li.has-btn [class^=btns-]::before {content:none;}
}

/* ====================
	TABLE
==================== */
.area-tbl {position:relative; margin:20px -1px 0 0;}
.area-tbl:after {content:''; overflow:hidden; position:absolute; top:0; right:0; bottom:0; width:1px; background-color:var(--bg-white); z-index:1;}
.area-tbl table {width:100%; table-layout:fixed; border-collapse:collapse; border-spacing:0;}
.area-tbl + .area-tbl {margin-top:30px;}
.area-tbl:first-child {margin-top:0 !important;}
.tbl-txt {color:var(--text-gr700); font-size:18px; text-align:right;}

table[class^=table-] {position:relative; background-color:var(--bg-white); line-height:1.4;}
table[class^=table-] thead th {background-color:var(--bg-light2); color:var(--color-sec); font-weight:var(--font-bold);}
table[class^=table-] th,
table[class^=table-] td {height:58px; padding:14px 10px;}
table[class^=table-] tbody th,
table[class^=table-] tbody td,
table[class^=table-] tfoot th,
table[class^=table-] tfoot td {border-bottom:1px solid #cccbcb; color:var(--text-gr700);}
table[class^=table-] th {font-weight:var(--font-regular);}
table[class^=table-] td {}

table[class^=table-].table-col th,
table[class^=table-].table-col td {text-align:center;}

table[class^=table-].table-row th,
table[class^=table-].table-row td {padding:14px 20px; border-bottom:0 none;}
table[class^=table-].table-row th {background-color:var(--bg-light2); color:var(--color-sec); font-weight:var(--font-bold);}
table[class^=table-].table-row td {text-align:left;}
table[class^=table-].table-row thead th {background-color:var(--color-pry); color:var(--text-white);}

table[class^=table-].table-data th {font-weight:var(--font-bold);}
table[class^=table-].table-data th,
table[class^=table-].table-data td {text-align:center;}
table[class^=table-].table-data tbody th[scope="rowgroup"] {background-color:var(--bg-white); border-right:1px solid #cccbcb;}
table[class^=table-].table-data tbody tr:nth-child(even) {background-color:#f8f8f8;}
table[class^=table-].table-data td .em {color:var(--color-sec); font-weight:var(--font-bold);}

table[class^=table-] .type-thead th {background-color:var(--bg-light2); border-bottom:0 none; color:var(--color-sec); font-weight:var(--font-bold);}
table[class^=table-] .type-thead ~ tr:not(:last-child) td {border:0 none;}
table[class^=table-].th-n thead th {color:var(--text-gr900); font-weight:normal;}

table.table-col.mo-row .mo-th {display:none;}

@media all and (max-width: 1023px) {
    .area-tbl table {font-size:16px;}
    table[class^=table-].table-data {font-size:14px !important;}

    table[class^=table-] th,
    table[class^=table-] td {padding:10px 6px;}

    table[class^=table-].table-row th,
    table[class^=table-].table-row td {padding:10px 15px;}
}
@media all and (max-width: 767px) {
    table.table-col.mo-row {display:block; margin-bottom:25px;}
    table.table-col.mo-row caption,
    table.table-col.mo-row colgroup,
    table.table-col.mo-row thead {display:none;}
    table.table-col.mo-row tbody {display:block;}
    table.table-col.mo-row tr {display:block; margin-bottom:10px;}
    table.table-col.mo-row th,
    table.table-col.mo-row td {padding:0; border-bottom:0 none;}
    table.table-col.mo-row td {display:flex; align-items:stretch;}
    table.table-col.mo-row td .mo-th,
    table.table-col.mo-row td .mo-td {display:inline-flex; align-items:center; justify-content:center; padding:10px 6px;}
    table.table-col.mo-row td .mo-th {width:130px; background-color:var(--bg-light2); color:var(--color-sec); font-weight:var(--font-bold);}
    table.table-col.mo-row td .mo-td {flex:1 1;}
}

/* ====================
	MESSAGE
==================== */
.msgs {position:relative; margin:40px 0; text-align:center;}
.msgs .tit {font-size:22px; font-weight:var(--font-bold);}
.msgs .txt {color:var(--text-gr700);}
.msgs .txt.bold {color:var(--text-gr900);}
.msgs .txt.sm {font-size:15px;}
.msgs .txt.sm:not(:first-child) {margin-top:10px;}

.msg-btn-box {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:4px 10px; margin-bottom:30px;}
.msg-btn-box [class^=btns-].sm {flex-shrink:0; min-width:140px; margin-left:auto;}

.noti-box {padding:20px; border:1px solid var(--color-orange);}
.noti-box:not(:first-child) {margin-top:40px;}
.noti-box p {color:var(--color-orange); font-size:15px; font-weight:var(--font-medium); line-height:1.5;}

.no-data {margin:30px 0; padding:25px 0; border-top:1px solid #cccbcb; border-bottom:1px solid #cccbcb; text-align:center;}
.form-box-area .tit-area[class*=bg-] ~ .no-data {margin:0; padding:40px 20px; border-top:0 none; border-bottom:1px solid var(--border-muted);}

@media all and (max-width: 1023px) {
    .msgs {margin:30px 0;}
    .msgs .tit {font-size:20px;}

    .msg-btn-box {margin-bottom:50px;}

    .noti-box:not(:first-child) {margin-top:30px;}
}
@media all and (max-width: 479px) {
    .msgs {text-align:left;}
}

/* ====================
	AMOUNT BOX
==================== */
.amount-box {display:inline-flex; align-items:center; flex-wrap:wrap; gap:8px; color:var(--color-pry); line-height:1.2;}
.amount-box .amount {display:flex; align-items:center; gap:8px;}
.amount-box .amount > span {font-size:34px; font-weight:var(--font-bold);}

@media all and (max-width: 1023px) {
    .amount-box .amount > span {font-size:24px;}
}

/* ====================
	BUTTON
==================== */
[class^=btns-] {display:inline-flex; justify-content:center; align-items:center; position:relative; width:auto; font-size:18px; text-align:center; vertical-align:middle;}
[class^=btns-]:not(button) {line-height:1.2;}
[class^=btns-] > span {display:inline-block; border-bottom:1px solid transparent;}

[class^=btns-] {gap:0 10px; min-width:180px; min-height:50px; padding:0 30px; border-radius:10px; font-weight:var(--font-bold);}
[class^=btns-].md {gap:0 6px; min-width:110px; min-height:40px; padding:0 24px; border-radius:10px; font-weight:var(--font-semibold); letter-spacing:var(--letter-spacing-tight);}
[class^=btns-].sm {gap:0 4px; min-width:100px; min-height:36px; padding:0 14px; border-radius:6px; font-weight:var(--font-medium); letter-spacing:var(--letter-spacing-tight);}
[class^=btns-].xs {min-width:90px; min-height:30px; padding:0 10px; border-radius:6px; font-size:16px; font-weight:var(--font-medium); letter-spacing:var(--letter-spacing-tight);}

[class^=btns-]:not(.btns-outline) {color:var(--text-white);}
[class^=btns-][disabled] {background-color:var(--bg-light4); border-color:var(--bg-light4); color:var(--text-gr300);}
[class^=btns-].round {border-radius:50px;}
.btns-pry {background-color:var(--color-pry);}
.btns-sec {background-color:var(--color-sec);}
.btns-trd {background-color:var(--bg-gr900);}
.btns-fth {background-color:var(--color-pink);}
.btns-gray1 {background-color:#373737;}
.btns-gray2 {background-color:#4c4c4c;}
.btns-gray3 {background-color:var(--bg-gr300);}
.btns-outline {background-color:var(--bg-white); border:1px solid var(--color-pry); color:var(--color-pry);}

[class^=btns-].down::before {content:''; display:inline-block; width:20px; height:17px; background:url(../img/common/icon_btn_down.svg) no-repeat center; background-size:20px auto;}
[class^=btns-].open::after {content:''; display:inline-block; width:24px; height:24px; background:url(../img/common/icon_btn_open.svg) no-repeat center; background-size:24px auto;}
[class^=btns-].idcard::after {content:''; display:inline-block; width:24px; height:24px; background:url(../img/common/icon_btn_idcard.svg) no-repeat center; background-size:24px auto;}

.btn-group {display:flex; justify-content:center; align-items:stretch; margin:40px -4px 0; text-align:center;}
.btn-group [class^=btns-] {margin:0 4px;}
.btn-group.right {justify-content:flex-end;}

.btn-scrap {width:16px; height:20px; background-image:url(../img/common/icon_scrap_off.svg); background-repeat:no-repeat; background-position:center; transition:.15s var(--easeOutSine);}
.btn-scrap.on {background-image:url(../img/common/icon_scrap_on.svg);}

@media all and (max-width: 1023px) {
    /*.btn-group {margin-top:30px;}*/
}

/* ====================
	FORM
==================== */
/*  필수입력 */
.required {display:inline-block; position:relative; margin-right:4px;}
.required:before {content:"*"; display:inline-block; color:var(--text-red); line-height:1;}
.required > span {overflow:hidden; position:absolute !important; width:1px !important; height:1px !important; margin:-1px; border:0; clip:rect(1px, 1px, 1px, 1px); -webkit-clip-path:inset(50%); clip-path:inset(50%);}

.required-txt {margin-left:auto; font-size:15px;}
.required-txt .required {margin-right:0;}

/* INPUT, SELECT, TEXTAREA */
input:not([type=checkbox]):not([type=radio])[readonly],
input:not([type=checkbox]):not([type=radio])[disabled],
select[readonly],
select[disabled] {background-color:#f8f8f8;}

.area-ipt {position:relative;}
input:not([type=checkbox]):not([type=radio]) {width:100%; height:40px; padding:0 10px; border:1px solid #cccbcb; border-radius:4px; background-color:#fff;}
input:not([type=checkbox]):not([type=radio])::placeholder,
select::placeholder,
textarea::placeholder {color:#979797;}
textarea.ipt {width:100%; min-height:150px; padding:15px; border:1px solid #cccbcb; line-height:1.5; resize:none;}

select {width:100%; height:40px; padding:0 34px 0 10px; background:var(--bg-white) url(../img/common/icon_select_arrow.svg) no-repeat right 9px center; border:1px solid #cccbcb; border-radius:4px;}

/* RADIO, CHECKBOX */
.check-item {display:inline-block; position:relative; line-height:1;}
.check-item .ipt {position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; z-index:5;}
.check-item .ipt + label {display:inline-block; position:relative; padding-left:30px; color:var(--text-gr900); font-size:18px; line-height:20px; vertical-align:middle; cursor:pointer; z-index:6;}
.check-item .ipt + label:before {content:''; overflow:hidden; position:absolute; top:0; left:0; width:20px; height:20px; background-color:var(--bg-white); border:1px solid var(--border-muted); box-sizing:border-box; transition:all .15s ease-in-out; z-index:1;}
.check-item .ipt:focus + label {text-decoration:underline;}
.check-item .ipt.readonly + label,
.check-item .ipt[disabled] + label {color:var(--text-gr300);}

.check-item .ipt[type=radio] + label:before {border-radius:50%;}
.check-item .ipt[type=radio]:checked + label:before {background-color:var(--color-pry); box-shadow:inset 0 0 0 4px var(--bg-white);}
.check-item .ipt[type=radio].readonly + label:before,
.check-item .ipt[type=radio][disabled] + label:before {background-color:var(--bg-light4); border-color:var(--bg-light4);}
.check-item .ipt[type=radio].readonly:checked + label:before,
.check-item .ipt[type=radio][disabled]:checked + label:before {background-color:var(--bg-gr300); box-shadow:inset 0 0 0 4px var(--bg-light4);}

.check-item .ipt[type=checkbox] + label:before {border-radius:4px;}
.check-item .ipt[type=checkbox] + label:after {content:''; overflow:hidden; position:absolute; left:6px; top:0; width:9px; height:14px; border-width:0 4px 4px 0; border-style:solid; border-color:var(--border-white); background-color:transparent; transform:rotate(45deg); box-sizing:border-box; z-index:1;}
.check-item .ipt[type=checkbox]:checked + label:after {border-color:var(--color-pry);}
.check-item .ipt[type=checkbox].readonly + label:before,
.check-item .ipt[type=checkbox][disabled] + label:before {background-color:var(--bg-light4); border-color:var(--bg-light4);}
.check-item .ipt[type=checkbox].readonly + label:after,
.check-item .ipt[type=checkbox][disabled] + label:after {border-color:var(--bg-light4);}
.check-item .ipt[type=checkbox].readonly:checked + label:after,
.check-item .ipt[type=checkbox][disabled]:checked + label:after {border-color:var(--bg-gr300);}

.check-group {margin:0 -4px}
.check-group .check-item {display:block; padding:5px 4px;}

.check-group[class*="split-"]:not([class*=check-type-]) {display:flex; flex-wrap:wrap; margin:-10px -10px;}
.check-group.split-auto {justify-content:space-between;}
.check-group.split-row {justify-content:flex-start !important;}
.check-group.split-row .check-item {min-width:84px;}
.check-group[class*="split-"]:not([class*=check-type-]) .check-item {padding:10px;}
.check-group.split-2 .check-item {flex:0 1 50%;}
.check-group.split-3 .check-item {flex:0 1 33.3333%;}
.check-group.split-4 .check-item {flex:0 1 25%;}
.check-group.split-5 .check-item {flex:0 1 20%;}
.check-group.split-6 .check-item {flex:0 1 16.6667%;}
.check-group.split-7 .check-item {flex:0 1 14.2857%;}

/* RADIO, CHECKBOX BUTTON */
.check-group[class*=check-type-] {display:flex; flex-wrap:wrap; align-items:stretch;}
.check-group[class*=check-type-] .check-item .ipt + label {display:block; height:100%; padding:10px 20px; background-color:var(--bg-white); border:1px solid #e0dbdb; border-radius:50px; color:var(--text-gr700); text-align:center; align-content:center;}
.check-group[class*=check-type-] .check-item .ipt + label::after,
.check-group[class*=check-type-] .check-item .ipt + label:before {content:none;}
.check-group[class*=check-type-] .check-item .ipt:focus + label {text-decoration:none;}
.check-group[class*=check-type-] .check-item .ipt:focus-visible + label {outline:-webkit-focus-ring-color auto 1px;}
.check-group[class*=check-type-] .check-item .ipt:checked + label {background-color:var(--color-pry); border-color:var(--color-pry); color:var(--text-white);}
.check-group[class*=check-type-] .check-item .ipt:checked[disabled] + label {border-color:var(--border-muted);}
.check-group[class*=check-type-] .check-item .ipt[disabled] + label {background-color:var(--bg-light4); border-color:var(--bg-light4); color:var(--text-gr200);}

.check-group.check-type-btn {margin:-10px -5px;}
.check-group.check-type-btn .check-item {padding:10px 5px;}
.check-group.check-type-btn .check-item .ipt {top:10px; left:5px; width:calc(100% - 10px); height:calc(100% - 20px);}
.check-group.check-type-btn .check-item .ipt + label {min-height:50px;}

.check-group.check-type-box {margin:-10px;}
.check-group.check-type-box .check-item {padding:10px;}
.check-group.check-type-box .check-item .ipt {top:10px; left:10px; width:calc(100% - 20px); height:calc(100% - 20px);}
.check-group.check-type-box .check-item .ipt + label {min-height:197px;}


/* FORM AREA */
.form-area .form-item {display:flex; margin:20px 0;}
.form-area .form-item[class*="split-"] {flex-wrap:wrap; margin:20px -12px -20px; padding:0;}
.form-area .form-item[class*="split-"] > .form-item {flex-wrap:nowrap; margin:0; padding:0 12px 20px;}
.form-area .form-item.split-2 .form-item {flex:1 1 50%;}
.form-area .form-item.split-3 .form-item {flex:1 1 33.33333%;}

.form-area .form-item .label {display:inline-flex; align-items:center; justify-content:space-between; flex-shrink:0; width:142px; padding:0 12px; line-height:1.2;}
.form-area .form-item .label span:not(.required, .disp-ib) {display:inline-block; font-size:15px;}
.form-area .form-item .form {display:flex; flex-direction:column; justify-content:center;}
.form-area .space {flex:none; width:20px; height:40px; line-height:40px; text-align:center;}

.form-area .form-item .form,
.form-area .form-item .area-slt,
.form-area .form-item .area-ipt,
.form-area .form-item .datepicker,
.form-area .form-item .check-group {flex:1 1;}

.form-area .form-item .ipt-group {display:flex; align-items:center;}
.form-area .form-item .ipt-group [class^=btns-] {min-width:auto; padding:0 20px;}
.form-area .form-item .ipt-group [class^=btns-]:not(:first-child) {margin-left:10px;}

.form-area .form-item .form.addr > .area-ipt {margin-top:10px;}
.form-area .form-item .ipt-group.tel .ipt {max-width:100px;}

.ipt-upload {display:flex; justify-content:flex-end; flex-direction:row-reverse;}
.ipt-upload .btn-file {display:inline-block; position:relative; margin-left:10px;}
.ipt-upload .btn-file input[type=file] {position:absolute; top:0; left:0; width:100%; height:100%; font-size:1px; opacity:0;}
.ipt-upload .btn-file label{min-width:auto; padding:0 20px; cursor:pointer;}
.ipt-upload .btn-file input[type=file]:focus-visible + label {outline:-webkit-focus-ring-color auto 1px;}
.ipt-upload .area-ipt {max-width:200px !important;}
.ipt-upload .area-ipt .btn-del {display:none; position:absolute; right:1px; top:1px; bottom:1px; width:40px; height:calc(100% - 2px); background:url(../img/common/icon_file_del.svg) no-repeat center; background-size:20px; background-color:#f8f8f8; z-index:1;}
.ipt-upload .area-ipt.file-selected .btn-del {display:inline-block;}
.ipt-upload .area-ipt .ipt[type=text][disabled] {opacity:.4;}
.ipt-upload .btn-file input[type=file][disabled] + label {opacity:.4; cursor:default;}
.form-box .form-item:has(.form.upload) ~ .form-item:has(.form.upload) {margin-top:40px;}
.form.upload .ipt-group {margin-top:10px;}
.form.upload .ipt-group .label {width:auto; padding:0 10px 0 0;}
.form.upload .file-txt {margin-top:20px; font-size:16px;}
.form.upload .file-txt:not(:last-child) {margin-bottom:10px;}
.form.upload .file-txt p > span:not(:last-child):after {content:'|'; display:inline-block; margin:0 0 0 5px;}
.form.upload .check-img {display:flex;}
.form.upload .check-img .img-item {flex:1 1;}
.form.upload .check-img .img-item .ipt-upload {margin-top:10px;}
.form.upload .img-area {width:200px; height:120px; margin-top:10px; border:1px solid #cacaca;}
.form.upload .img-area:not(.is-default) {display:none;}
.form.upload.file-uploaded .img-area {display:block;}
.form.upload .img-area .img img {width:100%; height:100%;}
.form.upload .check-img ~ .ipt-group {margin-top:20px;}
.form.upload .check-img ~ .ipt-group {display:none;}
.form.upload.file-uploaded .check-img ~ .ipt-group {display:flex;}

.form-area .txt-form {margin-top:5px; font-size:16px; line-height:1.5;}
.form-area .txt-form.error {color:var(--text-red);}

.form-area .form-info-txt {color:var(--color-pry); font-size:15px; text-align:right;}
.form-area .form-info-txt + .form-item {margin-top:10px;}

.form-area > .form-block:not(:last-child) {margin-bottom:40px;}
.form-area .form-block[class*="split-"] {display:flex; flex-wrap:wrap; margin:0 -25px;}
.form-area .form-block[class*="split-"] .form-block {padding:0 25px;}
.form-area .form-block.split-2 .form-block {flex:1 1 50%;}
.form-area .field-block {margin-top:20px}

/* SEARCH FORM(게시판) */
.search-form {padding:40px 50px; background-color:var(--bg-light3); border-radius:15px;}
.search-form:not(:first-child) {margin-top:50px;}
.search-form .form-area:not(.search) {padding:40px 50px; background-color:var(--bg-white); border-radius:var(--radius-md); box-shadow:2px 4px 8px 0 rgba(0, 0, 0, 0.15);}
.search-form .form-area:not(:first-child) {margin-top:30px;}
.search-form .form-area .tit {margin-bottom:20px; color:var(--color-pry); font-size:22px; font-weight:var(--font-bold);}
.search-form .form-area.type-row {display:flex; align-items:center;}
.search-form .form-area.type-row .tit {margin-right:30px; margin-bottom:0;}
.search-form .form-area.type-row .form-box {flex:1 1 auto;}
.search-form .form-area .form-item .label {width:auto; margin-right:18px; padding:0; font-weight:var(--font-bold);}
.search-form .form-area .form-item[class*="split-"] {margin:-10px -15px;}
.search-form .form-area .form-item[class*="split-"] .form-item {padding:10px 15px;}
.search-form .form-area .form-item[class*="split-"] .label {min-width:3.45em;}
.search-form .form-area .space {width:30px;}

.form-area.search input.ipt {height:50px; padding:0 20px; border:0 none; border-radius:var(--radius-lg);}
.search-form .btn-group {margin-top:30px;}

/* FORM BOX AREA(회원가입 및 단체 등록) */
.form-box-area {padding:50px 40px; border:1px solid #e0dbdb; border-radius:var(--radius-md);}
.form-box-area:not(:first-child) {margin-top:30px;}
.form-box-area .form-area:not(:last-child) {border-bottom:1px solid #e6e6e6;}
.form-box-area .form-area:has(.form-block) {border-bottom:0 none;}
.form-box-area > .tit-area {flex-direction:row; justify-content:flex-start; margin-bottom:40px; padding-bottom:12px; border-bottom:1px solid #a3b0df;}
.form-box-area .form-box {position:relative; margin:40px 0;}
.form-box-area .form-box:last-child {margin-bottom:0;}
.form-box-area .form-box ~ .form-box::before {content:''; position:absolute; top:-20px; width:100%; height:0; border-top:1px solid #e6e6e6;}
.form-box-area select,
.form-box-area input:not([type=checkbox]):not([type=radio]) {border-radius:0;}

/* FORM VIEW */
.form-area.view {position:relative; overflow:hidden; margin-top:-20px;}
.form-area.view::before {content:''; position:absolute; top:0; width:100%; height:0; border-top:1px solid #fff;}
.form-area.view .form-item:not([class*="split-"]) {padding:20px 0;}
.form-area.view .form-item[class*="split-"] {margin:0 -12px; border-top:0 none;}
.form-area.view .form-item,
.form-area.view .form-item[class*="split-"] > .form-item {margin:0; border-top:1px solid #e6e6e6;}
.form-area.view .form-item[class*="split-"] > .form-item {padding:20px 12px;}

/* FORM FIELD */
.form-area[class*="form-field-"] .form-item {justify-content:center;}
.form-area[class*="form-field-"] .form-item:first-child {margin-top:0;}
.form-area[class*="form-field-"] .form-item:last-child {margin-bottom:0;}
.form-area[class*="form-field-"] .form-item .label {padding:0 20px 0 0; font-weight:var(--font-bold);}
.form-area[class*="form-field-"] input:not([type=checkbox]):not([type=radio]) {border-radius:0;}
.form-area.form-field-pw .form-item .label {width:155px;}
.form-area.form-field-pw .form-item .form {max-width:500px;}


/* FORM SIZE */
.w-228 {max-width:228px !important;}

@media all and (max-width: 1023px) {
    /* RADIO, CHECKBOX */
    .check-group[class*="split-"]:not([class*=check-type-]) {margin:-7px;}
    .check-group[class*="split-"]:not([class*=check-type-]) .check-item {padding:7px;}
    .check-group[class*="split-"]:not([class*=check-type-], [class*="mo-split-"]) {justify-content:space-between;}
    .check-group[class*="split-"]:not([class*=check-type-], [class*="mo-split-"]) .check-item {flex:none;}

    .check-group[class*="mo-split-"] {justify-content:flex-start;}
    .check-group.mo-split-2 .check-item {flex:0 1 50%;}
    .check-group.mo-split-3 .check-item {flex:0 1 33.3333%;}
    .check-group.mo-split-4 .check-item {flex:0 1 25%;}
    .check-group.mo-split-5 .check-item {flex:0 1 20%;}
    .check-group.mo-split-6 .check-item {flex:0 1 16.6667%;}
    .check-group.mo-split-7 .check-item {flex:0 1 14.2857%;}

    /* FORM AREA */
    .form-area .form-item .label {width:120px; padding:0 12px 0 0;}
    .form.upload .file-txt {font-size:15px;}

    /* SEARCH FORM(게시판) */
    .search-form {margin:0 var(--spacing-y-neg); padding:30px 20px; border-radius:0;}
    .search-form:not(:first-child) {margin-top:10px;}
    .search-form .form-area:not(.search) {padding:20px; border-radius:12px; box-shadow:none;}
    .search-form .form-area:not(:first-child) {margin-top:20px;}
    .search-form .form-area .tit {font-size:22px; font-weight:var(--font-bold);}
    .search-form .check-item .ipt + label {font-size:16px;}

    /* FORM BOX AREA(회원가입 및 단체 등록) */
    .form-box-area {padding:0; border:0 none;}
    .form-box-area:not(:first-child) {margin-top:40px;}
    .form-box-area > .tit-area {margin-bottom:30px;}
    .form-box-area .form-box:first-child {margin-top:30px;}
}
@media all and (max-width: 767px) {
    /* RADIO, CHECKBOX BUTTON */
    .check-group[class*=check-type-] .check-item .ipt + label {padding:5px; font-size:15px;}
    .check-group.check-type-btn {margin:-5px}
    .check-group.check-type-btn .check-item {padding:5px;}
    .check-group.check-type-btn .check-item .ipt {top:5px; left:5px; width:calc(100% - 10px); height:calc(100% - 10px);}

    .check-group.check-type-box .check-item .ipt + label {min-height:150px;}

    /* FORM AREA */
    .form-area .form-item,
    .form-area .form-item[class*="split-"] .form-item {flex:1 1 100%; flex-wrap:wrap;}
    .form-area .form-item .datepicker {flex:1 0 100%; margin-top:18px;}
    .form-area .form-item .datepicker .date {width:100%;}

    .form-area:not(.view) .form-item:not(.mo-nowrap) > .label,
    .form-area:not(.view) .form-item .form-item:not(.mo-nowrap) .label {width:100%; margin-bottom:10px;}

    .form-box .form-item:has(.form.upload) ~ .form-item:has(.form.upload) {margin-top:20px;}
    .form.upload .ipt-group {flex-wrap:wrap;}
    .form.upload .ipt-group .label {width:100%; margin-bottom:10px;}
    .form.upload .file-txt {margin-top:10px;}
    .form.upload .file-txt:not(:last-child) {margin-bottom:0;}
    .form.upload .check-img {display:block;}
    .form.upload .check-img .img-item ~ .img-item {margin-top:10px;}
    .form.upload .check-img ~ .ipt-group {margin-top:10px;}

    .form-area .form-block[class*="split-"] {margin:0;}
    .form-area .form-block[class*="split-"] .form-block {flex:1 1 100%; padding:0;}
    .form-area .form-block[class*="split-"] .form-block:not(:last-child) {margin-bottom:40px;}

    /* SEARCH FORM(게시판) */
    .search-form .form-area.type-row {display:block;}
    .search-form .form-area.type-row .tit {margin-right:0; margin-bottom:20px;}

    /* FORM VIEW */
    .form-area.view .form-item {gap:20px;}
    .form-area.view .form-item .label {width:auto; max-width:120px; padding:0;}
}

@media all and (max-width: 480px) {
    /* FORM AREA */
    .form-area .form-item .datepicker {flex-direction:column;}
    .form-area .form-item .datepicker .space {height:30px; line-height:30px;}
}

/* ====================
	DATAPICKER
==================== */
.datepicker {display:flex; align-items:center;}
.datepicker .date {position:relative; min-width:170px;}
.datepicker .date input {padding-right:42px;}
.datepicker .date button {position:absolute; right:0; width:42px; height:100%; background:url(../img/common/icon_form_calander.svg) no-repeat center; background-size:24px; text-indent:-5000em;}
.datepicker .date input:read-only,
.datepicker .date input:disabled{background-image:url(../img/common/icon_form_calander.svg); background-repeat:no-repeat; background-position:right 9px center; background-size:24px;}
.datepicker .date input:read-only + button,
.datepicker .date input:disabled + button {display:none;}
.datepicker > [class^="btn-"]:last-child{margin-left:8px;}

/* 년월일 */
.ui-widget-content {background-color:#fff;}
.ui-icon {display:block; overflow:hidden; background-repeat:no-repeat; text-indent:-99999px;}
.ui-datepicker {display:none; overflow:hidden; width:284px; padding:0 12px 20px; border:1px solid #ddd; border-radius:10px;z-index:9999!important;}
.ui-datepicker.mtz-monthpicker {padding:0 25px 25px;}
.ui-datepicker .ui-datepicker-header {position:relative;}
.ui-datepicker .ui-datepicker-header.mtz-monthpicker {padding:25px 0;}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next,
.ui-datepicker .ui-datepicker-prev-y,
.ui-datepicker .ui-datepicker-next-y {overflow:hidden; position:absolute; top:28px; width:24px; height:24px; background:url(../img/common/icon_calendar_arrow.png) no-repeat; border-radius:0;}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled,
.ui-datepicker .ui-datepicker-prev-y:disabled,
.ui-datepicker .ui-datepicker-next-y:disabled {opacity:0.5;}
.ui-datepicker .ui-datepicker-prev {left:43px; background-position:0 -24px;}
.ui-datepicker .ui-datepicker-next {right:43px; background-position:0 -72px;}
.ui-datepicker .ui-datepicker-prev-y {left:15px; background-position:0 0;}
.ui-datepicker .ui-datepicker-next-y {right:15px; background-position:0 -48px;}
.ui-datepicker .ui-datepicker-title {padding:12px 0 4px; font-size:23px; line-height:50px; text-align:center;}
.ui-datepicker .ui-datepicker-title select {margin:0; width:auto; height:auto; padding:0; background:transparent; border:0 none; border-radius:0; font-size:20px; font-weight:var(--font-bold); letter-spacing:0; vertical-align:middle; -webkit-appearance:none; appearance:none;}
.ui-datepicker .ui-datepicker-title select option {color:var(--text-gr900);}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {width:auto;}
.ui-datepicker table {width:100%; font-size:15px;}
.ui-datepicker th {height:36px; padding-bottom:4px; font-size:15px; font-weight:var(--font-regular); text-align:center;}
.ui-datepicker td {height:1.6em; margin:0; padding:4px 0; font-size:15px; line-height:1.6em; text-align:center; white-space:nowrap;text-decoration:none;}
.ui-datepicker table.mtz-monthpicker {border-width:1px 0 0 1px; border-style:solid; border-color:var(--bg-light6);}
.ui-datepicker table.mtz-monthpicker td {border-width:0 1px 1px 0; border-style:solid; border-color:var(--bg-light6); cursor:pointer;}
.ui-datepicker table.mtz-monthpicker td:hover {background-color:#f8fafb;}
.ui-datepicker td span,
.ui-datepicker td a {display:inline-block; width:32px; line-height:20px; padding:6px 0; border-radius:50%; color:var(--text-gr900); text-align:center; text-decoration:none; vertical-align:middle;}
.ui-datepicker td a:hover,
.ui-datepicker td a:focus {background-color:#e5e5e5;}
.ui-datepicker .ui-datepicker-buttonpane {background:none; border:none;}
.ui-datepicker .ui-datepicker-buttonpane button {overflow:hidden; position:absolute; right:6px;top:6px;width:20px;height:20px;background:url(../img/common/icon_calendar_close.png) no-repeat center; text-indent:-5000em; cursor:pointer;}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {display:none; left:22px; background:none; color:#666; font-size:13px; line-height:25px;text-align:center;}
.ui-datepicker .ui-state-highlight {background-color:var(--color-pry); font-weight:var(--font-medium); color:var(--text-white) !important;}
.ui-datepicker .ui-datepicker-today .ui-state-highlight {background-color:var(--bg-gr500)}
.ui-datepicker .ui-datepicker-today .ui-state-highlight:hover,
.ui-datepicker .ui-datepicker-today .ui-state-highlight:focus {color:var(--text-white);}
.ui-datepicker .ui-datepicker-week-end:first-child span,
.ui-datepicker .ui-datepicker-week-end:first-child a {color:#ff3700;}
.ui-datepicker .ui-datepicker-week-end span,
.ui-datepicker .ui-datepicker-week-end a {color:#1e5bc5;}
.ui-datepicker .ui-state-disabled .ui-state-default,
.ui-datepicker .ui-datepicker-week-end.ui-state-disabled .ui-state-default {color:#8a8a8a;}
.ui-datepicker .ui-state-default.ui-priority-secondary {color:#666;}
.ui-datepicker .ui-state-default.ui-state-active {background-color:var(--color-pry); border-color:var(--color-pry); font-weight:var(--font-medium); color:var(--text-white);}

.ui-datepicker.ui-datepicker-multi {width:auto;}
.ui-datepicker-multi .ui-datepicker-group {float:left;}
.ui-datepicker-multi .ui-datepicker-group table {width:95%; margin:0 auto .4em;}
.ui-datepicker-multi-2 .ui-datepicker-group {width:50%;}
.ui-datepicker-multi-3 .ui-datepicker-group {width:33.3%;}
.ui-datepicker-multi-4 .ui-datepicker-group {width:25%;}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {border-left-width:0;}
.ui-datepicker-multi .ui-datepicker-buttonpane {clear:left;}
.ui-datepicker-row-break {clear:both; width:100%; font-size:0;}


/* ====================
	TAB
==================== */
.tab-menu {position:relative; margin:0 -10px 80px; padding:0 10px;}
.tab-menu::before {content:''; position:absolute; left:10px; right:10px; bottom:10px; height:2px; background-color:var(--border-gray);}
.tab-menu .tab-menu-inr {overflow-y:hidden; overflow-x:auto; margin:0 -10px -10px; padding:0 10px 10px;}
.tab-menu .tab-menu-inr::-webkit-scrollbar {display:none;}
.tab-menu ul {position:relative; display:flex; flex-wrap:nowrap; width:100%;}
.tab-menu li:not(:first-child:nth-last-child(1)) {display:flex; width:100%;}
.tab-menu li a {position:relative; display:flex; justify-content:center; align-items:center; width:100%; min-height:60px; padding:5px 30px; font-size:19px; font-weight:var(--font-bold); color:var(--text-gr300); letter-spacing:var(--letter-spacing-tight); white-space:nowrap;}
.tab-menu li a:focus-visible {outline-offset:-2px;}
.tab-menu li.on a {color:var(--color-sec); z-index:1;}
.tab-menu li.on a::after {content:''; position:absolute; left:0; right:0; bottom:0; height:2px; background-color:var(--color-sec); border-radius:2px;}
.tab-menu .tab-menu-btn {position:absolute; top:50%; display:none; width:32px; height:32px; background:var(--bg-white) url(../img/common/icon_slide_arrow_gray.svg) no-repeat center; background-size:19px; border:1px solid var(--border-gray-light); border-radius:50%; transform:translateY(calc(-50% - 5px)); z-index:2;}
.tab-menu .tab-menu-btn:disabled {display:none;}
.tab-menu.scrollable .tab-menu-btn:not(:disabled) {display:block;}
.tab-menu .tab-prev-btn {left:-2px;}
.tab-menu .tab-next-btn {right:-2px; transform:translateY(calc(-50% - 5px)) rotate(-180deg);}
.tab-menu .tab-menu-inr::after {content:''; position:absolute; top:0; bottom:10px; display:none; width:52px; z-index:1;}
.tab-menu .tab-menu-inr.next::after {display:block; right:0; background:linear-gradient(90deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 1) 50%);}
.tab-menu .tab-menu-inr.prev::after {display:block; left:0; background:linear-gradient(-90deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 1) 50%);}
.cont-wrap-box .tab-menu {margin-bottom:60px;}

.tab-menu-sub {position:relative; margin:0 -10px 40px; padding:0 10px;}
.tab-menu-sub.on {display:block !important;}
.tab-menu-sub ul {position:relative; display:flex; flex-wrap:nowrap; gap:14px; width:100%;}
.tab-menu-sub li:not(:first-child:nth-last-child(1)) {display:flex; width:100%;}
.tab-menu-sub li a {position:relative; display:flex; justify-content:center; align-items:center; width:100%; min-height:60px; padding:5px 10px; background-color:#eaeaea; border-radius:var(--radius-sm);  color:var(--text-gr500);font-size:18px; font-weight:var(--font-semibold); text-align:center; line-height:1.2; letter-spacing:var(--letter-spacing-tight);}
.tab-menu-sub li a:focus-visible {outline-offset:2px;}
.tab-menu-sub li.on a {background-color:var(--bg-cell); color:var(--text-white); z-index:1;}
.tab-menu ~ .tab-menu-sub,
.tab-menu + .tab-content-tit ~ .tab-menu-sub {margin-top:80px;}
.tab-menu ~ .tab-menu-sub {display:none;}
.tab-menu ~ .tab-menu-sub li.on a {background-color:var(--bg-gr900);}

.tab-category {position:relative;}
.tab-category .tab-menu-inr {overflow-y:hidden; overflow-x:auto; margin:0 -10px -10px; padding:0 10px 10px;}
.tab-category .tab-menu-inr::-webkit-scrollbar {display:none;}
.tab-category ul {position:relative; display:flex; flex-wrap:wrap; width:100%; gap:10px; row-gap:16px;}
.tab-category li {flex:none; flex-grow:0;}
.tab-category li a {display:flex; justify-content:center; align-items:center; padding:0 20px; height:auto; min-height:44px; border:1px solid var(--border-muted); border-radius:22px; background-color:var(--bg-white); font-size:20px; font-weight:var(--font-semibold); color:var(--text-gr300);}
.tab-category li a:focus-visible {outline-offset:-2px;}
.tab-category li a::after {content:none;}
.tab-category li.on a {background-color:var(--color-trd); border-color:var(--color-trd); color:var(--text-white);}
.tab-category .tab-menu-btn {display:none;}

/* CONTENT */
.tab-content-tit {overflow:hidden; position:absolute; z-index:-1; width:1px; height:1px; font-size:1px; opacity:.01; clip:rect(1px,1px,1px,1px);}
.tab-content .tab-panel {display:none;}
.tab-content .tab-panel.on {display:block;}
.tab-content .tit-area[class*=bg-]:not(:first-child) {margin-top:20px;}

@media all and (max-width: 1023px) {
    .tab-menu {margin:0 -10px 30px;}
    .tab-menu li a {min-height:48px; padding:5px 10px; font-size:16px;}
    .cont-wrap-box .tab-menu {margin-bottom:30px;}

    .tab-menu-sub {margin:0 -10px 30px;}
    .tab-menu-sub ul {gap:10px;}

    .tab-category ul {flex-wrap:nowrap; gap:0;}
    .tab-category li ~ li {margin-left:-1px;}
    .tab-category li a {position:relative; padding:0 26px; border:0 none; font-weight:var(--font-medium);}
    .tab-category li:not(.on) a {border-radius:0;}
    .tab-category li.on a {background-color:var(--bg-gr500); z-index:1;}
    .tab-category li ~ li:not(.on) a::before {content:''; position:absolute; left:-1px; top:50%; width:1px; height:14px; margin-top:-7px; background-color:var(--bg-gr700);}
}

/* ====================
	STEP
==================== */
.list-step-row {position:relative; display:flex; justify-content:space-between; margin:0 -10px;}
.list-step-row > li {position:relative; flex:1 1; padding:0 10px; color:#6c6c6c; font-weight:var(--font-bold); text-align:center;}
.list-step-row > li i {position:relative; display:block; width:46px; height:46px; margin:0 auto 20px; border:3px solid transparent; border-radius:50%; z-index:1;}
.list-step-row > li i::after {content:''; position:absolute; top:50%; left:50%; display:block; width:32px; height:32px; background-color:#ccc; border-radius:50%; transform:translate(-50%, -50%); z-index:1;}
.list-step-row > li:after {content:''; position:absolute; left:50%; top:23px; width:100%; border-top:2px dashed #ccc; transform:translateY(-50%);}
.list-step-row > li:last-child:after {content:none;}
.list-step-row > li.on {color:var(--color-sec);}
.list-step-row > li.on i {border-color:var(--color-sec);}
.list-step-row > li.on i::after {background-color:var(--color-sec);}
.list-step-row > li .step {display:block;}

@media all and (max-width: 1023px) {
    .list-step-row {margin:0 -4px;}
    .list-step-row > li {padding:0 4px; font-size:16px; line-height:1.5;}
}


/* ====================
	BOARD
==================== */
/* HEAD */
.board-info .btn-area {margin-top:10px; text-align:right;}
.board-info .btn-area [class^=btns-] {min-width:auto; min-height:44px; padding:0 15px; font-size:16px; font-weight:var(--font-medium);}

.board-search {display:flex; gap:10px; max-width:816px; margin:0 auto;}
.board-search select {max-width:200px;}
.board-search [class^="btns-"] {min-width:96px;}

.board-head {display:flex; align-items:flex-end; margin-bottom:10px;}
.board-head .total {margin-left:auto; font-size:15px; font-weight:var(--font-medium);}

/* LIST */
.board-area [class^="board-list-"] {margin-top:30px;}
.board-list-col > li {position:relative;}
.board-list-col > li .btn-scrap {position:absolute; top:20px; right:20px; z-index:1;}
.board-list-col > li > a {display:flex; align-items:center; justify-content:space-between; padding:30px 40px; border:1px solid var(--border-muted); border-radius:var(--radius-md);}
.board-list-col > li:not(:first-child) {margin-top:20px;}
.board-list-col .img-area {display:inline-block; flex-shrink:0; position:relative; width:182px;}
.board-list-col .img-area .img {display:block; overflow:hidden; position:relative; height:117px;}
.board-list-col .img-area .img img {position:absolute; left:50%; top:50%; width:100%; height:auto; transform:translate(-50%, -50%); object-fit:cover;}
.board-list-col .img-area .txt {display:block; padding:6px; background-color:var(--bg-light6); color:var(--text-black); font-size:15px; font-weight:var(--font-medium); letter-spacing:var(--letter-spacing-tight); text-align:center; line-height:1.2;}
.board-list-col .info-area {flex:1 1 auto; min-width:0; margin:0 46px 0 20px; text-align:left;}
.board-list-col .tit-box {display:flex; align-items:center; margin-bottom:14px;}
.board-list-col .tit-box .tit {overflow:hidden; max-width:100%; color:var(--text-black); font-size:22px; font-weight:var(--font-bold); text-overflow:ellipsis; white-space:nowrap;}
.board-list-col .tit-box .flag {flex-shrink:0; margin-right:4px;}
.board-list-col .info-area .desc {margin-top:10px;}
.board-list-col .info-list {display:flex; flex-wrap:wrap; margin:-5px -10px;}
.board-list-col .info-list > li {display:flex; padding:5px 10px;}
.board-list-col .info-list > li .item {display:block; flex-shrink:0; min-width:3.26em; margin-right:15px; color:var(--color-pry); font-weight:var(--font-semibold); letter-spacing:var(--letter-spacing-tight);}
.board-list-col .info-list > li .val {display:block;}
.board-list-col .info-list > li.full {width:100%;}
.board-list-col .info-list > li.full .val {overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical;}
.board-list-col .tag-area {display:inline-block; flex-shrink:0; width:120px; padding:10px 2px; border:1px solid var(--color-sec); border-radius:var(--radius-sm); color:var(--color-sec); font-weight:var(--font-semibold); text-align:center;}
.board-list-col .tag-area > span {display:block;}

.form-box-area .board-list-col > li {margin:0; border-bottom:1px solid var(--border-muted);}
.form-box-area .board-list-col > li > a {border:0 none;}

.board-list-row {display:flex; align-items:stretch; flex-wrap:wrap; margin:30px -10px -30px;}
.board-list-row > li {flex:0 1 25%; padding:0 10px 30px;}
.board-list-row > li > a {display:block; height:100%; padding:30px 20px; border:1px solid var(--border-muted); border-radius:16px; text-align:center;}
.board-list-row .img-area {position:relative; margin-bottom:14px;}
.board-list-row .img-area .status {position:absolute; top:0; left:0; min-width:56px; line-height:32px; padding:0 5px; color:var(--text-white); font-size:16px; font-weight:var(--font-semibold); text-align:center; z-index:1;}
.board-list-row .img-area .status.ing {background-color:var(--color-pry);}
.board-list-row .img-area .status.end {background-color:var(--bg-gr900);}
.board-list-row .img-area .img {display:block; overflow:hidden; position:relative; /*padding-top:54.87804%;*/ padding-top:56.25%; /* 이미지비율 16:9 */}
.board-list-row .img-area .img img {position:absolute; left:50%; top:0; width:100%; height:auto; min-height:100%; transform:translate(-50%, 0); object-fit:cover;}
.board-list-row .tit {overflow:hidden; display:-webkit-box; margin-bottom:14px; font-size:22px; font-weight:var(--font-bold); -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; text-align:left;}
.board-list-row .date {color:var(--text-gr700);}
.board-list-row .date.icon::before {content:''; display:inline-block; width:24px; height:24px; margin-right:4px; background:url(../img/common/icon_board_date.svg) no-repeat center; vertical-align:middle;}
.board-list-row .tag {display:inline-block; margin-top:10px; padding:4px 10px; border:1px solid var(--color-pry); border-radius:var(--radius-sm); color:var(--color-pry); font-weight:var(--font-semibold); text-align:center;}

/* TABLE */
.board-table {display:table; width:100%; margin:0; border-collapse:collapse; border-spacing:0; table-layout:fixed;}
.board-table .tbl-head {display:table-header-group;}
.board-table .tbl-body {display:table-row-group;}
.board-table .tbl-tr {display:table-row;}
.board-table .tbl-tr .tbl-cell {display:table-cell; text-align:center; vertical-align:middle;}
.board-table .tbl-tr .tbl-cell > span {display:inline-block; text-align:left;}

.board-table .tbl-head .tbl-cell {position:relative; padding:12px 10px; background-color:var(--bg-cell); color:var(--text-white); font-weight:var(--font-medium); line-height:1.2;}
.board-table .tbl-head .tbl-cell:before,
.board-table .tbl-head .tbl-cell:after {content:''; position:absolute; top:0; bottom:0; width:1px; background-color:var(--bg-white);}
.board-table .tbl-head .tbl-cell:before {left:0;}
.board-table .tbl-head .tbl-cell:after {right:0;}
.board-table .tbl-head .tbl-cell th:first-child:before {display:none;}
.board-table .tbl-head .tbl-cell th:last-child::after {display:none;}

.board-table .tbl-body .tbl-tr {border-bottom:1px solid #cccbcb;}
.board-table .tbl-body .tbl-cell {padding:20px 11px; }
.board-table .tbl-body .tbl-tr .tbl-cell.center {text-align:center;}
.board-table .tbl-body .tbl-cell.title {text-align:left;}
.board-table .tbl-body .tbl-cell.title a {display:inline-block;}
.board-table .tbl-body .tbl-cell.title .icon-attach {display:inline-block; width:24px; height:24px;  background:url(../img/common/icon_board_attach.svg) no-repeat center; vertical-align:middle;}
.board-table .tbl-body .tbl-cell.desc {text-align:left;}
.board-table .tbl-cell [class^=btns-] {min-width:auto;}

.board-table .btn-area {margin:-2px;}
.board-table .btn-area [class^=btns-] {min-width:90px; margin:2px;}

/* PAGINATE */
.paging {display:flex; justify-content:center; align-items:center; margin-top:30px;}
.paging.is-mobile {display:none;}
.paging .page-num {display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; margin:0 8px;}
.paging .page-num > li {min-width:40px; height:40px;}
.paging .page-num > li a {display:inline-flex; width:100%; height:100%; justify-content:center; align-items:center;  border-radius:6px; color:var(--text-gr400); font-size:17px; cursor:pointer;}
.paging .page-num > li:not(.on) a:hover {text-decoration:underline;}
.paging .page-num > li a:focus-visible {outline-offset:2px;}
.paging .page-num > li.on a {background-color:var(--text-gr900); color:var(--text-white);}
.paging .page-num > li i {display:inline-flex; width:100%; height:100%; background:url(../img/common/icon_paging_ellipsis.svg) no-repeat center;}
.paging [class^="btn-"] {display:inline-flex; align-items:center; flex-shrink:0; min-height:40px; padding:0 3px; color:var(--text-gr400);}
.paging [class^="btn-"]::after {content:''; display:inline-block; width:24px; height:24px; -webkit-mask-image:url(../img/common/icon_paging_arrow.svg); mask-image:url(../img/common/icon_paging_arrow.svg); mask-repeat:no-repeat; mask-size:100%; background-color:var(--text-gr400);}
.paging [class^="btn-"][disabled] {color:var(--text-gr200);}
.paging [class^="btn-"][disabled]::after {background-color:var(--text-gr200);}
.paging .btn-prev {flex-direction:row-reverse;}
.paging .btn-prev:first-child {padding:0 8px 0 0;}
.paging .btn-next:last-child {padding:0 0 0 8px;}
.paging .btn-prev::after {transform:rotate(180deg);}
.paging .btn-first::after,
.paging .btn-last::after {-webkit-mask-image:url(../img/common/icon_paging_arrow2.svg); mask-image:url(../img/common/icon_paging_arrow2.svg);}
.paging .btn-first::after {transform:rotate(180deg);}

/* VIEW (basic) */
.board-view-tit {margin-bottom:20px; padding:20px 40px; background-color:#ededed; border-top:1px solid #c2c2c2; border-bottom:1px solid #c2c2c2;}
.board-view-tit [class^=tit-h] {line-height:1.6;}
.board-view-tbl {border-top:1px solid #c2c2c2; border-bottom:1px solid #c2c2c2;}
.board-view-tbl > ul {display:flex; flex-wrap:wrap;}
.board-view-tbl > ul > li {display:flex; align-items:stretch; flex:1 1 50%;}
.board-view-tbl > ul > li.full {flex:1 1 100%;}
.board-view-tbl > ul > li > span {display:inline-flex; align-items:center; padding:10px 12px;}
.board-view-tbl > ul > li .item {justify-content:center; flex-shrink:0; width:166px; background-color:#ededed; text-align:center;}
.board-view-tbl > ul > li .val {flex:1 1; padding:10px 12px;}
.board-view-cont {margin-top:20px; padding:30px; background-color:var(--bg-white); color:var(--text-gr700); white-space:pre-line !important;}
.board-view-cont img {width:100%; margin-top:4px;}

.board-view-file { display:flex; align-items:stretch; background-color:var(--bg-white); border-top:1px solid #c2c2c2; border-bottom:1px solid #c2c2c2; color:var(--text-gr700);}
.board-view-file .tit {display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:143px; border-right:1px solid #c2c2c2; font-weight:var(--font-bold);}
.board-view-file .file-list {flex:1 1;}
.board-view-file .file-list > li {padding:12px 20px; font-size:0; line-height:1;}
.board-view-file .file-list > li ~ li {border-top:1px solid #c2c2c2;}
.board-view-file .file-list > li a {display:inline-flex; font-size:18px; line-height:1.2; text-decoration:underline; text-underline-position:under;}
.board-view-file .file-list > li a::before {content:''; display:inline-block; flex-shrink:0; width:24px; height:24px; margin-right:10px; background:url(../img/common/icon_board_attach.svg) no-repeat center; vertical-align:middle;}
.board-view-nav {display:flex; justify-content:space-between; align-items:center; justify-content:center; margin:80px auto 0; gap:40px;}
.board-view-nav:first-child {justify-content:flex-start; margin:0 0 30px;}
.board-view-nav .list [class^="btns-"] {min-width:100px;}
.board-view-nav > [class^="btn-"] {display:inline-flex; align-items:center; flex-shrink:0; min-height:40px; color:var(--text-gr400);}
.board-view-nav > [class^="btn-"]::after {content:''; display:inline-block; width:24px; height:24px; -webkit-mask-image:url(../img/common/icon_paging_arrow.svg); mask-image:url(../img/common/icon_paging_arrow.svg); mask-repeat:no-repeat; mask-size:100%; background-color:var(--text-gr400);}
.board-view-nav > [class^="btn-"][disabled] {color:var(--text-gr200);}
.board-view-nav > [class^="btn-"][disabled]::after {background-color:var(--text-gr200);}
.board-view-nav .btn-prev {padding:0 8px 0 4px; flex-direction:row-reverse;}
.board-view-nav .btn-next {padding:0 4px 0 8px;}
.board-view-nav .btn-prev::after {transform:rotate(180deg);}

/* VIEW (campaign) */
.campaign-visual {padding:57px 20px; background-repeat:no-repeat; background-size:cover; border-width:2px 0 1px 0; border-style:solid; text-align:center;}
.campaign-visual.online {background-image:url(../img/common/bg_campaign_visual_online.jpg); background-position:left top; border-color:var(--color-sec);}
.campaign-visual.offline {background-image:url(../img/common/bg_campaign_visual_offline.jpg); background-position:center top; border-color:#515151;}
.campaign-visual .tag {display:inline-block; margin-bottom:20px; padding:4px 10px; border:1px solid var(--color-pry); border-radius:var(--radius-sm); color:var(--color-pry); font-weight:var(--font-semibold); text-align:center;}
.campaign-visual .tit {font-size:34px; font-weight:var(--font-bold); line-height:1.2;}
.campaign-visual .tit > span {display:block;}
.campaign-visual .amount-box {margin-top:20px;}
.campaign-visual .date {margin-top:20px; color:var(--bg-gr700); line-height:1.2;}
.campaign-visual .btn-area {display:flex; justify-content:center; align-items:stretch; margin:20px -5px -5px; text-align:center;}
.campaign-visual .btn-area [class^=btns-] {min-width:auto; margin:0 5px 5px;}
.campaign-visual .btn-area [class^=btns-]::after {content:''; display:inline-block; background-repeat:no-repeat; background-position:center; background-size:100% auto;}
.campaign-visual .btn-area [class^=btns-].with::after {width:40px; height:25px; background-image:url(../img/common/icon_btn_width.svg);}
.campaign-visual .btn-area [class^=btns-].fund::after {width:28px; height:32px; background-image:url(../img/common/icon_btn_fund.svg);}

.campaign-detail {margin-top:30px; white-space:pre-line !important;}
.campaign-detail .img-area {margin-top:30px; text-align:center;}
.campaign-detail .img-area img {width:100%; max-height:800px; object-fit:contain;}

.btn-list-more {display:inline-flex; align-items:center; justify-content:center; gap:4px; height:42px; padding:0 20px; background-color:var(--bg-white); border:1px solid #cdd1d5; border-radius:24px; color:var(--text-gr500); font-size:18px; font-weight:var(--font-bold);}
.btn-list-more::after {content:''; display:inline-block; width:24px; height:24px; background:url(../img/main/icon_recruit_more.svg) no-repeat center; background-size:24px;}

@media all and (max-width: 1023px) {
    /* HEAD */
    .board-info .btn-area {margin-top:20px;}

    /* LIST */
    .board-area [class^="board-list-"] {margin-top:20px;}
    /*.board-list-col > li > a {display:block; text-align:center; padding:20px;}
    .board-list-col .img-area {margin-bottom:14px;}
    .board-list-col .info-area {margin:0;}
    .board-list-col .tit-box .tit {display:-webkit-box; font-size:20px; line-height:1.4; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; white-space:normal;}
    .board-list-col .tag-area {display:inline-flex; gap:10px; width:auto; margin-top:10px; padding:4px 20px;}*/
    .board-list-col > li > a {display:block; position:relative; padding:20px 20px 20px 222px;}
    .board-list-col .img-area {position:absolute; top:50%; left:20px; transform:translateY(-50%);}
    .board-list-col .info-area {margin:0;}
    .board-list-col .tit-box .tit {display:-webkit-box; font-size:20px; line-height:1.4; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; white-space:normal;}
    .board-list-col .tag-area {display:inline-flex; gap:10px; width:auto; margin-top:10px; padding:4px 20px;}

    .board-list-row {margin:20px -10px -20px;}
    .board-list-row > li {flex:0 1 50%; padding:0 10px 20px;}

    /* TABLE */
    .board-table {display:block; width:auto; margin:0 var(--spacing-y-neg); border-top:1px solid var(--color-sec);}
    .board-table .tbl-head {display:none;}
    .board-table .tbl-body {display:block;}
    .board-table .tbl-tr {display:block;}
    .board-table .tbl-tr .tbl-cell:not(.btn) {text-align:left;}
    .board-table .tbl-tr .tbl-cell > span {text-align:inherit;}
    .board-table .tbl-tr .tbl-cell {display:block; width:auto !important;}
    .board-table .tbl-tr .tbl-cell.no,
    .board-table .tbl-tr .tbl-cell.hits {display:none;}
    .board-table .tbl-body .tbl-tr {display:flex; flex-wrap:wrap; padding:20px;}
    .board-table .tbl-body .tbl-cell {padding:0; font-size:16px;}
    .board-table .tbl-body .tbl-tr .tbl-cell.center {text-align:left;}

    .board-table:not(.half) .tbl-cell.title {flex:1 1 100%; margin-bottom:4px; font-size:18px; font-weight:var(--font-bold);}
    .board-table:not(.half) .tbl-cell.desc {flex:1 1 100%;}
    .board-table:not(.half) .tbl-cell.btn {flex:1 1 100%; margin-top:10px;}
    .board-table:not(.half) .tbl-cell.btn [class^=btns-] {min-width:160px;}
    .board-table:not(.half) .tbl-cell.btn [class^=btns-].sm {min-height:34px; font-size:15px;}

    .board-table:not(.half) .tbl-cell:not([class^="tbl-cell "], :last-child) {position:relative; margin-right:40px;}
    .board-table:not(.half) .tbl-cell:not([class^="tbl-cell "], :last-child):after {content:''; overflow:hidden; position:absolute; top:50%; width:1px; height:14px; right:calc(40px/-2); background-color:#ddd; transform:translateY(-50%); z-index:1;}
    .board-table:not(.half) .tbl-tr:has(:last-child[class^="tbl-cell "]) .tbl-cell:nth-last-child(2) {margin-right:0;}
    .board-table:not(.half) .tbl-tr:has(:last-child[class^="tbl-cell "]) .tbl-cell:nth-last-child(2):after {display:none;}

    .board-table.half .tbl-body .tbl-tr {justify-content:space-between;}
    .board-table.half .tbl-tr .tbl-cell {text-align:center;}
    .board-table.half .tbl-cell:not([class^="tbl-cell "]) {flex:1 1; position:relative; padding:0 5px;}
    .board-table.half .tbl-cell:not([class^="tbl-cell "]) + .tbl-cell:not([class^="tbl-cell "])::after {content:''; overflow:hidden; position:absolute; top:50%; left:0; width:1px; height:15px; background-color:#000; transform:translateY(-50%); z-index:1;}
    .board-table.half .tbl-cell.title {flex:1 1 100%; margin-bottom:14px; text-align:center !important; font-weight:normal;}
    .board-table.half .tbl-cell.btn {flex:1 1 100%;}
    .board-table .btn-area {display:flex; margin-top:10px;}
    .board-table .btn-area > div {flex:1 1;}

    /* PAGINATE */
    .paging.is-pc {display:none;}
    .paging.is-mobile {display:flex;}

    /* VIEW (basic) */
    .board-view.basic {margin:0 var(--spacing-y-neg);}
    .board-view-tit {padding:10px 20px;}
    .board-view-tit [class^=tit-h] {line-height:1.5;}
    .board-view-tbl > ul > li {flex:1 1 100%;}
    .board-view-cont {margin-top:0;}

    .board-view-file {padding:10px 20px;}
    .board-view-file .tit {display:block; width:auto; margin-right:10px; border-right:0 none;}
    .board-view-file .tit > span {display:none;}
    .board-view-file .file-list {flex:1 1;}
    .board-view-file .file-list > li {padding:0;}
    .board-view-file .file-list > li ~ li {margin-top:10px; border-top:0 none;}
    .board-view-file .file-list > li a {display:inline-flex; font-size:18px; line-height:1.2; text-decoration:underline; text-underline-position:under;}
    .board-view-file .file-list > li a::before {content:''; display:inline-block; flex-shrink:0; width:24px; height:24px; margin-right:10px; background:url(../img/common/icon_board_attach.svg) no-repeat center; vertical-align:middle;}
    .board-view-nav {margin:30px auto 0; gap:8px;}
    .board-view-nav:first-child {margin:0 0 20px;}

    /* VIEW (campaign) */
    .campaign-visual {margin:0 var(--spacing-y-neg);}
    .campaign-visual .tit {font-size:24px;}
}
@media all and (max-width: 767px) {
    /* HEAD */
    .board-search {position:relative; display:block; padding-right:106px;}
    .board-search select {max-width:none; margin-bottom:10px;}
    .board-search [class^="btns-"] {position:absolute; right:0; bottom:0;}

    /* LIST */
    .board-list-col > li > a {padding:20px; text-align:center;}
    .board-list-col .img-area {position:static; top:auto; left:auto; margin-bottom:14px; transform:translateY(0);}

    .board-list-col .info-list {display:block; margin:0;}
    .board-list-col .info-list > li {padding:0;}

    .board-list-row > li {flex:0 1 100%;}

    /* VIEW (basic) */
    .board-view-tbl > ul > li .item {width:120px;}

    /* VIEW (campaign) */
    .campaign-visual .tit > span {display:inline;}
}
@media all and (max-width: 479px) {
    /* PAGINATE */
    .paging .page-num {gap:1px; margin:0 2px;}
    .paging .page-num > li {min-width:37px; height:37px;}
    .paging .btn-prev:first-child {padding:0 6px 0 0;}
    .paging .btn-next:last-child {padding:0 0 0 6px;}

    /* VIEW (campaign) */
    .campaign-visual .btn-area [class^=btns-] {flex:1 1; padding:0 20px;}
}

/* MODELSS*/
.popup-wrap.popup-wrap-modeless,
.popup-wrap.popup-wrap-modeless .dimmed {
    position: absolute;
    left: 150px;
    top: 150px;
    right: auto;
    bottom: auto;
    height: auto;
}
.popup-wrap.popup-wrap-modeless {align-items: flex-end;padding: 0 20px 20px;}
.popup-wrap.popup-wrap-modeless .dimmed {background-color: transparent;opacity: 0;pointer-events: none;}
@media all and (max-width: 767px) {
  .popup-wrap.popup-wrap-modeless {
    position: absolute;
    left: 0; right: 0;
    top: 0;
    bottom: auto;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 12px;
    min-height: 300px;
    z-index: 1000;
    pointer-events: none;
  }

  .popup-wrap.popup-wrap-modeless .dimmed {
    position: absolute;
    left: 0; top: 0; right: 0; bottom: 0;
    opacity: 0;
    pointer-events: none;
  }

  .popup-wrap.popup-wrap-modeless .popup-body {
    pointer-events: auto;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 24px);
  }

  .popup-wrap.popup-wrap-modeless .popup-container {
    flex: 1 1 auto;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  .popup-wrap.popup-wrap-modeless .popup-content {
    overflow: visible;
  }
}
.banner-popup-content .txt-area img.bnr-img{width:100%; height:100%;}

/* ====================
	POPUP
==================== */
.popup-wrap,
.popup-wrap .dimmed {position:fixed; left:0; right:0; top:0; bottom:0; height:100%;}
.popup-wrap {visibility:hidden; display:flex; align-items:center; justify-content:center; padding:40px 20px; transition:0s 0.3s; z-index:1000;}
.popup-wrap.on {visibility:visible; transition-delay:0s;}
.popup-wrap .dimmed {background-color:rgba(0,0,0,.6); opacity:0; transition:all .3s ease-in-out;}
.popup-wrap.on .dimmed{opacity:1;}
.popup-wrap.on[inert] .dimmed{opacity:0.1;}
.popup-wrap .popup-body {position:relative; max-width:100%; max-height:100%; background-color:var(--bg-white); box-shadow:16px 16px 24px rgba(0,0,0,.16); opacity:0; transform:translate(0,30px); transition:opacity 0.3s ease-in-out, transform 0.3s ease-in-out;}
.popup-wrap.on .popup-body{opacity:1; transform:translate(0,0);}
.popup-header {display:flex; align-items:center; flex-shrink:0; height:80px; padding:0 60px 0 30px; background-color:var(--color-sec);}
.popup-header .popup-tit {color:var(--text-white); font-size:24px; font-weight:var(--font-bold); line-height:1.2; letter-spacing:var(--letter-spacing-tight);}
.popup-header.radius {background-color:var(--color-trd); border-radius:0 0 0 30px;}
.popup-header[class*=icon-]::before {content:''; display:inline-block; width:38px; height:38px; margin-right:16px; background-repeat:no-repeat; background-position:center; background-size:100%; vertical-align:middle;}
.popup-header.icon-noti::before {background-image:url(../img/common/icon_popup_noti.svg);}
.popup-header.icon-doc::before {background-image:url(../img/common/icon_popup_doc.svg);}
.popup-container {overflow:hidden; display:flex; flex-direction:column; height:100%; padding-bottom:40px;}
.popup-content {overflow-y:auto; overflow-x:hidden; position:relative; flex-grow:1; padding:0 30px 1px; overscroll-behavior:contain; outline-offset:-2px;}
.popup-wrap .popup-content{min-height:150px;}
.popup-content::before {content:''; display:block; margin-bottom:40px;}
.popup-submit {position:relative; display:flex; justify-content:center; flex-shrink:0; margin-bottom:-40px; padding:40px 0; background-color:var(--bg-white); z-index:5;}
.popup-submit [class^=btns-] ~ [class^=btns-] {margin-left:10px;}
.popup-close {position:absolute; top:32px; right:30px; width:16px; height:16px; background:url(../img/common/icon_popup_close.svg) no-repeat center; background-size:100%; z-index:10;}
.popup-close span {overflow:hidden; position:absolute; z-index:-1; width:1px; height:1px; font-size:1px; opacity:.01; clip:rect(1px,1px,1px,1px);}

.popup-body.xl {width:1200px;}
.popup-body.lg {width:900px;}
.popup-body.md {width:800px;}
.popup-body.sm {width:538px;}
.popup-body.sm .popup-header {height:72px;}
.popup-body.sm .popup-tit {font-size:22px;}
.popup-body.sm .popup-close {top:28px;}
.popup-body.xs {width:360px; text-align:center;}
.popup-body.xs .popup-header {height:50px; padding:0 50px 0 20px;}
.popup-body.xs .popup-tit {font-size:18px;}
.popup-body.xs .popup-container {padding-bottom:0;}
.popup-body.xs .popup-content {padding:0 32px; min-height:auto;}
.popup-body.xs .popup-content::before {margin-bottom:32px;}
.popup-body.xs .popup-content::after {content:''; display:block; margin-top:32px;}
.popup-body.xs .popup-submit {margin:0; padding:0;}
.popup-body.xs .popup-submit [class^=btns-] {flex:1; height:48px; margin:0; border:0; border-radius:0;}
.popup-body.xs .popup-submit [class^=btns-]:focus-visible {outline-offset:-2px;}
.popup-body.xs .popup-close {top:17px; right:20px;}

/* 콘텐츠 */
/*.popup-body {}*/

/* 새창(윈도우팝업 시) */
.popup-wrap.new-window {position:relative; display:block; visibility:visible; height:auto; padding:0;}
.popup-wrap.new-window .popup-body{display:flex; flex-direction:column; width:auto !important; min-height:100vh; min-height:100dvh; margin:0; opacity:1; box-shadow:none; transition:none; transform:none;}
.popup-wrap.new-window .popup-header {position:sticky; top:0; flex-shrink:0; z-index:10;}
.popup-wrap.new-window .popup-container {overflow:visible; display:flex; flex-direction:column; flex:1 1 auto;  padding-bottom:0;}
.popup-wrap.new-window .popup-content {height:auto !important; max-height:none !important; flex:1 1 auto; overflow:visible; padding-bottom:40px;}
.popup-wrap.new-window .popup-submit {position:sticky; bottom:0; flex-shrink:0; padding:40px 0; margin:0; background:#fff ;z-index:10; }
.popup-wrap.new-window .popup-close {position:fixed;}

.popup-wrap.new-window .tab-menu-sub {margin:0 -10px 30px;}
.popup-wrap.new-window .tab-menu-sub:not(:first-child) {margin-top:30px;}

@media all and (max-width: 767px) {
    .popup-wrap {padding:0;}
    .popup-header {height:54px; padding:0 50px 0 20px;}
    .popup-header .popup-tit {font-size:22px;}
    .popup-header[class*=icon-]::before {width:30px; height:30px; margin-right:10px;}
    .popup-header.icon-doc::before {display:none;}
    .popup-container {padding-bottom:30px;}
    .popup-content {padding:0 20px 1px;}
    .popup-content::before {margin-bottom:30px;}
    .popup-submit {margin-bottom:-30px; padding:30px 0;}
    .popup-close {top:19px; right:20px;}

    .popup-body.xl,
    .popup-body.lg,
    .popup-body.md {height:100%;}
    .popup-wrap:has(.popup-body.sm, .popup-body.xs) {padding:20px 10px;}

    /* 콘텐츠 */
    .popup-body .txt-list {font-size:16px;}
    .popup-body table[class^=table-] {font-size:15px;}

    /* 새창(윈도우팝업 시) */
	.popup-wrap.new-window .popup-header{padding-left:20px;}
	.popup-wrap.new-window .popup-content{padding-left:20px;padding-right:20px;padding-bottom:20px;}
	.popup-wrap.new-window .popup-content::before{margin-bottom:20px;}
}

/* ====================
	NOTICE POPUP
==================== */
.popup-wrap.noti .popup-content .tit {margin-bottom:30px; padding-bottom:30px; border-bottom:1px solid #cccbcb; color:var(--color-trd); font-size:24px; font-weight:var(--font-bold); line-height:1.5; text-align:center;}

.popup-wrap .popup-submit.add-chk {padding:50px 0 0;}
.popup-submit.add-chk .today {display:flex; align-items:center; justify-content:center; width:100%; padding:10px 30px; background-color:var(--bg-light6);} 
.popup-submit.add-chk .today label {color:var(--text-gr700); font-size:17px;}
.popup-submit.add-chk .close {min-height:30px; margin-left:20px; padding:0 14px; background-color:var(--bg-white); border:1px solid #58616a; border-radius:4px; color:var(--text-gr700); font-size:17px;}

@media all and (max-width: 1023px) {
    .popup-wrap.noti .popup-content .tit {font-size:20px;}
    .popup-wrap.noti .popup-content .txt-area,
    .popup-wrap.noti .popup-content .txt-area .txt-list {font-size:16px;}

    .popup-submit.add-chk .today {padding:10px 20px;}
    .popup-submit.add-chk .close {margin-left:16px;}
}


/* ====================
	CHATBOT
==================== */
.is-chatbot {height:100%;}
.is-chatbot body {overflow:hidden; height:100%;}
.is-chatbot .wrapper {height:100%; padding:60px 0 82px;}
.is-chatbot .header {position:fixed; top:0; left:0; display:flex; align-items:center; justify-content:flex-start; width:100%; height:60px; padding:0 60px 0 30px; background-color:var(--color-trd);}
.is-chatbot .footer {position:fixed; bottom:0; left:0; width:100%; height:82px; padding:15px; background-color:#f8f8f8;}

.is-chatbot .header h1 {color:var(--text-white); font-size:24px; font-weight:var(--font-bold); line-height:1.2; letter-spacing:var(--letter-spacing-tight);}
.is-chatbot .header .tel {margin-left:10px; padding:5px 13px; border:2px solid var(--border-white); border-radius:30px; color:var(--text-white); font-size:15px; font-weight:var(--font-bold); line-height:1.2;}
.is-chatbot .header .tel::before {content:''; display:inline-block; width:16px; height:16px; margin-right:4px; background:url(../img/common/icon_chatbot_tel.svg) no-repeat center; background-size:100%; vertical-align:middle;}
.is-chatbot .btn-close {position:absolute; top:50%; right:30px; width:16px; height:16px; background:url(../img/common/icon_popup_close.svg) no-repeat center; background-size:100%; transform:translateY(-50%);}

.chatbot-cont {position:relative; height:100%; overflow-y:auto; background-color:#f8f8f8;}
.chatbot-cont .chat-area {padding:30px 30px 10px;}
.chatbot-cont .chat-msg:not(:first-child) {margin-top:30px;}
.chatbot-cont .chat-msg .chatbot-icon {display:flex; align-items:center;}
.chatbot-cont .chat-msg .chatbot-icon::before {content:''; display:inline-block; width:66px; height:66px; margin-right:10px; background:url(../img/common/icon_chat_chatbot.png) no-repeat center; background-size:100%;}
.chatbot-cont .chat-msg .bubble {display:block; width:fit-content; padding:12px 20px; font-size:16px; text-align:left; line-height:1.4;}
.chatbot-cont .chat-msg .bubble:not(:first-child) {margin-top:8px;}
.chatbot-cont .chat-msg.bot .bubble:not(button) {background-color:var(--bg-light2); border-radius:5px 30px 30px 30px;}
.chatbot-cont .chat-msg.bot button.bubble {background-color:var(--color-sec); border-radius:50px; color:var(--text-white);}
.chatbot-cont .chat-msg.bot .btns-back {margin-top:8px; padding:0 16px; background-color:var(--color-trd); font-weight:var(--font); letter-spacing:normal;}
.chatbot-cont .chat-msg.user .bubble {margin-left:auto; background-color:var(--color-sec); border-radius:30px 30px 5px 30px; color:var(--text-white);}

.is-chatbot .chat-input .ipt {height:52px; padding:0 55px 0 30px; border-color:var(--color-sec); border-radius:50px; font-size:16px; box-shadow:0 1px 4px 0 rgba(0, 0, 0, 0.25);}
.is-chatbot .chat-input .ipt:focus {outline-offset:-2px;}
.is-chatbot .chat-input .btn-send {position:absolute; top:50%; right:15px; width:40px; height:40px; background:#f8f8f8 url(../img/common/icon_chat_btn_send.svg) no-repeat center; background-size:100%; border-radius:50px; transform:translateY(-50%);} 

@media all and (max-width: 479px) {
    .is-chatbot .header {padding:0 50px 0 20px;}
    .is-chatbot .btn-close {right:20px;}
    .chatbot-cont .chat-area {padding:20px 20px 10px;}
}

/* ====================
	TOOLTIP
==================== */
.tooltips-area {display:flex; margin:30px 0;}
.tooltips-area .tooltips {margin-left:auto;}
.tooltips {display:inline-flex; position:relative; top:-2px; max-width:100%; vertical-align:middle;}
.tooltips .btn-tooltip {overflow:hidden; display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border:2px solid var(--text-gr700); border-radius:50%; color:var(--text-gr700); text-align:center; vertical-align:middle;}
.tooltips .btn-tooltip::before {content:'?'; font-size:14px; font-weight:var(--font-bold); line-height:1;}
.tooltip-parent{z-index:15;}
.tooltip-body{display:none; position:fixed; z-index:151; min-width:200px; max-width:400px; margin-top:8px; border:1px solid #ccc; border-radius:6px; background-color:var(--bg-white); color:var(--text-gr900); text-align:left;}
.tooltip-body.clone{display:block; top:1100%; left:0; visibility:hidden; white-space:nowrap;}
.tooltip-body .tooltip-arr {position:absolute; left:0; top:-9px; width:12px; height:9px; margin-left:-6px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='12' height='9' viewBox='0 0 12 9'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='area' width='12' height='9' fill='%23fff' stroke='%23707070' stroke-width='1'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='bg' clip-path='url(%23clip-path)'%3E%3Cg id='bg-2' data-name='bg' transform='translate(-1 -0.002)' fill='%23fff'%3E%3Cpath d='M 13.03966903686523 9.5 L 0.9603310227394104 9.5 L 7 0.8719014525413513 L 13.03966903686523 9.5 Z' stroke='none'/%3E%3Cpath d='M 7 1.743788719177246 L 1.920652389526367 9 L 12.07934761047363 9 L 7 1.743788719177246 M 7 0 L 14 10 L 0 10 L 7 0 Z' stroke='none' fill='%23ccc'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") no-repeat center;}
.tooltip-body .tooltip-content{overflow:auto; min-height:48px; padding:13px 16px; color:var(--text-gr500); font-size:15px; line-height:1.2; font-weight:normal;}
.tooltip-body.w1 .tooltip-content{width:300px;}
.tooltip-body.w2 .tooltip-content{width:350px;}
.tooltip-body:not(.clone) .tooltip-content:before{content:''; display:block; float:right; width:36px; height:22px;}
.tooltip-body.up {margin-top:-8px;}
.tooltip-body.up .tooltip-arr {top:auto; bottom:-9px; transform:rotate(-180deg);}
.tooltip-close {position:absolute; right:16px; top:13px; width:20px; height:20px; background:url(../img/common/icon_tooltip_close.png) no-repeat center;}
.tooltips.on .tooltip-body {display:block;}

.tooltips .tooltip-content .tit {margin-bottom:6px; color:var(--text-gr900); font-weight:var(--font-medium);}
.tooltips .tooltip-content .tit:only-child {margin-bottom:0;}
.tooltips .tooltip-content .tit:not(:first-child) {margin-top:10px;}
.tooltips .tooltip-content > p {word-break:keep-all; word-wrap:break-word; white-space:normal;}
.tooltips .tooltip-content .txt-list {margin-top:6px;}

.tooltips .tooltip-content .area-tbl {margin-top:10px;}
.tooltips .tooltip-content table[class^=table-] {font-size:14px;}
.tooltips .tooltip-content table[class^=table-] th {font-weight:var(--font-medium);}
.tooltips .tooltip-content table[class^=table-] th,
.tooltips .tooltip-content table[class^=table-] td {padding:8px;}

@media all and (max-width: 1023px) {
    .tooltips-area {margin:20px 0;}
}
@media all and (max-width: 479px) {
    .tooltip-body{max-width:calc(100% - var(--spacing-y)*2);}
}

/* ====================
	SWIPER
==================== */
.swiper-container:not(.main-slide) {position:relative;}
.swiper-navigation .swiper-button-prev {left:0;}
.swiper-navigation .swiper-button-next {right:0;}
.swiper-controls {display:inline-flex; min-height:12px;}
.swiper-controls:has(.swiper-navigation) {padding:0 50px;}
.swiper-pagination{position:static; display:flex; align-items:center; justify-content:space-between; gap:0 20px; white-space:nowrap;}
.swiper-pagination .swiper-pagination-bullet {width:12px; height:12px; margin:0 !important;border-radius:50%; background-color:#5b5b5b; opacity:1;}
.swiper-pagination .swiper-pagination-bullet-active{background-color:var(--color-orange);}
.swiper-controls .swiper-navigation button {width:11px; height:17px; margin-top:-9px; background:url(../img/common/icon_slide_ctrl_arrow.svg) no-repeat center; background-size:11px 17px;}
.swiper-controls .swiper-navigation .swiper-button-next {transform:rotate(180deg);}
.swiper-controls .swiper-navigation button::after {content:none;}

/* ====================
	SCROLLBAR
==================== */
*:not(html, body, select)::-webkit-scrollbar {width:20px; opacity:0;}
*:not(html, body, select)::-webkit-scrollbar-thumb {border-radius:10px; background-color:#a5a5a5;background-clip:padding-box;}
*:not(html, body, select)::-webkit-scrollbar-thumb:hover {background-color:#444;}
*:not(html, body, select)::-webkit-scrollbar-track {background-color:transparent;}

.popup-wrap * ::-webkit-scrollbar {width:16px;}

@media all and (max-width: 1023px) {
    *:not(html, body, select)::-webkit-scrollbar {width:10px; opacity:0;}
    .popup-wrap * ::-webkit-scrollbar {width:10px;}
}

/* ====================
	ANIMATION
==================== */
:root {
    --easeInQuad: cubic-bezier(0.550, 0.085, 0.680, 0.530);
    --easeInCubic: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    --easeInQuart: cubic-bezier(0.895, 0.030, 0.685, 0.220);
    --easeInQuint: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    --easeInSine: cubic-bezier(0.470, 0.000, 0.745, 0.715);
    --easeInExpo: cubic-bezier(0.950, 0.050, 0.795, 0.035);
    --easeInCirc: cubic-bezier(0.600, 0.040, 0.980, 0.335);
    --easeInBack: cubic-bezier(0.600, -0.280, 0.735, 0.045);
    --easeOutQuad: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    --easeOutCubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    --easeOutQuart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
    --easeOutQuint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    --easeOutSine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
    --easeOutExpo: cubic-bezier(0.190, 1.000, 0.220, 1.000);
    --easeOutCirc: cubic-bezier(0.075, 0.820, 0.165, 1.000);
    --easeOutBack: cubic-bezier(0.175, 0.885, 0.320, 1.275);
    --easeInOutQuad: cubic-bezier(0.455, 0.030, 0.515, 0.955);
    --easeInOutCubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);
    --easeInOutQuart: cubic-bezier(0.770, 0.000, 0.175, 1.000);
    --easeInOutQuint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    --easeInOutSine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
    --easeInOutExpo: cubic-bezier(1.000, 0.000, 0.000, 1.000);
    --easeInOutCirc: cubic-bezier(0.785, 0.135, 0.150, 0.860);
    --easeInOutBack: cubic-bezier(0.680, -0.550, 0.265, 1.550);
    --easeOutMy: cubic-bezier(.05,.79,0,.96);
    --easeOutSide: cubic-bezier(.15,.84,.45,1);
}