@charset "UTF-8";
/* =================================================
namespace :.ui-redesign
file      :ui-sub.css
================================================= */
/* =================================================
title       :서브 컨텐츠
create date :2026-06

- left menu + content
- 카드(ui-section)
- 첨부파일
- Table
- img-box
- 회원가입/마이페이지

memo :
기존 레이아웃 동일 하고 디자인 변경 건은 기본 class 유지
고도화 관련 신규 class는 ui-xxx 으로 작업
================================================= */


/* =================================================
01. Layout
================================================= */
.main_wrap{
    width:1400px;
    max-width:calc(100% - 35px);
    margin:20px auto 100px;
    position:relative;
}

#contents {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

#contents_body{
    width:100%;
    min-width:320px;
    max-width:1080px;
    margin-bottom:50px;
}

/* 컨텐츠 영역 full인 경우 */
#contents.ui-full{
    grid-template-columns:minmax(0, 1fr);
}

/* full 화면 */
#contents.ui-full #contents_body{
    overflow:visible;
    width:100%;
    max-width:100%;
    margin-bottom:0;
}

/* 컨텐츠 영역 full 이면서 contents_title 없을때 */
#contents.ui-full .contents_util:not(:has(> .contents_title)){
    margin-bottom:50px;
}

/*경로 순서 변경*/
.contents_util {
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    grid-template-rows:auto auto;
    grid-template-areas:
    "path  util"
    "title title";
    align-items:center;
    align-content:start;
    gap:50px 20px;

    height:auto;
    min-height:0;
    margin-bottom:60px;

    position: relative;
}

.contents_util .contents_title {
    grid-area:title;
    margin:0;
    font-size: 30px;
    font-weight: 700;
    color: #000;
    padding-bottom: 20px;
    border-bottom: 1px solid #000;
}

.contents_title > span{
    font-weight:400;
}

.contents_title .s_title{
    font-weight:500;
}

.contents_util .path {
    grid-area:path;
    position:absolute;
    right:0;
    top:10px;
    display:-webkit-box;
    display:-ms-flexbox;
    min-width:0;
    margin:0;
    color:#33363D;
}
.contents_util .path li a {
    font-size:16px;
    color:var(--color-text-primary);
    font-weight:400;
}

.contents_util .path li::after{
    content: "\ea6e";
    font-family: "remixicon";
    color:#333;
}

.contents_util .path li:last-child::after {
    content:"";
}

.contents_util .path li:last-child a{
    font-weight:700;
}

.contents_util .util {
    grid-area:util;
    position:static;
    margin:0;

    display: flex;
    align-items: center;
}

.contents_util .util:before {
    display: inline-block;
    content: '';
    vertical-align: middle;
    width: 1px;
    height: 24px;
    background: #CFCFCF;
}

.contents_util .util .btn {
    border: none;
    border-radius: 50%;
    width: 46px;
    height: 46px;
    line-height: 44px;
    overflow: hidden;
    display: inline-block;
    font-size: 24px;
    color: #33363D;
    padding: 0;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    background: transparent;
}
.contents_util .util .btn i {
    width: 44px;
    height: 44px;
    display: inline-block;
    text-align: center;
}
.contents_util .util .btn:hover,
.contents_util .util .btn:focus {
    border-color: transparent;
    background: transparent;
    color: #0B78CB;
}




/* =================================================
02. Left Menu
================================================= */
#snb{
    -webkit-box-flex:0;
    -ms-flex:0 1 280px;
    flex:0 1 280px;
    width:280px;
    margin-right:0;
    margin-top:96px;
}

#snb .title {
    display:flex;
    align-items:flex-end; /* 제목을 아래 기준으로 정렬 */
    width:100%;
    height:56px;
    margin-bottom:0;
    padding-bottom:12px; /* 기존 디자인에 맞게 조절 */
    box-sizing:border-box;

    color:var(--color-text-primary);
    font-size:26px;
    font-weight:700;
    line-height:1.25;

    white-space:normal;       /* 줄바꿈 허용 */
    overflow-wrap:break-word;
    word-break:keep-all;      /* 한글 단어 단위 줄바꿈 */
}

#snb .s_depth1 > li{
    margin-bottom:0;
}

#snb .s_depth1 > li > a{
    display:block;
    position:relative;
    line-height:20px;
    color:var(--color-text-primary);
    font-weight:500;
    font-size:20px;
    padding:28px 40px 28px 22px;
    background-color:transparent;
    border-bottom:1px solid #D2D2D2;
    border-radius:0;
    transition:all 0.3s;
}

#snb .s_depth1 > li:first-child > a{
    border-top:1px solid #333;
}

#snb .s_depth1 > li:first-child.active > a:hover,
#snb .s_depth1 > li:first-child.active > a{
    border-top:0;
}


#snb .s_depth1 > li._plus > a::after{
    position:absolute;
    top:auto;
    left:auto;
    right:15px;
    content:"\ea78";
    font-family:"remixicon";
    color:#8A8A8A;
    font-size:32px;
}

#snb .s_depth1 > li._plus.active > a::after{
    content:"\ea4e";
    color:#0B78CB;
}

#snb .s_depth1 > li._plus.active:has(> .s_depth2) + li > a{
    border-top:1px solid #d2d2d2;
}

/* 하위메뉴(s_depth2) 없음:> 아이콘 */
#snb .s_depth1 > li.active:not(:has(> .s_depth2)) > a::after{
    position:absolute;
    top:auto;
    left:auto;
    right:15px;
    content:"\ea6e";
    font-family:"remixicon";
    color:#0B78CB;
    font-size:32px;
    font-weight:500;
}
#snb .s_depth1 > li:not(:has(> .s_depth2)) > a::after{
    position:absolute;
    top:auto;
    left:auto;
    right:15px;
    content:"\ea6e";
    font-family:"remixicon";
    color:#8A8A8A;
    font-size:32px;
    font-weight:500;
}

#snb .s_depth1 > li:not(:has(> .s_depth2)) > a{
    border-bottom:1px solid #D2D2D2;
}

#snb .s_depth1 li._plus.active + li._plus{
    border-top:1px solid #D2D2D2;
}

#snb .s_depth1 > li > a:hover,
#snb .s_depth1 > li > a:hover > span {
    color:#0B78CB;
    background:transparent;
}

#snb .s_depth1 > li > a:focus,
#snb .s_depth1 > li > a:focus > span,
#snb .s_depth1 > li.active > a,
#snb .s_depth1 > li.active > a > span {
    font-weight:600;
    color:#0B78CB;
    background:#E6F4FF;
}

#snb .s_depth1 > li.active > a{
    border-bottom:0;
}

#snb .s_depth1 > li > a:hover::before,
#snb .s_depth1 > li > a:focus::before,
#snb .s_depth1 > li.active > a::before{
    display:inline-block;
    content:'';
    width:8px;
    height:100%;
    background:#0B78CB;
    position:absolute;
    top:0;
    left:0;
}

#snb .s_depth1 > li.active > .s_depth2{
    visibility:visible;
    overflow:visible;
    width:auto;
    height:auto;
    opacity:1;
    -webkit-transition:all 0.2s;
    transition:all 0.2s;
    padding:8px 0;
}

#snb .s_depth1 li._plus.active .s_depth2 li._plus {
    border-top: 0;
}

#snb .s_depth2 > li > a{
    display:block;
    padding:10px 35px;
    font-size:var(--text-md);
    color:var(--color-text-primary);
}

#snb .s_depth2 > li.active > a{
    font-weight:700;
    color:#222;
    text-decoration:underline;
    background:#fff;
}

#snb .s_depth2 > li > a::before{
    display:none;
}

#snb .s_depth2 > li > a:hover,
#snb .s_depth2 > li > a:focus,
#snb .s_depth2 > li.active > a{
    color:#0B78CB;
    text-decoration:none;
}

#snb .s_depth3 > li > a{
    padding:6px 15px 6px 40px;
}

#snb .s_depth3 > li > a::before{
    left:30px;
}


/*
* 교육 용 snb
*********************** */

#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root {
    padding-left: 20px;
    min-width: 0;
    margin: 0;
    color: #33363D;
}

/* depth2 */
#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > a {
    display: block;
    padding: 15px 0 5px;
    font-size: 18px;
    color: #33363D;
}

#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > a:hover,
#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > a.active {
    color: #0B78CB;
    font-weight: 700;
}

/* depth3 */
#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > .category {
    padding: 5px 0 10px 15px;
}

#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > .category > li > a {
    position: relative;
    display: block;
    padding: 6px 15px 6px 5px;
    font-size: 16px;
    color: #707070;
}

#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > .category > li > a.active {
    color: #0B78CB;
    font-weight: 700;
}

#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > .category > li > a:hover {
    color: #222;
    text-decoration: underline;
}

#snb .snb-wrap2 .snb-nav2 .s_depth1 .category.root > li > .category > li > a:before {
    content: "";
    width: 4px;
    height: 1px;
    background: #707070;
    position: absolute;
    left: -10px;
    top: 14px;
}


/* =================================================
03. Title
================================================= */

/* 타일틀 앞에 bar 있는 스타일 */
.h3_tit2{
    font-size:26px;
    line-height:28px;
    font-weight:700;
    margin-bottom:20px;
    color:#0B78CB;
}

.h3_tit2::before{
    display:inline-block;
    vertical-align:middle;
    margin-right:20px;
    content:'';
    width:5px;
    height:32px;
    border-radius:50px;
    background-color:#0B78CB;
}

.h4_tit2{
    font-size:24px;
    line-height:1;
    font-weight:700;
    margin-bottom:27px;
    color:var(--color-text-primary);
}


/* =================================================
04. contents
================================================= */
.ui-section{
    margin-bottom:40px;
}

.ui-section-title{
    font-size:24px;
    font-weight:600;
    margin:0 0 20px;
}

.ui-section-title--bar{
    margin:0 0 20px;
    font-size: 26px;
    font-weight:700;
    display:flex;
    align-items:center;
    color: #0B78CB;
}
.ui-section-title--bar:before{
    display: inline-block;
    vertical-align: middle;
    margin-right: 20px;
    content: '';
    width: 5px;
    height: 32px;
    border-radius: 50px;
    background-color: #0B78CB;
}


.ui-section-title .ui-section-title-sub{
    padding-left:32px;
}

.ui-section-title-sub{
    font-size:22px;
    font-weight:500;
}

.ui-section .ui-img-box{
    margin-top:20px;
}

.ui-info-list + .ui-img-box{
    margin-top:40px;
}

/* 목록 간격 */
.ui-info-list--gap-50 { gap:50px; }

.ui-info-list{
    display: flex;
    flex-direction: column;
    margin:0;
    padding:0;
    list-style:none;
    padding-inline-start:14px;
    font-size:22px;
    line-height:1;
}

.ui-info-list li{
    line-height: 1.3;
    color: #333;
    text-indent: -18px;
    padding: 10px 0 10px 0px;
}

.ui-info-list > li::before{
    display: inline-block;
    vertical-align: middle;
    margin-top:-1px;
    content:"";
    width:5px;
    height:5px;
    margin-right:14px;
    border-radius:50%;
    background:#333;
}

.ui-info-list .ui-info-list-title {
    font-size:22px;
    font-weight: 600;
}

.ui-info-list .ui-info-list-text {
    font-size: 22px;
    font-weight: 400;
    text-indent: 0;
    padding-left: 8px;
}

.ui-info-list strong{
    font-weight:700;
}

.ui-info-title {
    display: inline;
    color: #303640;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
}

.ui-info-description {
    margin: 4px 0 0 0;
    text-indent: 0;
    color: #737b88;
    font-size: 20px;
    line-height: 1.7;
    word-break: keep-all;
}

.ui-info-detail-list {
    margin: 4px 0 0 23px;
    padding: 0;
    list-style: none;
}

.ui-info-detail-list > li {
    position: relative;
    margin: 0;
    padding: 0 0 0 16px;
    color: #737b88;
    font-size: 20px;
    line-height: 1.7;
    word-break: keep-all;
}

.ui-info-detail-list > li + li {
    margin-top: 2px;
}

.ui-info-detail-list > li::before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    border-radius: 0;
    background: none;
    color: #737b88;
    content: "-";
}


.ui-line-dot {
    height:1px;
    border:0;
    border-top:1px dotted #DBDFE4;
}

.ui-service-list{
    display:grid;
    /*grid-template-columns:repeat(2, minmax(0, 1fr));*/
    /*grid-template-columns:minmax(340px, 1fr) minmax(340px, 1fr);*/
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:20px;
    margin:0;
    padding:0;
    list-style:none;
}

.ui-service-card{
    display:flex;
    align-items:center;
    gap:20px 16px;

    min-width:340px;
    height:140px;
    padding:24px 30px;

    background:#fff;
    border:1.5px solid #C8CEDA;
    border-radius:14px;
    color:#2b2f36;
    position:relative;

    text-decoration:none;
    box-shadow:none;
    transition:box-shadow .25s ease, border-color .25s ease, transform .25s ease;
}

.ui-service-card .ui-service-card-left .ui-icon {
    position:static;
}

.ui-service-card .ui-icon{
    position:absolute;
    bottom:0;
    right:0;
    margin-right:32px;
    margin-bottom:26px;
    height:16px;
}
.ui-service-card .ui-icon-neq {
    top:0;
}
.ui-service-card .ui-icon-arrow-long{
    position:relative;
    display:inline-block;
    width:34px;
    height:34px;
    line-height:34px;
    font-size:34px;
}

.ui-service-card .ui-icon-arrow-long::before,
.ui-service-card .ui-icon-arrow-long::after{
    content:"\f5db"; /* 화살표 아이콘 코드로 변경 */
    font-family:"remixicon";
    position:absolute;
    left:0;
    top:0;
    width:34px;
    height:34px;
    line-height:34px;
}

.ui-service-card .ui-icon-arrow-long::before{
    color:#b8bec8;
}

.ui-service-card .ui-icon-arrow-long::after{
    color:#0784d8;
    width:0;
    overflow:hidden;
    white-space:nowrap;
    transition:width .35s ease;
}

.ui-service-card:hover .ui-icon-arrow-long::after,
.ui-service-card:focus-visible .ui-icon-arrow-long::after{
    width:34px;
}

.ui-service-card:hover,
.ui-service-card:focus-visible,
.ui-service-card.is-active{
    border-color:#0784d8 !important;
    box-shadow:0 4px 10px rgba(0, 0, 0, 0.12);
}

.ui-service-card:hover .ui-service-title,
.ui-service-card:hover .ui-service-name,
.ui-service-card.is-active .ui-service-title,
.ui-service-card.is-active .ui-service-name{
    color:#0784d8;
}

.ui-service-card:hover .ui-service-desc,
.ui-service-card.is-active .ui-service-desc{
    color:var(--color-text-primary);
}

.ui-service-card:hover::after,
.ui-service-card:focus-visible::after,
.ui-service-card.is-active::after{
    color:#0784d8;
    transform:translateX(8px);
}
.ui-service-card.is-active .ui-icon-arrow-long::before,
.ui-service-card.is-active .ui-icon-arrow-long::after{
    color:#0784d8;
}

.ui-service-icon{
    flex:0 0 75px;
    width:75px;
    height:75px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #d8e0e8;
    border-radius:50%;
}

.ui-service-icon img{
    display:block;
    width:42px;
    height:42px;
    object-fit:contain;
}

.ui-service-icon img.is-small {
    width:36px;
    height:36px;
}


.ui-service-content{
    min-width:0;
}

.ui-service-title,
.ui-service-name,
.ui-service-desc{
    display:block;
    line-height:1;
}

.ui-service-title{
    font-size:20px;
    font-weight:700;
}

.ui-service-name{
    margin-top:8px;
    font-size:20px;
    font-weight:700;
}

.ui-service-desc{
    margin-top:12px;
    font-size:13px;
    color:#8A8E94;
}


.ui-law-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ui-law-list > li {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 64px;
    padding: 15px 24px;
    border: 1px solid #cbd3df;
    border-radius: 6px;
    box-sizing: border-box;
    color: #33363d;
}

.ui-law-list-number {
    flex: 0 0 auto;
    margin-right: 9px;
    font-size: 20px;
    font-weight: 300;
    line-height: 1;
    color: #33363d;
}

.ui-law-list-text {
    min-width: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    word-break: keep-all;
}


/*  search
    ui-search-form vs ui-search-form2 여백 차이
************************************************* */
.ui-search-form{
    padding:6px 40px 40px;
    margin-bottom:60px;
    background:#f5f6f8;
}

.ui-search-reset{
    font-size:16px;
    margin-bottom:10px;
    text-decoration:underline;
}

/* 공통 행 */
.ui-search-form-row {
    display: grid;
    grid-template-columns: minmax(110px, max-content) minmax(0, 1fr);
    align-items: center;
    gap: 20px;
}

.ui-search-form-label-lg{
    grid-template-columns:minmax(180px,max-content) minmax(0,1fr);
}

.ui-search-form-row + .ui-search-form-row{
    margin-top:10px;
}

/* 왼쪽 라벨 */
.ui-search-form-label{
    font-size:20px;
    font-weight:600;
    white-space:nowrap;
}

/* 오른쪽 입력 영역 */
.ui-search-form-field {
    display: flex;
    align-items: center;
    gap: 10px 20px;
    min-width: 0;
}

.ui-search-form-field input,
.ui-search-form-field select {
    min-width: 0;
    height: 60px;
    padding: 0 16px;
    color: #333;
    border: 1px solid #bbc4d0;
    border-radius: 4px;
    background-color: #fff;
    font-size: 18px;
    box-sizing: border-box;
}

.ui-search-form-field input {
    flex: 1 1 auto;
}

/* 검색조건 2개
   control | label | control */
.ui-search-form-field:has(> .ui-search-form-label) {
    display: grid;
    grid-template-columns:
    minmax(0, 1fr)
    minmax(110px, max-content)
    minmax(0, 1fr);
    align-items: center;
    gap: 10px 20px;
}

/* 검색조건 3개
   control | label | control | label | control */
.ui-search-form-field:has(> .ui-search-form-label ~ .ui-search-form-label) {
    grid-template-columns:
    minmax(0, 1fr)
    minmax(110px, max-content)
    minmax(0, 1fr)
    minmax(110px, max-content)
    minmax(0, 1fr);
}

/* 검색조건 2개 + 버튼: 반드시 뒤에 작성 */
.ui-search-form-field:has(> .ui-search-form-label):has(> button:last-child) {
    grid-template-columns:
    minmax(0, 1fr)
    minmax(110px, max-content)
    minmax(0, 1.5fr)
    120px;
}

.ui-search-form-field:has(> .ui-search-form-label) > button:last-child {
    width: 120px;
    min-width: 120px;
    height: 60px;
    margin: 0;
}

.ui-search-form-field:has(> .ui-search-form-label):has(> a.ui-btn:last-child) {
    grid-template-columns:
    minmax(0, 1fr)
    minmax(110px, max-content)
    minmax(0, 1.5fr)
    120px;
}

.ui-search-form-field:has(> .ui-search-form-label):has(> .ui-btn-group:last-child) {
    grid-template-columns:
    minmax(0, 1fr)
    minmax(110px, max-content)
    minmax(0, 1.5fr)
    120px;
}

.ui-search-form-field > .ui-btn-group:last-child {
    width: 120px;
    margin: 0;
}

.ui-search-form-field > .ui-btn-group:last-child .ui-btn {
    width: 100%;
    height: 60px;
}

.ui-search-form-field > a.ui-btn:last-child {
    width: 120px;
    min-width: 120px;
    height: 60px;
}


/* 복합 검색조건 내부 label */
.ui-search-form-field > .ui-search-form-label {
    min-width: 0;
    white-space: nowrap;
    text-align: center;
}

/* 복합 검색조건 내부 input, select */
.ui-search-form-field:has(> .ui-search-form-label) > input,
.ui-search-form-field:has(> .ui-search-form-label) > select {
    width: 100%;
    max-width: none;
}

.ui-search-form-field select{
    flex:1 1 0;
    padding-right:40px;
    background-image:url("../images/icon/icon_select_arrow.png");
    background-repeat:no-repeat;
    background-position:right 15px center;
}

.ui-search-form .ui-btn-group {
    margin-top: 10px;
}

.ui-search-form .ui-btn,
.ui-search-form .ui-search-submit{
    flex:0 0 120px;
    height:60px;
}

/* 과정검색:select 3개 */
.ui-search-form-field--course select{
    flex:1 1 0;
}

.ui-search-form-field:has(> select:only-of-type) > select{
    max-width:240px;
}

/* 전문교수:select + label + select + button */
/* select 넓이 다름 */
.ui-search-form-field--professor{
    display:grid;
    grid-template-columns:minmax(130px, 1fr) auto minmax(180px, 1.5fr) 120px;
    align-items:center;
    gap:10px 30px;
}

.ui-search-form-field--professor select,
.ui-search-form-field--professor .ui-search-submit{
    width:100%;
}

.ui-search-nodata{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:47px;
    padding:130px 0;
}

.ui-search-nodata .icon{
    font-size:100px;
    color:#D1D6DE;
}

.ui-search-nodata .ui-search-nodata-text{
    font-size:24px;
    color:#B0B9C7;
}

/* count */
.ui-search-count{
    font-size:24px;
    color:var(--color-text-primary);
    font-weight:600;
}
.ui-search-count > span{
    font-weight:400;
}

.ui-search-infobox{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:20px 0 24px;
}

.ui-search-info{
    font-size:24px;
    color:var(--color-text-primary);
    font-weight:600;
}

.ui-search-actions{
    display:flex;
    align-items:center;
    gap:8px;
    margin-left:auto;
}

/* 검색 영역 */
.ui-form-row{
    display:flex;
    align-items:center;
    gap:20px;
}

.ui-form-dash {
    flex:0 0 auto;
    color:#666;
    text-align:center;
}

/* 검색 입력 */
.ui-search-input{
    position:relative;
    flex:1;
    max-width:560px;
}

.ui-search-input input{
    width:100%;
    height:48px;
    padding:0 56px 0 16px;
    border-radius:4px;
    border:1px solid #BBC4D0;
}

/* 검색 버튼 */
.ui-search-btn{
    position:absolute;
    top:50%;
    right:16px;
    width:24px;
    height:24px;
    padding:0;
    border:0;
    background:transparent;
    cursor:pointer;
    transform:translateY(-50%);
}

/* 카드 list */
.ui-org-list{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:40px 40px;
    margin:0;
    padding:0;
    list-style:none;
}

.ui-org-card{
    height:100%;
    min-height:250px;
    padding:28px;
    border:1px solid #d8dde5;
    border-radius:8px;
    background:#fff;
    box-sizing:border-box;
}


/* Select(Autocomplete) */
.ui-select-search{
    position:relative;
    flex:1;
    max-width:500px;
    border:1px solid #c5cfdd;
}

.ui-select-search-field{
    position:relative;
}

.ui-select-search-field input{
    width:100%;
    height:42px;
    font-size:20px;
    padding:0 44px 0 16px;
    border:0;
    border-radius:2px;
    box-sizing:border-box;
}

.ui-select-search-btn{
    position:absolute;
    top:50%;
    right:12px;
    width:20px;
    font-size:20px;
    border:0;
    background:transparent;
    transform:translateY(-50%);
}

.ui-select-search-btn .ri-search-line:before{
    font-size:18px;
}

.ui-select-search-layer{
    display:none;
    position:absolute;
    top:calc(100% - 1px);
    left:-1px;
    right:-1px;
    z-index:100;
    background:#fff;
    border:1px solid #d8d8d8;
    max-height:240px;
    overflow-y:auto;
}

.js-select-search.is-open .ui-select-search-layer{
    display:block;
}

.ui-select-search-list{
    margin:0 14px;
    padding:20px 0;
    list-style:none;
}

.ui-select-search-list button{
    width:100%;
    height:30px;
    padding:0 16px;
    border:0;
    background:transparent;
    text-align:left;
    font-size:16px;
    cursor:pointer;
}

.ui-select-search-list button:hover,
.ui-select-search-list button:focus{
    background:#f3f7fb;
}

.ui-select-search-list button.is-selected{
    color:#0066cc;
    font-weight:700;
}

/* 스크롤바 */
.ui-select-search-layer::-webkit-scrollbar{
    width:6px;
}

.ui-select-search-layer::-webkit-scrollbar-track{
    background:#E6EAF0;
    border-radius:10px;
}

.ui-select-search-layer::-webkit-scrollbar-thumb{
    border:4px solid #AABACE;
    border-radius:10px;
    background:#AABACE;
}

.ui-check{
    display:inline-flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;
}

.ui-check input[type="checkbox"]{
    width:18px;
    height:18px;
}

/* ==========================================
  첨부파일
========================================== */
/* 기본 첨부파일 */
.ui-file-attach{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    border:1px solid #BBC4D0;
    border-radius:4px;
}

.ui-file-attach-text{
    color:#000;
    font-weight:600;
    font-size:15px;
    padding-right:20px;
    margin-right:20px;
    line-height:42px;
    border-right:1px solid #ddd;
}

.ui-file-attach-text-download{
    text-decoration:none;
}

.ui-file-attach-text-download:hover i,
.ui-file-attach-text-download:focus i{
    background:#000;
    color:#fff;
    border-color:#000;
}

.ui-file-attach-text i{
    width:30px;
    height:30px;
    line-height:28px;
    font-weight:300;
    border-radius:50%;
    background-color:#F2F2F2;
    border:1px solid #ddd;
    display:inline-block;
    text-align:center;
    margin-left:8px;
}

.ui-file-attach-input{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    border:0;
    flex:1 1 auto;
}

.ui-file-attach-name{
    display:inline-block;
    font-size:16px;
    line-height:1.8;

    flex:1;
    min-width:0;
    max-width:100%;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
}

.js-upload-sample{
    display:inline;
}

.js-upload-sample.is-hide{
    display:none;
}

.ui-file-delete-btn{
    flex:0 0 auto;
    width:20px;
    height:20px;
    border-radius:100%;
    background:#CDD1D5;
    display:none;
    align-items:center;
    justify-content:center;
    color:#33363D;
}

.ui-file-delete-btn:before{
    display:block;
    font-family:'remixicon';
}

.ui-file-delete-btn.is-show{
    display:flex;
}

.ui-upload-wrap{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;
    margin:0 20px 0;
}


.ui-download-wrap{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;
}

.ui-file-attach-button{
    position:relative;
    flex:0 0 auto;
    margin:10px;
    padding:0 31px;

    height:60px;
    font-size:20px;
}


/* 간략 첨부파일 :버튼 + 텍스트 */
.ui-file-simple .ui-file-attach{
    border:0;
    justify-content:flex-start;
}

.ui-file-simple .ui-file-text {
    color:#000;
    font-weight:600;
    font-size:15px;
    padding-right:20px;
    margin-right:20px;
    line-height:42px;
    border-right:1px solid #ddd;
}

.ui-file-simple .ui-file-attach-button{
    height:40px;
    width:auto;
    margin:0;
}
.ui-download-wrap .ui-file-attach-button {
    height:42px;
    width:96px;
    margin:0;
}

.ui-file-simple .ui-upload-wrap{
    margin:0;
}

/* ==========================================
  테이블
========================================== */
/* 접근성 */
.ui-table-wrapper:focus{
    outline:2px solid #000;
}

/* table Wrapper (독립 블록) */
.ui-table-wrapper {
    width:100%;
}

.ui-table-wrapper-scroll {
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    position:relative;
}

/* 공통:열이 적은 상세 테이블 */
.ui-table-wrapper-scroll .ui-table {
    width:100%;
    min-width:640px;
}

/* col이 6개 이상인 목록형 테이블 */
.ui-table-wrapper-scroll .ui-table:has(col:nth-child(4)) {
    min-width:1080px;
}

/* 스크롤바 */
.ui-table-wrapper-scroll::-webkit-scrollbar{
    /*display:none;*/
}

/* Table */
.ui-table{
    width:100%;
    border-collapse:collapse;
    table-layout:fixed;
    border-top:2px solid #aabace;
}

.ui-table tr:hover {
    background: #E8F1FB;
}

.ui-table th,
.ui-table td{
    text-align: left;
    min-height:46px;
    padding:9px 10px;
    font-size:16px;
    line-height:1.7;

    vertical-align:middle;
    position:relative;
    border-bottom:1px solid #D7DEE7;
    border-left:1px solid #D7DEE7;
}

.ui-table th{
    background:#F4FAFF;
    font-weight:700;
    letter-spacing:-0.5px;

    word-break:keep-all;
}

/* 본문은 셀 밖으로 넘치지 않도록 처리 */
.ui-table td {
    white-space:normal;
    word-break:keep-all;
    overflow-wrap:break-word;
}

.ui-table th:first-child,
.ui-table td:first-child{
    border-left:0;
}

.ui-table thead th{
    border-top:1px solid #AABACE;
    border-bottom:1px solid #D7DEE7;
}

.ui-table.border-0,
.ui-table.border-0 tr,
.ui-table.border-0 th,
.ui-table.border-0 td {border:0}

.ui-table--multi-head thead tr:not(:first-child) > th:first-child {
    border-left:1px solid #d7dee7;
}

.ui-table--multi-head tbody tr:not(:first-child) > td:first-child {
    border-left:1px solid #d7dee7;
}

.ui-border-left {border-left:1px solid #d7dee7 !important;}

.ui-border-right {border-right:1px solid #d7dee7 !important;}

/* Responsive (필요 시) */
.ui-table-responsive th,
.ui-table-responsive td{
    white-space:normal !important;
    word-break:break-word;
    overflow-wrap:anywhere;
}

.required{
    color:#F22020;
    display:inline-block;
    vertical-align:top;
    margin-top:-5px;
}

.ui-th-gray th{
    background:#F5F6F9;
}

/* 상세 테이블  */
.ui-table-info{}
.ui-table-info tbody th,
.ui-table-info tbody td{
    min-height:60px;
    padding:16px 10px 16px 20px;
    vertical-align:middle;
}

.ui-table-info tr:hover {
    background: transparent;
}

.ui-table-info tr{
    border-bottom:1px solid #D7DEE7;
}

.ui-table-info th{
    background-color:#F4FAFF;
}

.ui-table-info td{
    padding-left:30px;
}


/* 내용이 긴 셀 */
.ui-table-info td.ui-cell-description{
    padding-top:30px;
    padding-bottom:30px;
    vertical-align:top;
}

/* 상세 테이블 -- 입력폼 */
.ui-table-info--form th,
.ui-table-info--form td{
    padding:9px 10px;
}

.ui-table-info--form .ui-form-group{
    margin-left:22px;
}

.ui-table-info--form .ui-form-group:has(> .ui-form-field.ui-checkbox) {
    margin-left: 0;
}

/* 투명 테이블 */
.ui-table-invisible,
.ui-table-invisible thead th,
.ui-table-invisible th,
.ui-table-invisible td,
.ui-table-invisible tr{
    border:0;
    background:none;
    padding-top:20px;
    padding-bottom:20px;
}

.ui-table-invisible{
    margin-top:30px;
}

.ui-table-invisible tr:hover {
    background: transparent;
}

/* th 텍스트 정렬 */
.th-text-left th{
    text-align:left;
}

.th-text-center th{
    text-align:center;
}

.td-text-left td {
    text-align:left;
    padding:17px 30px !important;
}

.td-text-right td {
    text-align: right;
    padding:17px 30px !important;
}

.ui-table.text-center th,
.ui-table.text-center td,
.ui-table.ui-txt-center th,
.ui-table.ui-txt-center td{
    text-align:center;
}

/* 테이블 안에 내용 + 버튼 */
.ui-location{
    display:flex;
    align-items:center;
    width:100%;
    gap:12px;
}

.ui-location .ui-btn{
    margin-left:auto;
}

.ui-location .ui-btn-secondary{
    color:#878EA0;
}

.ui-td-notice-text{
    min-height:200px;
}

.ui-table td a._filedownload,
.ui-table td a[data-fileurl]{
    text-decoration: underline;
}

/* ==========================================
  User
========================================== */
/* 로그인 */
.ui-login-page{
    display:flex;
    justify-content:center;
    flex-direction:column;
    align-items:center;
}

.ui-login-page .ui-login-title{
    font-size:40px;
    font-weight:700;
    margin-bottom:90px;
}

.ui-login-page .ui-login{
    border:0;
    padding:0;
    display:flex;
    flex-direction:column;
    align-items:center;
}

.ui-login-page .ui-login hr{
    width:100%;
    height:1px;
    background:#DBDFE4;
    margin:70px 0;
}

.ui-login-page .ui-login-form{
    width:706px;
    margin:0 auto;
    padding:0 78px;
}

.ui-login-page .ui-login-form .ui-login-pw{
    margin-top:20px;
}

.ui-login-page .ui-login-form input{
    height:60px;
    padding:0 30px;
    border:1px solid #D2DBE4;
}

.ui-login-page .ui-login-form .ui-login-password{
    margin-top:35px;
    margin-right: 30px;
}

.ui-login-page .ui-login-form .ui-error-msg{
    margin-top:10px;
}

.ui-login-page .ui-login-form .ui-login-btn{
    margin-top:40px;
}

.ui-login-page .ui-login-form .ui-login-links{
    width:327px;
    margin:40px auto 0;
}

.ui-login-page .ui-login-etc .ui-login-links{
    width:420px;
    margin:20px auto 0;
    font-weight:600;
}
.ui-login-page .ui-login-etc .ui-login-links a{
    color:#8A8E94;
    font-weight:400;
}
.ui-login-page .ui-login-etc .ui-login-links a:hover{
    color:var(--color-text-primary);
    text-decoration:underline;
}
.ui-login-page .ui-login-etc{
    font-size:20px;
}


/* 탭 */
.ui-login-method{
    width:100%;
    margin:0 auto;
    background-color:#fff;

}
.ui-login-method .ui-login-tabs{
    width:100%;
}

.ui-login-tabs .ui-tabs-list{
    gap:0;
}

.ui-login-tabs .ui-tabs-tab{
    border-radius:0;
    color:#0066B3;
    border:1px solid #0066B3;
    border-left:0;
    background:#fff;
}

.ui-login-tabs .ui-tabs-tab:first-child {
    border-left:1px solid #0066B3;
}

.ui-login-tabs .ui-tabs-tab.is-active{
    color:#fff;
    background:#0066B3;
}

.ui-login-tabs .ui-tabs-panel{
    padding-top:80px;
}

.ui-login-tabs .ui-login-panel-title {
    margin:0 0 60px;
    font-size:var(--text-lg);
    font-weight:700;
    text-align:center;
}

.ui-login-tabs .ui-tabs-panel .ui-table-wrapper {
    width:840px;
    margin:0 auto;
}

/* 로그인 방식 목록 */
.ui-login-page .ui-login-method-list{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:20px;
    margin:0;
    padding:0;
    list-style:none;
}
.ui-login-page .ui-login-method-list > li {
    flex:0 1 calc((100% - 40px) / 3);
}

.ui-login-page .ui-login-method-item{
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    position:relative;
    padding:0;
    background-color:#f8f8f8;
    border:1px solid #e4e4e4;
    border-radius:8px;
}

.ui-login-page .ui-login-method-link {
    position:relative;
    display:flex;
    flex-direction:column;
    gap:20px;
    padding:30px 50px;
    width:100%;
    height:100%;
    background:#F6F7F8;
}

.ui-login-page .ui-login-method-link:hover{
    background:#ECEFF2;
}

.ui-login-page .ui-login-method-desc{
    font-size:24px;
    line-height:1.5;
}

.ui-login-method-title .ui-icon-text{
    padding:0 20px 0 10px;
    font-size:24px;
    font-weight:700;
}

.ui-login-signup{
    margin-top:60px;
    font-size:20px;
    font-weight:600;
}

.ui-login-signup > a{
    color:#8A8E94;
    font-weight:400;
    padding-left:20px;
}

.ui-login-signup > a:hover{
    color:var(--color-text-primary);
    text-decoration:underline;
}

/* 로그인 */
.ui-login{
    background:#fff;
    border:1px solid #d8e0e8;
    border-radius:20px;
    padding:20px;
}

.ui-login-title{
    margin:0 0 24px;
    font-size:32px;
    font-weight:700;
}

.ui-login .ui-btn{
    border-radius:10px;
}

.ui-login-form .ui-login-pw{
    margin-top:24px;
}

.ui-login-form input{
    width:100%;
    height:44px;
    border:0;
    border-bottom:1px solid #BBC4D0;
    font-size:20px;
}

.ui-login-form input::placeholder{
    color:#8E939D;
}

.ui-login-form .ui-login-btn{
    width:100%;
    height:68px;
    margin-top:24px;
    border-radius:10px;
}

.ui-login-form .ui-form-item{
    position:relative;
}

.ui-form-item input{
    width:100%;
    padding-right:42px;
}

.ui-login-password{
    position:absolute;
    right: 0;
    top: 0;
    margin-top: 30px;

    width:32px;
    height:32px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:0;
    background:none;
}

.ui-login-password.is-active .ui-icon--eye{
    background-image:url('../images/icon/icon_pw_view.png');
}

.ui-login-links{
    display:flex;
    justify-content:space-around;
    margin-top:30px;
}

.ui-login-links a{
    color:#222;
    font-size:18px;
    letter-spacing:-0.5px;
    text-decoration:none;
    display:flex;
    align-items:center;
}

.ui-login-links a:first-child:before{
    display:none;
}

.ui-login-links a:before{
    display:block;
    content:'';
    width:1px;
    height:16px;
    background-color:#E0E4EC;
    margin:0 22px;
}

.ui-login-cert{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(0, 1fr));
    gap:10px;
    margin-top:30px;
}

.ui-login-cert .ui-btn{
    height:56px;
}

.ui-login-guide{
    display:flex;
    align-items:center;
    justify-content:center;
    height:56px;
    margin-top:12px;
}
.ui-login-guide:hover,
.ui-login-cert .ui-btn:hover{
    border-color:#0B78CB;
    color:#0B78CB;
}

/* 로그인 후 */
.ui-login--after{
    text-align:center;
    padding:52px 20px 20px;
}

.ui-login--after .ui-login-user{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.ui-login--after .ui-login-user-icon{
    width:64px;
    height:64px;
    border-radius:50%;
    background:#d9dde5;
    position:relative;
}

.ui-login--after .ui-login-user-icon::before{
    content:"";
    position:absolute;
    left:50%;
    top:18px;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#fff;
    transform:translateX(-50%);
}

.ui-login--after .ui-login-user-icon::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:13px;
    width:34px;
    height:18px;
    border-radius:18px 18px 6px 6px;
    background:#fff;
    transform:translateX(-50%);
}

.ui-login--after .ui-login-user-text{
    margin:32px 0 30px;
    color:#222;
    font-size:28px;
    line-height:1.5;
}

.ui-login--after .ui-login-user-text strong{
    font-weight:700;
}

.ui-login--after .ui-login-logout{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:3px;
    min-height:28px;
    padding:0;
    border:0;
    background:transparent;
    color:#8A94A2;
    font-size:20px;
}

.ui-login--after .ui-login-logout .icon{
    color:#8A94A2;
    margin-right:3px;
}

/* 로그아웃일 아이콘 */
.ui-login--after .ui-icon--logout::before,
.ui-login--after .ui-icon--logout::after{
    background-image:url('../images/icon/icon_logout.svg');
    margin-top:-2px;
    margin-right:6px;
}

.ui-login--after .ui-login-after-menu{
    display:flex;
    flex-direction:column;
    gap:16px;
    margin-top:30px;
}

.ui-login--after .ui-login-after-menu .ui-btn{
    height:68px;
}

.ui-login--after .ui-login-after-menu .ui-btn.active,
.ui-login--after .ui-login-after-menu .ui-btn:hover{
    background-color:var(--color-primary);
    border:1px solid #0B78CB;
    color:#fff;
}
.ui-login--after .ui-login-guide{
    text-decoration:underline;
}

/* 회원가입 구분 */
.ui-signup-page .ui-signup-type{
    width:100%;
}

/* 회원가입 구분 - 가입 유형별 영역 */
.ui-signup-page .ui-signup-type-section{
    width:100%;
}

.ui-signup-page .ui-signup-type-section + .ui-signup-type-section{
    margin-top:42px;
    padding-top:36px;
    border-top:1px dotted #e5e8ec;
}

.ui-signup-page .ui-signup-type-section .ui-section-title--bar {
    color: #33363d;
}

.ui-signup-page .ui-signup-type-section .ui-btn-group .ui-btn{
    width:453px;
    margin-top:40px;
}

.ui-signup-page .ui-signup-type-section--organization .ui-section-title--bar:before{
    background:#ADBF4B;
}

.ui-signup-page .ui-signup-type-section--organization .ui-btn-group .ui-btn{
    background:#ADBF4B;
    border-color:#ADBF4B;
    color:#fff;
}

/* 회원가입 구분 - 가입 가능 서비스 목록 */
.ui-signup-page .ui-signup-service-list{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px 18px;
    margin:0;
    padding:0;
    list-style:none;
}

.ui-signup-page .ui-signup-service-item{
    display:flex;
    align-items:center;
    min-width:0;
    min-height:112px;
    padding:18px 20px;
    border:1px solid #b9c7d8;
    border-radius:10px;
    background-color:#fff;
}

/* 약관동의 */
.ui-terms-section{
    border:1px solid #DBDFE4;
    border-radius:10px;
    padding:52px 70px;
    margin-bottom:20px;
}

.ui-terms-section .check-field-input{
    width:18px;
    height:18px;
    margin-right:23px;
}

.ui-terms-all{
    padding-bottom:40px;
    margin-bottom:40px;
    font-size:20px;
    font-weight:700;
    border-bottom:1px solid #DBDFE4;
}

.ui-terms-all .ui-checkbox .check-field-label {
    color:#33363D
}

.ui-terms-all .ui-checkbox .check-field-label:before {
    top:0;
}

.ui-terms-list .ui-terms-item{
    padding:15px 0;
    font-size:20px;
    font-weight:500;
    display:flex;
    align-items:center;
}

.ui-terms-item .ui-checkbox label {
    font-size:20px;
    color:#33363D;
}

.ui-terms-desc{
    font-size:18px;
    font-weight:500;
    line-height:1.3;
}

.ui-terms-desc > span{
    display:block;
    padding-top:10px;
    font-weight:400;
    color:#8A8E94;
}

/* 본인인증 */
.ui-certify-title {
    font-size:40px;
    text-align:center;
    margin-top:-70px;
    margin-bottom:56px;
}
.ui-certify-list{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:20px;
}

.ui-certify-list li{
    background:#F6F7F8;
    border-radius:8px;
    padding:50px;
}

.ui-certify-list li .ui-thumb-box{
    display:grid;
    justify-items:center;
    text-align:center;
}

.ui-certify-list li .ui-thumb-box .ui-thumb-title {
    font-size:30px;
    margin-bottom:44px;
}
.ui-certify-list li .ui-thumb-box .ui-icon {
    margin-bottom:46px;
}
.ui-certify-list li .ui-thumb-box .ui-thumb-text {
    margin-bottom:20px;
    font-size:20px;
}


.ui-check-field input[type="checkbox"] {
    width:18px;
    height:18px;
}

/* 수신 텍스트 표시 */
.ui-checkbox {
    position:relative;
    height:18px;
}

.ui-checkbox .check-field-label:before {
    content:"\eb7a";
    font-family:"remixicon";
    font-size:16px;
    width:18px;
    height:18px;
    position:absolute;
    left:0;
    top:0;
    right:auto;
    text-align:center;
    color:#fff;
    background-color:#E4ECF5;
    display:flex;
    align-items:center;
    padding-left:1px;
}

.ui-checkbox .check-field-label{
    transition:color 0.2s;
    font-size:18px;
    color:#D3D8DD;
}

/* 체크하면 '수신' 문구 표시 */
.ui-checkbox input[type="checkbox"]:checked + .check-field-label {
    border-color:#000;
    font-weight:600;
    color:var(--color-text-primary);
}

.ui-checkbox input[type="checkbox"]:checked + .check-field-label::before {
    color:#fff;
    background-color:var(--color-primary);
}

.ui-checkbox input[type="checkbox"]:focus,
.ui-checkbox input[type="checkbox"]:focus-visible {
    outline:0;
    box-shadow:none;
}

.ui-checkbox input[type="checkbox"]:focus + .check-field-label::before,
.ui-checkbox input[type="checkbox"]:focus-visible + .check-field-label::before {
    outline:0;
    box-shadow:none;
}

/* step */
/* 단계별 상태 스타일 */
.ui-stepper{
    overflow:hidden;
}

.ui-stepper-list{
    display:flex;
    justify-content:space-between;
    list-style:none;
    margin:0;
    padding:0;
    position:relative;
}

/* 가운데 라인 */
.ui-stepper-item::after{
    content:"";
    position:absolute;
    top:28px;
    left:calc(50% + 29px);
    width:calc(100% - 58px);
    height:1px;
    background-color:#0B78CB;
    z-index:-1;
}

/* 마지막 단계 뒤에는 선 없음 */
.ui-stepper-item:last-child::after{
    display:none;
}

/* 완료 단계 다음 연결선 */
.ui-stepper-item-done::after{
    background-color:#1683d8;
}

.ui-stepper-item{
    position:relative;
    text-align:center;
    flex:1;
    z-index:1;
}

/* 원 */
.ui-stepper-circle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:58px;
    height:58px;
    border-radius:50%;
    background:#BBC4D0;
    font-size:26px;
    color:#fff;
    font-weight:500;
    position:relative;
    z-index:2;
}

.ui-stepper-circle i{
    display:none;
    content:"\eb7a";
    font-size:26px;
    color:#fff;
    font-weight:700;
}

/* 완료 */
.ui-stepper-item-done .ui-stepper-circle{
    background:#0B78CB;
    color:#fff;
}

/* 현재 */
.ui-stepper-item-active .ui-stepper-circle{
    background:#0B78CB;
    color:#fff;
    font-size:0;
}

.ui-stepper-item-active .ui-stepper-circle i{
    display:block;
}

/* 텍스트 */
.ui-stepper-label{
    display:block;
    margin-top:35px;
    font-weight:400;
    font-size:26px;
}

.ui-stepper-label:before{
    display:block;
    content:'';
}

.ui-stepper-label2{
    display:block;
    font-weight:700;
    font-size:26px;
}

/* 회원정보입력 */
.ui-member-info{
    margin-top:90px;
}

.ui-member-info .ui-stepper{
    margin-top:90px;
    margin-bottom:160px;
}

.ui-member-info .ui-table-setting .ui-form-group{
    justify-content:center;
}

.ui-member-info .ui-table-setting thead th,
.ui-member-info .ui-table-setting td{
    height:76px;
    font-size:22px;
    text-align:center;
}
.ui-member-info .ui-table-setting tbody th{
    padding-left:30px;
    height:76px;
    font-size:16px;
}

.ui-member-info .ui-table-invisible .ui-join-msg{
    margin-top:10px;
}

.ui-member-info .ui-table-invisible th{
    font-size:20px;
    font-weight:500;
}

.ui-member-info .ui-table-invisible td .ui-form-field .ui-btn {
    position:absolute;
    right:0;
    margin-right:20px;
}

.ui-member-info .ui-table-invisible td input,
.ui-member-info .ui-table-invisible td select {
    height:60px;
}

.ui-member-info .ui-form-item-password .ui-login-password{
    margin-right: 35px;
}

.ui-member-info .ui-join-msg{
    font-size:14px;
    color:#0B78CB;
    font-weight:500;
    line-height:1.5;
}

/* 회원가입완료 */
.ui-join-page {}

.ui-signup-complete {
    margin-bottom:80px;
}

.ui-signup-complete .ui-signup-complete-title {
    font-size:32px;
    margin-bottom:60px;
}

.ui-signup-complete p {
    font-size:22px;
    font-weight:500;
}

.ui-signup-complete p > strong {
    font-weight:700;
}

/* 업무권한 아코디언 */
.ui-accordion-business .ui-accordion-list {
    border-top:0;
}
.ui-accordion-business .ui-accordion-item {
    border:1px solid #E1E7EF;
    border-radius:14px;
    margin-bottom:24px;
    padding:0 60px;
}

.ui-accordion-business .ui-accordion-trigger::before {
    width:35px;
    height:35px;
    font-size:35px;
}
.ui-accordion-business .ui-accordion-item.is-active .ui-accordion-trigger::before {
    color:#0085E9;
}

.ui-accordion-business .ui-accordion-trigger {
    height:100px;
}

.ui-accordion-business .ui-accordion-title {
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.ui-accordion-business .ui-accordion-name {
    min-width:0;
    margin:0;
    font-size:23px;
    font-weight:700;
}

.ui-accordion-business .ui-accordion-name .ui-accordion-code {
    padding-left:10px;
    font-weight:400;
}

.ui-accordion-business .ui-accordion-icon {
    flex:0 0 63px;
    width:63px;
    height:63px;
}

.ui-accordion-business .ui-accordion-icon [class*=" ui-icon--work_"] {
    width:34px;
    height:auto;
}

.ui-accordion-business .ui-accordion-panel {
    padding:40px 0;
    background:#fff;
}

.ui-accordion-business .ui-accordion-guide .ui-guide-list li:first-child {
    margin-top:0;
}

.ui-accordion-business .ui-accordion-guide .ui-guide-list li {
    list-style:disc;
    font-size:18px;
    margin-top:30px;
    margin-left:20px;
}

.ui-join-page .ui-btn-group {
    margin-top:100px;
}
.ui-join-page .ui-btn {
    width:250px;
}

.ui-authority {
    border-top:1px solid #E1E7EF;
    padding-top:40px;
    margin-top:40px;
}

.ui-authority-guide {
    margin-bottom:20px;
}
.ui-authority-list {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:20px;
}
.ui-authority-list li {
    position:relative;
}
.ui-authority .ui-authority-list li::before {
    content:"\ea6e";
    font-family:"remixicon";
    color:#33363D;
    font-size:24px;
    display:inline-block;
    position:absolute;
    top:50%;
    right:20px;
    transform:translateY(-50%);
    transition:0.3s;
}
.ui-authority .ui-authority-link {
    display:block;
    padding:30px;
    border-radius:4px;
    border:1px solid #DBDFE4;
}
.ui-authority .ui-authority-link:hover {
    border-color:#33363D;
}

.ui-authority .ui-authority-link .ui-authority-name > strong {
    display:block;
}


/* 마이페이지 */
.ui-mypage-page .ui-section{
    margin-bottom:60px;
}

.ui-mypage-page .ui-section:last-child {
    margin-bottom:0;
}

.ui-mypage-page .ui-section + .ui-line-dot {
    margin:100px 0 50px;
}

.ui-mypage-page .ui-stepper{
    margin-top:90px;
    margin-bottom:160px;
}

.ui-mypage-page .ui-table-wrapper ~ .ui-btn-group {
    margin-top:60px;
}

.ui-mypage-page .ui-table-invisible {
    width:60%;
    margin:0 auto;
}

/*회원정보수정*/
.ui-mypage-page .ui-member-info .ui-section-title-sub {
    margin-bottom:80px;
}

.ui-mypage-page .ui-section-setting {
    margin-top:100px;
}

.ui-mypage-page .ui-authority-list {gap:30px}
.ui-mypage-page .ui-authority-list .ui-thumb-box {
    padding:36px 0;
    border:1px solid #BBC4D0;
    border-radius:6px;
    text-align:center;
}
.ui-mypage-page .ui-authority-list .ui-thumb-box .ui-icon {display:inline-block; margin-bottom:20px; text-align:center;}
.ui-mypage-page .ui-authority-list .ui-thumb-box .ui-icon i {height:54px;}
.ui-mypage-page .ui-authority-list .ui-thumb-box .ui-thumb-text {margin-bottom:16px; font-size:18px; line-height:1; font-weight:500; color:#222;}
.ui-mypage-page .ui-authority-list .ui-thumb-box .ui-thumb-title {font-size:20px; color:#33363D;}


/* 기금 권한신청 */
.ui-applystep {
    margin-bottom:100px;
}

.ui-applystep-box {
    display:flex;
    flex-direction:column;
    gap:10px;

    padding:30px 0;
    background:#F4FAFF;
    border-radius:10px;

    font-size:18px;
    text-align:center;
    margin-bottom:20px;
}

.ui-applystep-box .ui-applystep-title {
    display:flex;
    align-items:flex-start;
    justify-content:center;
    gap:10px;
    font-size:20px;
    font-weight:700;
}

.ui-applystep-box .ui-applystep-title > :not(span) {
    min-width:0;
}

.ui-applystep-box .ui-applystep-title span {
    display:flex;
    flex:0 0 24px; /* 늘어나거나 줄어들지 않도록 고정 */
    align-items:center;
    justify-content:center;
    width:24px;
    min-width:24px;
    height:24px;
    margin-top:3px;
    border-radius:50%;
    font-size:12px;
    line-height:1;
    color:#fff;
    background:#0b78cb;
}

.ui-applystep .ui-applystep-blank {
    display:grid;
    justify-items:center;
    text-align:center;
    gap:30px;
    margin:10px 0 30px;
}

.ui-applystep .ui-applystep-blank-text {
    font-size:20px;
    font-weight:700;
    color:#33363D;
}

.ui-invisible-list {
    margin:40px 0;
}

.ui-invisible-list li {
    margin-bottom:20px;
    font-size:20px;
    font-weight:500;
}


/* 서명하기 */
.ui-signature-pad {
    position:relative;
    height:300px;
    border:1px solid #999;
    background-color:#f5f5f5;
    overflow:hidden;
    touch-action:none;
}

.ui-signature-canvas {
    position:relative;
    z-index:2;
    display:block;
    width:100%;
    height:100%;
    cursor:crosshair;
    touch-action:none;
}

.ui-signature-placeholder {
    position:absolute;
    top:50%;
    left:50%;
    z-index:1;
    width:100%;
    margin:0;
    padding:0 20px;
    transform:translate(-50%, -50%);
    color:#888;
    font-size:38px;
    text-align:center;
    box-sizing:border-box;
    pointer-events:none;
}

.ui-signature-pad.is-signed .ui-signature-placeholder {
    display:none;
}

.ui-certify-list--row {
    display:flex;
    gap:10px;
}
.ui-certify-list--row .ui-certify-list-first {
    width:60%;
}

.ui-certify-list--row li {
    width:40%
}


/* 서명 보기 */
.ui-signature-view {}
.ui-signature-thumbnail {
    margin-bottom:20px;
}

.ui-signature-thumbnail ul {
    display:flex;
    align-items:end;
    flex-wrap:wrap;
    gap:10px;
}

.ui-signature-thumbnail .ui-thumbnail-card {
    border:1px solid #F2F2F2;
}
.ui-signature-thumbnail .ui-thumbnail-card-item {
    width:120px;
    display:flex;
    flex-direction:column;
    gap:10px;
}

.ui-signature-thumbnail .ui-thumbnail-card-image {
    border-bottom:1px solid #F2F2F2;
    background:#F7F7F7;
    height:70px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.ui-signature-thumbnail .ui-thumbnail-card-image img {
    max-width:86px;
    max-height:50px;
}

.ui-signature-thumbnail .ui-thumbnail-card-content {
    display:flex;
    align-items:center;
    gap:5px;
    padding:0 6px;
}
.ui-signature-thumbnail .ui-thumbnail-card-text {
    margin-top:0;
    white-space:nowrap;
    font-size:14px;
    font-weight:400;
}


/* 달력 */
.ui-fullcalendar {
    display: -webkit-box;
    display: flex;
    margin-bottom: 40px;
}

.ui-fullcalendar #calendar {
    position: relative;
    z-index: 0;
}

.ui-calendar-header {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    position:relative;
    margin-bottom: 30px;
}

.ui-calendar-title {
    font-size:28px;
    font-weight:700;
    line-height:1;
}

.ui-calendar-btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:32px;
    height:30px;
    border:0;
    border-radius:4px;
}

.ui-calendar-btn:hover span,
.ui-calendar-btn:focus span{
    color:#0B78CB;
}

.ui-calendar-util {
    position:absolute;
    right:0;
    display:flex;
    gap:8px;
}

.ui-calendar-util .ui-btn {
    height:30px;
}

.ui-calendar-util .ui-btn:hover {
    background-color: #0b78cb;
    color: #fff;
}

.ui-fullcalendar .btn_box button {
    width: 100%;
    text-align: left;
    background: #E7EBF2;
    color: #767676;
    font-weight: 600;
    font-size: 15px;
    padding: 10px 20px 10px 38px;
    border-radius: 50px;
    position: relative;
    margin-bottom: 6px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.ui-fullcalendar .btn_box button::before {
    content: "\eb7a";
    font-family: "remixicon";
    font-weight: 400;
    position: absolute;
    left: 20px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.ui-fullcalendar .btn_box button.active {
    background: #0066B3;
    color: #fff;
}

.ui-fullcalendar .btn_box button:not(.active):hover, .ui-fullcalendar .btn_box button:not(.active):focus {
    background: #8693AE;
    color: #fff;
}

/* 캘린더 출력 */
.ui-calendar {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 calc(100% - 260px);
    flex: 1 1 calc(100% - 260px);
}
.ui-calendar .fc-view-harness {
    min-height: 780px;
}
.ui-calendar .fc-header-toolbar {
    display: block;
    position: relative;
}
.ui-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-child(3) {
    width: 260px;
    max-width: 100%;
    display: block;
    position: absolute;
    right: 0;
    top: 5px;
}
.ui-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-child(3) .fc-button-group {
    border-right: 1px solid #ddd;
    margin-right: 5px;
    padding-right: 5px;
}
.ui-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-child(3) button {
    border: 1px solid #ddd;
    background: #fff;
    color: #767676;
    margin: 0 3px;
    border-radius: 4px !important;
    padding: 5px 14px;
}
.ui-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-child(3) .fc-button-active {
    border-color: #0066B3;
    color: #0066B3;
    font-weight: 600;
}
.ui-calendar .fc-header-toolbar .fc-toolbar-chunk:nth-child(1) .fc-button-group {
    width: 300px;
    max-width: 100%;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.ui-calendar .fc-toolbar-title {
    font-size: 36px;
    font-weight: 700;
    color: #333;
    text-align: center;
}
.ui-calendar .fc-prev-button,
.ui-calendar .fc-next-button {
    position: absolute !important;
    background: #fff;
    color: #000;
    top: 0;
    left: 0;
    border-radius: 6px;
    border-color: #fff;
    border-radius: 6px !important;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.ui-calendar .fc-prev-button .fc-icon,
.ui-calendar .fc-next-button .fc-icon {
    font-size: 30px;
}
.ui-calendar .fc-prev-button:hover, .ui-calendar .fc-prev-button:focus,
.ui-calendar .fc-next-button:hover,
.ui-calendar .fc-next-button:focus {
    background: #333;
    color: #fff;
}
.ui-calendar .fc-next-button {
    left: initial !important;
    right: 0;
}
.ui-calendar .fc-scrollgrid {
    border: 1px solid #E3EBF6;
}
.ui-calendar .fc-col-header thead {
    background: #F5F9FF;
}
.ui-calendar th {
    border: 1px solid #E3EBF6;
}
.ui-calendar .fc-day {
    border: 1px solid #E3EBF6 !important;
}
.ui-calendar .fc-day.fc-col-header-cell {
    border-right: 1px solid #E3EBF6 !important;
}
.ui-calendar .fc-day.fc-day-sat {
    border-right: none !important;
}
.ui-calendar .fc-col-header-cell.fc-day-sun {
    color: #EF4444;
}
.ui-calendar .fc-col-header-cell.fc-day-sat {
    color: #1B5FF4;
}
.ui-calendar .fc-scrollgrid-section > td {
    border-color: #fff;
    border-bottom: 1px solid #F0F0F0;
}
.ui-calendar .fc-day-other {
    background: transparent;
}
.ui-calendar .fc-day-other .fc-daygrid-day-top {
    color: #9CA3AF;
    opacity: 1;
}

.ui-calendar .fc-daygrid-day-frame {
    padding: 10px;
}
.ui-calendar .fc-daygrid-day-top {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}
.ui-calendar .fc-h-event {
    border-radius: 20px;
    padding: 0px 8px;
    line-height: 18px;
}
.ui-calendar .fc-h-event.type1 {
    background: #5483EF;
    border-color: #5483EF;
}
.ui-calendar .fc-h-event.type_c1 {
    background: #5483EF;
    border-color: #5483EF;
}
.ui-calendar .fc-h-event.type_c2 {
    background: #FFF177;
    border-color: #FFF177;
}
.ui-calendar .fc-h-event.type_c2 .fc-event-title {
    color: #222;
}
.ui-calendar .fc-h-event.type_c3 {
    background: #41BDA7;
    border-color: #41BDA7;
}
.ui-calendar .fc-h-event.type_c4 {
    background: #A277CE;
    border-color: #A277CE;
}
.ui-calendar .fc-h-event.type_c5 {
    background: #8693AE;
    border-color: #8693AE;
}
.ui-calendar .fc-event-title {
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
}
.ui-calendar .fc-daygrid-body-unbalanced .fc-daygrid-day-events {
    min-height: 70px;
}
.ui-calendar .fc-col-header-cell-cushion {
    padding: 10px 4px;
}
.ui-calendar .fc-daygrid-day-bg .fc-non-business {
    background: none;
}

/* qtip FullCalendar보다 위에 표시 */
.qtip.qtip-kofons {
    width: auto;
    min-width: 180px;
    max-width: 400px;
    height: auto;
    z-index: 9999 !important;
}

/* qTip 내용이 잘리지 않도록 처리 */
.qtip-kofons .qtip-content {
    width: auto;
    height: auto;
    overflow: visible;
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: break-word;

    padding: 3px 6px;
    color: #555;
    font-size: 13px;
    line-height: 1.2;
    text-align: center; /* 날짜 가운데 정렬 */
    background: #fff;
}

.qtip-kofons .qtip-title {
    display: block;
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: break-word;
}

.qtip-kofons .qtip-titlebar {
    text-align: center;
}

/* 국가 선택 전체 영역 */
.ui-country-area {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* flex 부모 안에 배치될 경우 너비 확장 방지 */
.ui-country-area .ui-tabs,
.ui-country-area .ui-tabs-panel,
.ui-country-area .ui-swiper,
.ui-country-area .swiper-wrapper {
    max-width: 100%;
    min-width: 0;
}

/* 기존 공통 ui-tabs에 display:flex가 있는 경우 재정의 */
.ui-country-area > .ui-tabs {
    display: block;
    width: 100%;
}

/* 대륙 탭 */
.ui-country-area .ui-tabs-list {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
}

.ui-country-area .ui-tabs-tab {
    min-width: 0;
    height: 52px;
    padding: 0 15px;
    border: 0;
    border-radius: 26px;
    background: #edf1f5;
    color: #333;
    font-size: 20px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
}

.ui-country-area .ui-tabs-tab.is-active {
    background: #deeca0;
    color: #273114;
    font-weight: 700;
}

.ui-country-area .ui-tabs-tab:focus-visible {
    outline: 2px solid #1769e0;
    outline-offset: 3px;
}

/* 탭 패널 */
.ui-country-area .ui-tabs-panel {
    display: none;
    width: 100%;
}

.ui-country-area .ui-tabs-panel.is-active {
    display: block;
}

.ui-country-area .ui-tabs-panel[hidden] {
    display: none;
}

/* 국가 Swiper */
.ui-country-area .ui-country-swiper {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0 40px;
    margin-bottom: 60px;
    overflow: hidden;
    box-sizing: border-box;
}

/*
 * 중요:
 * swiper-wrapper가 콘텐츠 너비만큼 계속 늘어나더라도
 * 바깥 ui-country-swiper가 100% 이상 커지지 않도록 처리
 */
.ui-country-area .ui-country-swiper .swiper-wrapper {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.ui-country-area .ui-country-swiper .swiper-slide {
    width: auto;
    min-width: 0;
    height: auto;
}

/* 국가 선택 버튼 */
.ui-country-area .ui-country-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #222;
    cursor: pointer;
}

.ui-country-area .ui-country-flag {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 90px;
    border: 1px solid #dce2e8;
    background: #fff;
    box-sizing: border-box;
}

.ui-country-area .ui-country-flag img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 100%;
    object-fit: contain;
}

.ui-country-area .ui-country-name {
    display: block;
    margin-top: 17px;
    font-size: 20px;
    line-height: 1.3;
    text-align: center;
    color: #33363D;
    font-weight: 700;
}

/* 선택된 국기 */
.ui-country-area .ui-country-button.is-active .ui-country-flag {
    border: 2px solid #DBDFE4;
}

.ui-country-area .ui-country-button:focus-visible {
    outline: none;
}

.ui-country-area .ui-country-button:focus-visible .ui-country-flag {
    outline: 1px solid #DBDFE4;
    outline-offset: 3px;
}

/* Swiper 화살표 */
.ui-country-area .ui-country-swiper .swiper-button-prev,
.ui-country-area .ui-country-swiper .swiper-button-next {
    width: 32px;
    height: 100%;
    margin-top: 0;
    top: 0;
    color: #33363D;
}

.ui-country-area .ui-country-swiper .swiper-button-prev {
    left: 0;
}

.ui-country-area .ui-country-swiper .swiper-button-next {
    right: 0;
}

.ui-country-area .ui-country-swiper .swiper-button-prev::after,
.ui-country-area .ui-country-swiper .swiper-button-next::after {
    font-size: 18px;
    font-weight: 700;
}

/* 지도 */
.ui-country-area .ui-country-map {
    width: 100%;
    min-width: 0;
    height: 650px;
    margin-top: 40px;
    background: #f2f4f6;
    box-sizing: border-box;
}

.ui-country-area .ui-country-map[hidden] {
    display: none;
}

.ui-country-area .ui-country-map-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 30px;
    color: #555;
    text-align: center;
    box-sizing: border-box;
}

.ui-country-area .ui-country-map-title {
    font-size: 24px;
    color: #222;
}

.ui-country-area .ui-country-map-text {
    margin: 12px 0 0;
    font-size: 16px;
}

.ui-country-area .ui-country-button.is-active .ui-country-flag {
    border: 2px solid #1687ff;
}


/* 업무절차 */
.ui-workflow .ui-guide-workflow {
    display: flex;
    gap: 10px;
    line-height: 1.2;
    margin-bottom: 60px;
}

.ui-workflow .ui-workflow-img {
    text-align: center;
}

.ui-workflow-box {
    width: 100%;
    color: #252b36;
    margin-top: 60px;
    text-align: center;
}

.ui-workflow-title::before {
    content: "";
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 0;
    width: 3px;
    background-color: #1686e5;
    border-radius: 2px;
}

.ui-workflow-list {
    width: min(100%, 530px);
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.ui-workflow-item {
    margin: 0;
    padding: 0;
}

.ui-workflow-etc {
    font-size: 16px;
    line-height: 1.3;
    margin-top: 30px;
    font-weight: 400;
}
.ui-workflow-etc strong {
    margin-right: 10px;
    font-weight: 700;
}

.ui-workflow-card {
    position: relative;
    display: flex;
    min-height: 60px;
    padding: 26px 46px 26px 64px;
    align-items: center;
    border: 1px solid #cdd6e2;
    border-radius: 100px;
    background-color: #fff;
    color: #252b36;
    text-decoration: none;
    box-sizing: border-box;
}

a.ui-workflow-card {
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

a.ui-workflow-card:hover {
    border-color: #1686e5;
    box-shadow: 0 4px 12px rgba(22, 134, 229, 0.12);
}

a.ui-workflow-card:focus-visible {
    outline: 2px solid #0875d1;
    outline-offset: 3px;
}

.ui-workflow-number {
    position: absolute;
    top: 50%;
    left: 20px;
    display: flex;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #a9ceff;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    transform: translateY(-50%);
}

.ui-workflow-content {
    display: flex;
    min-width: 0;
    width: 100%;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.ui-workflow-name {
    display: block;
    color: #252b36;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    word-break: keep-all;
}

.ui-workflow-description {
    margin-top: 1px;
    color: #333a46;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.3;
}

.ui-workflow-url {
    white-space: nowrap;
}

.ui-workflow-link-icon {
    position: absolute;
    top: 50%;
    right: 38px;
    width: 16px;
    height: 16px;
    border-top: 2px solid #33363D;
    border-right: 2px solid #33363D;
    transform: translateY(-50%) rotate(45deg);
}

.ui-workflow-arrow {
    display: block;
    width: 0;
    height: 0;
    margin: 42px auto 40px;
    border-top: 16px solid #6B7280;
    border-right: 16px solid transparent;
    border-left: 16px solid transparent;
}

.ui-workflow .ui-etc {
    font-size: 20px;
    font-weight: 500;
}

.ui-workflow .ui-section-last {
    margin-top: 120px;
}

/* 부담금 */
.ui-section-payment .ui-section-title .ui-btn-group {
    float: right;
}

.ui-payment-report {
    border: 2px solid #aabace;
    padding: 30px;
    box-sizing: border-box;
}

.ui-payment-grid-step {
    display: grid;
    align-items: stretch;
    justify-items: center;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px;
}

.ui-payment-grid-step .ui-card-item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 80px;
    text-align: left;
    padding: 15px 30px;
    border: 1px solid #BBC4D0;
    border-radius: 60px;
    box-sizing: border-box;
    font-size: 20px;
    font-weight: 500;
    position: relative;
}

.ui-payment-grid-step .ui-card-item + .ui-card-item::after {
    position: absolute;
    top: 50%;
    left: -21px;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 12px solid #6B7280;
    content: "";
    transform: translateY(-50%);
}

.ui-payment-btm-text {
    padding: 20px 0;
    font-size: 20px;
}

.ui-payment-report-footer {
    border-top: 20px solid #F4FAFF;
    margin-top: 30px;
    padding: 50px 0;
    text-align: center;
}
.ui-payment-report-footer .ui-payment-footer-text {
    font-size: 24px;
    font-weight: 500;
    letter-spacing: -1px;
    margin-bottom: 30px;
}
.ui-payment-report-footer .ui-payment-footer-signature {
    font-size: 34px;
    font-weight: 700;
    letter-spacing: 5px;
}

.ui-nsfms-info .ui-thumbnail-card-text {
    margin-top:0;
}

.ui-nsfms-info .ui-thumbnail-card-top {
    padding: 40px;
    border-right: 1px dotted #BBC4D0;
}

.ui-nsfms-info .ui-thumbnail-card-item {
    border: 1px solid #BBC4D0;
    border-radius: 10px;
    padding: 30px 0;
    gap: 60px;
}

.ui-nsfms-info .ui-thumbnail-card-item + .ui-thumbnail-card-item {
    margin-top: 30px;
}

.ui-nsfms-info .ui-thumbnail-card-item .ui-btn {
    padding: 0 20px;
    font-size:16px;
}

.ui-nsfms-info .ui-thumbnail-card-body {
    padding-right: 30px;
}
