@charset "utf-8";

/* sub : common */
.txt_bold{
	font-weight:bold;
	color: var(--clr-blue-Medium); 
}
.bul_view > li {
    list-style: none;
    position: relative;
    padding-left: 15px;
}

.bul_view > li::before {
    content: '';
    position: absolute;
    width: 3px;
    height: 3px;
    left: 3px;
    top: 11px;
    background: #7c7c7c;
}

/* common : color */
.base_blue { color: var(--clr-blue-Medium); }
.base_green { color: var(--clr-blue-green); }
.base_bdark { color: var(--clr-blue-dark); }
.base_violet { color: var(--clr-violet); }
.base_gray { color: var(--clr-blue-light); }


.subWrap{
	padding-top:13rem;
}
/* sub : subhead */
.subhead { 
    width: 180rem; 
    margin: 0 auto;
}
.subhead .subVisual {
    width: 100%;
    height: 18rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    background-color: var(--clr-blue-Medium);
    /*
    background: linear-gradient(45deg, #005bfe 25%, #1c82fe 50%, #e0aeff); 
    */
    padding: 0 1.5rem;
    border-radius: 5rem;
    box-shadow: 0.3rem 0.3rem 2rem rgb(28 130 254 / 35%);
    overflow: hidden;
    z-index: 2;
    position: relative;
}
.subhead .subVisual::before {
    content: url(../img/common/subVisual_L.png);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.subhead .subVisual::after {
    content: url(../img/common/subVisual_R.png);
    position: absolute;
    top: 0;
    right: 0;
    z-index: -2;
}
.subhead .subVisual .subPageTit {
    font-family: 'Gyeonggi Title';
    font-weight: 500;
    font-size: 4.3rem;
    /*font-size: var(--fs-2xl);*/
    color: var(--clr-white);
    text-align: center;
}
.subhead .subVisual .breadCrumb .breadCrumbNavi {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.subhead .subVisual .breadCrumb .breadCrumbNavi > li {
    padding-right: 3rem;
    position: relative;
}
.subhead .subVisual .breadCrumb .breadCrumbNavi > li::after {
    content: '>';
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    font-size: var(--fs-xs);
    color: var(--clr-white);
    opacity: 0.5;
}
.subhead .subVisual .breadCrumb .breadCrumbNavi > li:last-of-type { padding-right: 0; }
.subhead .subVisual .breadCrumb .breadCrumbNavi > li:last-of-type::after { content: none; }
.subhead .subVisual .breadCrumb .breadCrumbNavi > li a {
    font-size: var(--fs-md);
    color: var(--clr-white);
}
.subhead .subVisual .breadCrumb .breadCrumbNavi > li.home a {
    text-indent: -99999rem;
    width: 2.2rem;
    height: 2rem;
    background-image: url(../img/common/ic_home.png);
    background-repeat: no-repeat;
    background-size: 113%;
}

/* sub : subhead > lnb */
.subhead .lnb {
    border-bottom: 1px solid var(--clr-gray-c);
    width: 100%;
}
.subhead .lnb ul {
    display: flex; 
    justify-content: center; 
    max-width: 140rem; 
    width: 60%;
    margin: 0 auto; 
    padding: 0;
    /*
    list-style: none;
    height: 7.5rem;
    line-height: 7.5rem;
    */
}
.subhead .lnb ul li {
    /* flex: 1; */ 
    min-width: 36rem; 
    text-align: center;
    font-size: var(--fs-md-20);
    transition: all 0.4s;
    position: relative; 
}
.subhead .lnb ul li::after {
    content: '';
    width: 100%;
    height: 0.2rem;
    position: absolute;
    left: 0;
    bottom: -1px;
    transform: scaleX(0); 
    transform-origin: center; 
    transition: transform 0.5s ease;
    background-color: var(--clr-blue-Medium);
}
.subhead .lnb ul li a {
    display: block; 
    height: 100%;
    line-height: 1.3; 
    align-content: center; 
    padding: 2.5rem 3rem; 
    color: var(--clr-gray);
    text-decoration: none;
}
.subhead .lnb ul li:hover a {
    color: var(--clr-blue-Medium);
    font-weight: bold;
}
.subhead .lnb ul li:hover::after {
    transform: scaleX(1);
}
.subhead .lnb ul li a i.link {
    /*
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 2rem;
    */
    display: inline-block;
    width: 1.3rem;
    height: 1.5rem;
    vertical-align: middle;
    margin-left: 1rem;
    background-image: url(../img/common/ic_link_g.png);
    background-repeat: no-repeat;
    background-size: contain;
    text-indent: -99999rem;
}
.subhead .lnb ul li.over_on a i.link,
.subhead .lnb ul li:hover a i.link, 
.subhead .lnb ul li:focus a i.link, 
.subhead .lnb ul li:active a i.link {
    background-image: url(../img/common/ic_link_b.png);
}

/* 활성화된 탭 */
.subhead .lnb ul li.over_on a {
    color: var(--clr-blue-Medium);
    font-weight: bold;
}
.subhead .lnb ul li.over_on::after {
    transform: scaleX(1);
}

@media screen and (max-width: 1800px) {
    .subhead { width: 94%; }
}
@media screen and (max-width: 1200px) {
	.subhead .lnb ul li { min-width: auto; } 
}

@media screen and (max-width: 960px) {
    .subhead .subVisual .breadCrumb .breadCrumbNavi > li.home a {
        background-size: contain;
    }
    .subhead .subVisual { 
        background: linear-gradient(45deg, #005bfe 20%, #1c82fe 50%, #e0aeff 90%); 
    }
    /*
    .subhead .subVisual::before { left: -10rem; }
    .subhead .subVisual::after { right: -30rem; }
    */
    .subhead .subVisual::before, 
    .subhead .subVisual::after { content: none; }
    
    .import_txt p:before{left: 166px !important;}
}

@media screen and (max-width: 960px) {
	.subhead .lnb ul { width: 80%;  } 
}

@media screen and (max-width: 560px) {
    .subhead { width: 90%; }
}

@media screen and (max-width: 320px) {
    /*
    .subhead .lnb { border-bottom: 0; }
    .subhead .lnb .lnbList { flex-direction: column; }
    .subhead .lnb .lnbList .lnbItem { 
        width: 100%;
        text-align: center; 
        border-bottom: 0.1rem solid var(--clr-gray-d); 
    }
    */
}



/* sub : subCont */
.subCont {
    width: 140em;
    height: auto;
    margin: 8rem auto 20rem;
    background-color: #fff;
    overflow: hidden;
    position: relative;
}

@media screen and (max-width: 1560px) {
    .subCont { width: 94%; }
}

@media screen and (max-width: 560px) {
    .subCont { width: 90%; }
}



/* sub : board */
/* board > boardTop */
.boardList .boardTop {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    align-items: center;
    margin-bottom: 2rem;
}
.boardList .boardTop .total p {
    font-size: var(--fs-xs);
    letter-spacing: 1.5;
}
.boardList .boardTop .total p .num {
    font-size: 2.0rem;
    font-weight: 600;
    color: var(--clr-blue-Medium);
}
.boardList .boardTop .selectBox {
    display: block;
    width: 20rem;
    box-sizing: border-box;
    font-size: 1.8rem;
    font-weight: 500;
    position: relative;
}
.boardList .boardTop .selectBox .selectList { 
    width: 100%;
    height: 100%;
    position: relative;
}
.boardList .boardTop .selectBox .selectList::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 2rem;
    transform: translateY(-50%) rotate(45deg);
    width: 0.9rem;
    height: 0.9rem;
    margin: auto;
    border: 0.2px solid var(--clr-black);
    border-top: 0;
    border-left: 0;
    box-sizing: border-box;
}
.boardList .boardTop .selectBox .selectList select {
    width: 100%;
    height: 100%;
    background-color: var(--clr-white);
    border: 0.1rem solid var(--clr-gray-bar); 
    border-radius: 0.8rem;
    padding: 1.5rem 2rem;
    cursor: pointer;
    position: relative;
}

/* board > boardCont */
.board { display: block; }
.board .boardCont {}
.board .boardCont .table {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}
.board .boardCont .table.boardTable {
    border-top: 0.2rem solid var(--clr-blue);
}
.board .boardCont .boardTable thead {}
.board .boardCont .boardTable thead tr {}
.board .boardCont .boardTable thead tr th {
    font-size: 1.6rem;
    padding: 2rem 1rem;
    border-bottom: 0.1rem solid var(--clr-gray-d);
    background-color: var(--clr-white-dark);
}
.board .boardCont .boardTable tbody { width: 100%; }
.board .boardCont .boardTable tbody tr {}
.board .boardCont .boardTable tbody tr td {
    font-size: 1.8rem;
    text-align: center; 
    padding: 2rem 2rem;
    border-bottom: 0.1rem solid var(--clr-gray-d);
    /* border-right: 0.1rem solid var(--clr-gray-d); */
    vertical-align: middle;
}
.boardList .boardCont .boardTable .listNum { width: 10%; }
.boardList .boardCont .boardTable .listTit { width: 75%; }
.boardList .boardCont .boardTable .listDate { width: 15%; }

.board .boardCont .boardTable tbody tr td.listNum {}
.board .boardCont .boardTable tbody tr td.listTit {
    text-align: left;
}
.board .boardCont .boardTable tbody tr td.listTit a:hover { 
    color: var(--clr-blue);
}
.board .boardCont .boardTable tbody tr td.listDate { 
    color: var(--clr-gray);
}
.board .boardCont .table .textover {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1; 
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    position: relative;
    text-align: left;
}

/* board > pagination */
.board .boardCont .boardPagination {
    margin-top: 3rem;
    position: relative;
}
.board .boardCont .boardPagination .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    padding-top: 2rem;
}
.board .boardCont .boardPagination .pagination li button.pagiBtn {
    width: 3.6rem;
    height: 3.6rem;
    border: 0.1rem solid var(--clr-gray-d); 
    border-radius: 50%;
    display: grid;
    place-items: center;
    background-color: var(--clr-white); 
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
}
.board .boardCont .boardPagination .pagination li button.pagi-first {
    background-image: url("../img/common/ic_arrow_first.png");
}
.board .boardCont .boardPagination .pagination li button.pagi-prev {
    background-image: url("../img/common/ic_arrow_left.png");
}
.board .boardCont .boardPagination .pagination li button.pagi-next {
    background-image: url("../img/common/ic_arrow_right.png");
}
.board .boardCont .boardPagination .pagination li button.pagi-last {
    background-image: url("../img/common/ic_arrow_last.png");
}
.board .boardCont .boardPagination .pagination li button.active {
    border-color: var(--clr-black);
    background-color: var(--clr-black);
}
.board .boardCont .boardPagination .pagination li button.pagiBtn span { 
    font-size: var(--fs-xs);
    color: var(--clr-gray-dark);
}
.board .boardCont .boardPagination .pagination li button.pagiBtn.active span { 
    color: var(--clr-white); 
}

/* boardView */
.boardView {}
.boardView .boardCont .boardTable thead tr th {
    width: 20%;
    font-size: var(--fs-md-20);
    border-bottom: 0.1rem solid var(--clr-gray-d);
    background-color: var(--clr-white-dark);
}
.boardView .boardCont .boardTable thead tr td {
    width: 80%;
    font-size: var(--fs-md-20);
    text-align: left;
    padding: 2rem 2.5rem;
    border-bottom: 0.1rem solid var(--clr-gray-d);
}
.boardView .boardCont .boardTable thead tr td.listTit {
    font-size: var(--fs-lg);
}

.boardView .boardCont .boardTable tbody tr td {
    text-align: left;
    padding: 10rem 4rem;
    background-color: var(--clr-white);
}
.boardView .boardCont .boardTable tbody tr td p {
    margin-bottom: 0.5rem;
}
.boardView .boardCont .boardTable tbody tr td img {}

.boardView .boardListBtn {
    width: 100%;
    height: 7rem;
    margin-top: 10rem;
    text-align: center;
}
.boardView .boardListBtn button {
    width: 28rem;
    height: 7rem;
    line-height: 7rem;
    font-size: 2rem;
    color: var(--clr-white);
    text-align: center;
    border-radius: 4rem;
    background-color: #001c3d;
}

@media screen and (max-width: 1400px) {
    .board .boardCont .boardPagination { margin-top: 2rem; }
}

@media screen and (max-width: 960px) {
    .board .boardCont .table .textover { -webkit-line-clamp: 2; }

    .boardView .boardCont .boardTable tbody tr td {
        padding: 6rem 2rem;
    }
    .boardView .boardCont .boardTable tbody tr td img { 
        width: 90%; 
        height: auto; 
    }
}

@media screen and (max-width: 560px) {
    .boardList .boardCont .boardTable .listNum, 
    .boardList .boardCont .boardTable .listTit, 
    .boardList .boardCont .boardTable .listDate { width: auto; }

    .board .boardCont .boardTable thead tr th { display: none; }
    .board .boardCont .boardTable tbody tr {
        position: relative;
        display: block;
        width: 100%;
        height: 9rem;
        border-bottom: 0.1rem solid var(--clr-gray-d);
    }
    .board .boardCont .boardTable tbody tr td { 
        position: absolute; 
        width: 100%;
        border-bottom: 0;
        padding: 1rem 0;
    }
    .board .boardCont .boardTable tbody tr td.listNum {
        width: 10%;
        height: 100%;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
    }
    .board .boardCont .boardTable tbody tr td.listNum span {
        vertical-align: middle;
    }
    .board .boardCont .boardTable tbody tr td.listTit { 
        width: 90%; 
        left: 10%;
        text-align: left;
    }
    .board .boardCont .boardTable tbody tr td.listDate { 
        width: 90%; 
        left: 10%;
        bottom: 0;
        text-align: left;
    }
    .board .boardCont .boardPagination .pagination { 
        gap: 1rem; 
    }
    .boardView .boardCont .boardTable thead {
        border-bottom: 0.1rem solid var(--clr-gray-d);
    }
    .boardView .boardCont .boardTable thead tr td {
        border-bottom: 0;
    }
    .boardView .boardCont .boardTable thead tr td.listDate {
        color: var(--clr-gray);
        padding-left: 10rem;
        position: relative;
    }
    .boardView .boardCont .boardTable thead tr td.listDate::before {
        content: attr(data-title);
        position: absolute;
        top: 2rem;
        left: 2.5rem;
        font-weight: 500;
    }
    .boardView .boardCont .boardTable tbody tr td {
        position: static;
        padding: 6rem 2rem;
    }
    
    .boardView .boardCont .boardTable tbody tr td img { 
        width: 100%; 
    }
}


/* sub : menu 01 */
/* 기관소개(about) > 이사장 인사말(ceo) */
.insa-wrap {
    padding: 10rem 10rem;
}
.insa-inner {
    max-width: 140rem;
    margin: 0 auto;
    display: flex;
    gap: 4rem;
}
.insa-img img {
    max-width: 100%;
    height: auto;
    display: block;
}
.insa-text {
    flex: 1;
    text-align: left;
}
.insa-text h2 {

    margin-bottom: 55px;
    font-family: 'Gyeonggi_Title_Medium', sans-serif !important;
    font-family: 'Gyeonggi Title';
    font-weight: 500;
    font-size: var(--fs-lg-30);
    letter-spacing: -1.5px;
    letter-spacing: -0.15rem;
    line-height: 1.5;
}
.insa-text h2 strong {
    /* font-weight: 700; */
    font-size: var(--fs-lg-32);
    line-height: 1.5;
}
.insa-name {
    font-size: var(--fs-md-20);
    line-height: 3rem;
    margin: 2rem 0;
    color: #555;
    text-align: center;
}
.insa-name strong {
    font-size: var(--fs-lg-28);
    color: var(--clr-black);
}
.insa-content p {
    margin-bottom: 2.5rem;
    font-size: var(--fs-md);
    color: #61676e;
}
.insa-content p:last-child {
    font-size: 2.5rem;
    color: #000e1f;
}



/* sub : menu 01 */
/* 기관소개(about) > 조직 구성(insa) */
.chairman {
    display: flex;
    align-items: center;
    gap: 4rem;
    background: #fff;
    border-radius: 1.5rem;
    padding: 2rem;
    flex-wrap: wrap;
}
.chairman > .profile-info > h3 {
  text-align: left;
}
.profile-section .m_gap {
    margin: 100px 0 112px;
    margin: 10rem 0 11.2rem;
    font-size: 3.2rem;
    text-align: left;
}
.profile-section h2 {
    margin: 10rem 0 2rem;
    font-family: 'Gyeonggi_Title_Medium', sans-serif;
    font-family: 'Gyeonggi Title';
    font-weight: 500;
    font-size: var(--fs-lg-32);
    text-align: left;
}
.profile-section {
    width: 90%;
    max-width: 120rem;
    margin: 0 auto;
    overflow: visible;
}
.profile-section:last-child {
    margin-bottom: 100px;
}
.profile-card {
    display: flex;
    /* align-items: flex-start;
    gap: 25px;
    background: #fff; */
    border-radius: 1.5rem;
    padding: 11rem 2rem 2rem;
    flex-wrap: wrap;
    justify-content: center;
    position: relative;
}
.profile-card img {
    max-width: 32rem;
    height: auto;
    border-radius: 50%;
    object-fit: cover;
    position: absolute;
    top: -7.8rem;
}
.profile-info {
    box-sizing: border-box;
}
.profile-info h3 {
    font-size: var(--fs-lg-28);
    margin-bottom: 2.7rem;
    font-weight: 900;
    text-align: center;
}
.profile-info h3 span {
    font-weight: normal;
    font-size: var(--fs-md-20);
    color: #666;
}
.profile-info ul {
    margin: 0;
    text-align: left;
}
.profile-info li {
    font-size: var(--fs-md);
    color: #61676e;
    margin-bottom: 0.7rem;
    line-height: 1.5;
}
.profile-info li ul li > p > img{
	vertical-align:middle;
	padding-right:10px;
}
.profile-info li ul li > p {
	font-size: var(--fs-xs);
	padding-top: 10px;
}

.bul  li > p > img{
	vertical-align:middle !important;
	padding-right:10px !important;
	position: relative;
    top: 0;
    border-radius: 0;
}

.bul  li > p{
	vertical-align:middle !important;
	padding-right:10px !important;
}



.auditor-card {
    justify-content: flex-start; 
    align-items: center; 
    text-align: center; 
}

/* 색상 스타일 */
.director.blue {
    background: #f0f6ff;
}
.director.purple {
    background: #f5f0ff;
}
.auditor.green {
    background: #f0fff6;
}
.profile-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
}
.auditor-card > .profile-grid {
    /*grid-template-columns: 1fr;  1열 
    justify-items: start; /* 왼쪽 정렬 */
    grid-template-columns: repeat(2, 1fr);
}



/* sub : menu 01 */
/* 기관소개(about) > 제도안내(rules) */
.rl-support {
    /*width: 90%;*/
    max-width: 120rem;
    margin: 0 auto 10rem;
    /* font-family: 'Arial', sans-serif; */
}

.rl-support h2 {
    font-family: 'Gyeonggi Title';
    font-weight: 500;
    font-size: var(--fs-lg-32);
    text-align: left;
    margin: 10rem 0 2.8rem;
}

.rl-support .sub {
    font-size: var(--fs-xs);
    color: #666;
    /*
    font-family: 'SUIT-Regular', 'SUIT Variable', 'Pretendard Variable', Pretendard, 'Noto Sans KR', sans-serif;
    */
}

.rl-support p {
    font-size: var(--fs-md-20);
    color: #61676e;
    line-height: 1.6;
    text-align: left;
    /*padding-left: 2rem;*/
}

.rl-support .rl_txt {
    padding-left: 0;
    text-align: center;
    padding-bottom: 2rem;
}

.rl-card-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.rl-wrap{
    width: 100%;
    padding: 3rem;
    text-align: center;
    box-sizing: border-box;
    background-color: #f5f5f5;
    border-radius: 1.8rem;
}
.rl-card {
    border: 0.2rem solid #d0e8ff;
    border-radius: 1rem;
    /* padding: 7px; */
    text-align: center;
}

.rl-card img {
    max-width: 8rem;
    height: 8rem; 
    margin-bottom: 1rem;
    margin-top: 2rem;
}

.rl-card h3 {
    font-size: var(--fs-md-20);
    margin-bottom: 1rem;
    font-weight: 600;
    background-color: #0cbbb9;
    color: var(--clr-white);
    height: 3.5rem;
    line-height: 3.5rem;
    border-radius: 0.5rem 0.5rem 0 0;
}
.rl-card p strong {
    color: #0077ff;
}
.rl-note {
    margin-top:2rem;
    font-size: 1.8rem;
    color: #000e1f;
    opacity: 0.5;
    text-align: right !important;
}
.rl-step-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}
.rl-card-wrap > .rl-card:nth-child(1) h3 {
    background-color: #0cbbb9;
}
.rl-card-wrap > .rl-card:nth-child(1) {
    border: 1px solid #0cbbb9;
}
.rl-card-wrap > .rl-card:nth-child(2) h3 {
    background-color: #187afe;
}
.rl-card-wrap > .rl-card:nth-child(2) {
    border: 1px solid #187afe;
}
.rl-card-wrap > .rl-card:nth-child(3) h3 {
    background-color: #2c54d4;
}
.rl-card-wrap > .rl-card:nth-child(3) {
    border: 1px solid #2c54d4;
}
.rl-step {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    padding: 1.5rem 2rem;
    border-radius: 0.5rem;
    flex: 1 1 auto;
    font-size: var(--fs-md);
    height: 8rem;
    text-align: center;
    border: 0.3rem solid #187afe;
    color: #187afe;
}
.rl-arrow {
    font-size: var(--fs-2xs);
    color: #555;
    text-align: center;
}
.rl-arrow::before {
    content: '→';
    font-size: var(--fs-2xs);
    color: #555;
}


.import_txt p{font-size: var(--fs-md); 	margin:45px 0 5px 0;}
.import_txt span{font-weight:bold;}


/* 25-08-19 신규 다이어그램 */
.diag-step-wrap{
    display: flex;
}
.diag-left,
.step-no,
.step-yes{
    display:flex;
    gap:6rem;
}
.diag-left>div{
    width:calc(50% - 3rem);
}
.step-no>div,
.step-yes>div{
    width:calc(31.333% - 3rem);
}
.diag-left{
    margin-top:5rem;
}
.step-no{
    margin-bottom:2rem;
}
.diag-left div,
.step-no div,
.step-yes div{
    position: relative;
    height:8rem;
    border-radius: 1.2rem;
    box-sizing: border-box;
    border:3px solid #1777fe;
    box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.1);
    display : flex; 
    justify-content : center;
    align-items : center;
}
.diag-left div p,
.step-no div p,
.step-yes div p{
    font-size: var(--fs-md);
    font-weight: 500;
    color:#000e1f;
    line-height: 2.4rem;
    text-align: center;
}
.step-no div:last-child{
    background-color:#1777fe;
}
.step-yes div:last-child{
    background-color:#000e1f;
    border:3px solid #000e1f;
}
.step-no div:last-child p,
.step-yes div:last-child p{
    color:#fff;
    font-weight: bold;
}
.diag-left div:first-child:after,
.step-no div:first-child:after,
/* .step-no div:nth-child(2):after, */
.step-yes div:first-child:after,
.step-yes div:nth-child(2):after{
    position: absolute;
    content:"";
    right:-4.4rem;
    width:20px;
    height:5px;
    background: url(../img/sub/check/arrow_000.png);
}
.diag-left{
    width:36.71%;
}
.diag-right{
    width:54.57%;
}
.diag-arrow{
    width:8.71%;
    height:18rem;
}
.no-arrow,
.yes-arrow{
    position: relative;
    width:100%;
    height:50%;
    display : flex; 
    justify-content : center;
    align-items : center;
    font-size: var(--fs-xs);
    letter-spacing: -0.06rem;
}
.no-arrow:after,
.yes-arrow:after{
    position: absolute;
    content:"";
    width:20px;
    height:5px;
    background: url(../img/sub/check/arrow_000.png);
}
.no-arrow:after{
    top:6.4rem;
}
.yes-arrow:after{
    top:1.8rem;
}

@media screen and (max-width: 1024px) {
    .diag-left{
        margin-top:0;
        width:18.55%;
    }
    .diag-right{
        margin-top:7.8rem;
        width:65%;
    }
    .diag-arrow{
        margin-top:7.8rem;
        width:16.4%;
    }
    .diag-left{
        display:block;
    }
    .diag-left>div{
        width:100%;
    }
    .diag-left>div:first-child{
        margin-bottom:4.8rem ;
    }
    .diag-left div:first-child:after{
        top:133%;
        left:45.5%;
        transform: translateX(-50%);
        transform:rotate(90deg);
    }
}

@media screen and (max-width: 640px) {
    .diag-step-wrap{
        display: block;
    }
    .diag-left,
    .step-no,
    .step-yes{
        display:block;
    }
    .diag-left,
    .diag-arrow,
    .diag-right{
        width:100%;
    }
    .diag-left div:first-child:after{
        left:49%;
    }
    .diag-arrow{
        margin-top: 0;
        display: flex;
        height:6.8rem;
    }
    .no-arrow,
    .yes-arrow{
        width:50%;
        height:100%;
        padding-right:2.8rem;
    }
    .no-arrow:after, .yes-arrow:after {
        top:50%;
        right:calc(45% - 4.8rem);
        transform: translateX(-50%);
        transform:rotate(90deg);
    }
    .diag-right{
        margin-top:0;
        display: flex;
        gap:2.8rem;
    }
    .diag-right>div{
        width:calc(50% - 1.4rem);
    }
    .step-no div,
    .step-yes div{
        width:100%;
        margin-bottom: 4.8rem;
    }
    .step-no div:last-child,
    .step-yes div:last-child{
        margin-bottom:0;
    }
    .step-no div:first-child:after, .step-no div:nth-child(2):after, .step-yes div:first-child:after, .step-yes div:nth-child(2):after{
        top:135%;
        left:47.5%;
        transform: translateX(-50%);
        transform:rotate(90deg);
    }
}


/* sub : menu 03 */
/* 맞춤 컨설팅(guide) > 나에게 맞는 프로그램(debt_check) */
.check h2 {
    font-size: var(--fs-lg-30);
    font-weight: 600;
    margin-bottom: 1.5rem;
    text-align: center;
}
.description {
    font-size: var(--fs-xs);
    text-align: center;
    line-height: 3.5rem;
    color: var(--clr-gray);
    /* 세로 중앙 정렬 */
    display: flex;
    justify-content: center;
    align-items: center;
    /* 높이설정 */
    min-height: 10rem;
    padding: 2rem;
    border-bottom: 2px solid var(--clr-gray-bar);
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.08);
}
.check_inner {
    /*width: 90%;*/
    margin: 0 auto 0px;
}
.check_section {
    position: relative;
    /* margin-bottom: 4rem; */ 
}
.check_section h3 {
    padding-left: 40px;
    position: relative;
    font-size: var(--fs-md-20);
    font-weight: 600;
    text-align: left;
    padding: 0 40px 20px;
    margin-top: 80px;
}
.check_section h3::before {
    content: attr(data-step);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 28px;
    height: 28px;
    background-color: var(--clr-blue);
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 100%;
    font-size: var(--fs-xs);
}

/* 25-08-18 */
/* 맞춤 컨설팅(guide) > 나에게 알맞는 프로그램(debt_check) */
/* 시작 페이지 */
.hbox_txt p.font-gyeonggi { margin-bottom: 1.5rem; } 
.hbox_txt p span { display: block; }
.check_section { margin-top: 1rem; }
.check_cont {
    width: 100%;
    padding: 4rem 4rem;
    text-align: center;
    box-sizing: border-box;
    /* background-color: var(--clr-white-dark); */
    border-radius: 4.8rem;
}
.check_cont .check_btn_list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6rem;
    justify-content: center;
}
.check_cont .check_btn_list .check_btn_item {
    width: 57rem;
    aspect-ratio: 1 / 0.25;
    min-height: 15rem;
}
.check_cont .check_btn_list .check_btn_item .check_btn {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    align-content: center;
    background-color: var(--clr-gray-e);
    border-radius: 2rem;
    box-shadow: 0 2rem 4rem rgb(13 14 15 / 10%);
    transition: all 0.4s;
    position: relative;
}
.check_cont .check_btn_list .check_btn_item .check_btn:hover {
    box-shadow: 1rem 2rem 5rem rgb(13 14 15 / 25%);
}
.check_cont .check_btn_list .check_btn_item .check_btn .txt2::after {
    content: url(../img/sub/check/arrow_fff.png);
    position: absolute;
    bottom: 30%;
    left: 24%;
    margin-left:1rem;
    transform: translateX(-50%);
}
.check_cont .check_btn_list .check_btn_item .check_btn_01 {
    background-color: var(--clr-blue);
}
.check_cont .check_btn_list .check_btn_item .check_btn_02 {
    background-color: var(--clr-blue-green);
}
.check_cont .check_btn_list .check_btn_item .check_btn span {
    width: 100%;
    position: absolute;
    top: 23%;
    display: block;
    color: var(--clr-white);
    text-align: left;
    padding: 1rem 2rem;
    transition: all 0.4s;
}
.check_cont .check_btn_list .check_btn_item .check_btn span.txt1 {
    font-family: 'Gyeonggi Title';
    font-size: var(--fs-lg-28);
    font-weight: 600;
    margin-bottom: 2rem;
    padding: 1rem 5rem;
}
.check_cont .check_btn_list .check_btn_item .check_btn span.txt2 {
    font-size: var(--fs-md);
    font-weight: 500;
    margin-top: 4.5rem;
    padding: 1rem 5rem;
}
.check_cont .check_btn_list .check_btn_item .check_btn span.icon {
    position: absolute; 
    top: 50%; 
    right: 3rem;
    transform: translateY(-50%);
    width: 7rem; 
    height: 7rem; 
    border-radius: 0.8rem; 
    border-radius: 1.4rem; 
    background-color: var(--clr-white); 
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain;
    text-indent: -99999rem;
}
.check_cont .check_btn_list .check_btn_item .check_btn:hover span.icon {
    top: 48%; 
}

@media (max-width: 1280px) {
    .check_cont .check_btn_list .check_btn_item { 
       /*  width: 30%;  */
    }
    .check_cont .check_btn_list .check_btn_item .check_btn span.txt1{
    padding: 2.2rem 5rem;
    }
    .check_cont .check_btn_list .check_btn_item .check_btn span.txt2 {
        display: none;
    }
}

@media (max-width: 760px) {
    .check_cont .check_btn_list { 
        gap: 4rem; 
    }
    .check_cont .check_btn_list .check_btn_item { 
        /* width: calc((100% / 2) - 4rem);  */
    }
       .check_cont .check_btn_list .check_btn_item .check_btn span.txt1{
    padding: 2.2rem 5rem;
    }
    .profile-card {
   		 padding: 15rem 2rem 2rem;
    }
}

@media (max-width: 560px) {
    .check_cont .check_btn_list {
        flex-direction: column;
    }
    .check_cont .check_btn_list .check_btn_item { 
        width: 100%;
        height: 12rem;
        aspect-ratio: initial;
    }
    .check_cont .check_btn_list .check_btn_item .check_btn::after {
        content: none;
    }
}

@media (max-width: 476px){
	.check_cont .check_btn_list .check_btn_item .check_btn span.txt1{
		font-size: var(--fs-md-20);
	}
	.check_cont{
		padding: 4rem 0rem;
	}
}

/* 25-08-18 */
/* 맞춤 컨설팅(guide) > 나에게 맞는 프로그램(debt_diagnosis) */
/* 질문 페이지 */
.diagnosis_form {    
    margin: 8rem 0 2rem;
    counter-reset: q1_num;
}
.diagnosis_form > p {
    font-size: var(--fs-xs);
    color: var(--clr-gray);
    margin-bottom: 2rem;
}
.check_section fieldset {
    margin-bottom: 3rem;
    padding: 2rem 4rem;
    background-color: var(--clr-white-dark);
    background-color: #f5f6f8;
    border-radius: 2rem;
}
.diagnosis_form fieldset.hidden, 
.diagnosis_form button.hidden  { 
    display: none;
}
.diagnosis_form fieldset legend.visually-hidden {  
    position: absolute;  
    width: 0.1rem;  
    height: 0.1rem;
    padding: 0;  
    margin: -0.1rem;  
    overflow: hidden;  
    clip: rect(0, 0, 0, 0);  
    white-space: nowrap;  
    border: 0;  
}
.diagnosis_form fieldset .question {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}
.diagnosis_form fieldset .question > span {
    font-size: var(--fs-md-20);
    font-weight: 600;
    text-align: left;
    padding: 0 4rem 0rem;
    flex: 1;
    position: relative;
}
.diagnosis_form fieldset .question > span::before {
    content: "0" counter(q1_num);
    content: counter(q1_num);
    counter-increment: q1_num;
    position: absolute;
    top: 0;
    left: 0;
    width: 2.8rem;
    height: 2.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: var(--fs-xs);
    color: var(--clr-white);
    background-color: var(--clr-blue);
    border-radius: 100%;
}
.diagnosis_form fieldset .question .answers {
    width: 17rem;
}
.diagnosis_form fieldset .question .answers input[type="radio"] {
    display: none;
}
.diagnosis_form fieldset .question .answers label {
    display: inline-block;
    /* padding: 1rem 2rem; */
    width: 7rem;
    height: 7rem;
    line-height: 7rem;
    margin: 0.5rem;
    font-size: var(--fs-xs);
    color: var(--clr-gray-dark);
    color: var(--clr-black);
    text-align: center;
    background-color: var(--clr-white);
    border-radius: 50%;
    box-shadow: 0 1rem 2rem rgb(13 14 15 / 4%);
    cursor: pointer;
    transition: all 0.2s ease;
}
.diagnosis_form fieldset .question .answers input[type="radio"]:checked + label {
    color: var(--clr-white);
    background-color: var(--clr-blue);
}
.diagnosis_form .btn_send {
    margin-top: 8rem;
}

@media (max-width: 1280px) {
    .diagnosis_form fieldset .question > span {
        max-width: calc(100% - 18rem);
    }
}

@media (max-width: 760px) {
    .diagnosis_form fieldset .question { 
        flex-direction: column; 
        gap: 2rem;
    }
    .diagnosis_form fieldset .question > span {
        width: 100%;
        max-width: 100%;
    }
}



/* 25-08-18 */
/* 맞춤 컨설팅(guide) > 나에게 맞는 프로그램(debt_result) */
/* 답변 페이지 */
.answer_cont {
    width: 100%;
    padding: 8rem 4rem 10rem;
    box-sizing: border-box;
    background-color: var(--clr-white-dark);
    border-radius: 4.8rem;
    text-align: center; 
}
.answer_cont h4 {
    font-size: var(--fs-md-20);
    color:#001c3d;
    line-height: 4rem;
}
.answer_cont h4 span { 
    display: block;
    font-size: var(--fs-lg-30); 
    margin-bottom: 4rem;
}
.answer_cont h4 .textBlue {
    color: var(--clr-blue);
}
.answer_cont .answer_txt {
    font-size: var(--fs-md);
    padding: 1rem 0;
}
.answer_cont .answer_btn_list {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 4rem;
    margin-top: 6rem;
}
.answer_cont .answer_btn_list .answer_btn_item {
    width: 32%;
    aspect-ratio: 1 / 0.4;
    min-height: 15rem;
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    justify-content: flex-start;
    align-items: center;
    align-content: center;
    gap: 4rem;
    font-size: var(--fs-lg);
    font-weight: 400;
    color: var(--clr-white);
    text-align: left;
    padding: 4rem 4rem 4rem 6rem;
    background-color: var(--clr-gray-e);
    border-radius: 2rem;
    box-shadow: 0 2rem 4rem rgb(13 14 15 / 10%);    
    transition: all 0.4s;
    position: relative;
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn_01 {
    background-color: var(--clr-blue);
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn_02 {
    background-color: var(--clr-blue-green);
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn:hover {
    box-shadow: 1rem 2rem 5rem rgb(13 14 15 / 25%);
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn .icon {
    display: block;
    width: 7rem;
    height: 7rem;
    /* aspect-ratio: 1 / 1; */
    border-radius: 0.8rem;
    border-radius: 1.4rem;
    background-color: var(--clr-white);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain;
    text-indent: -99999rem;
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn .txt {
    /* min-width: 24rem; */
    font-size: var(--fs-md);
    flex: 1;
}
.answer_cont .answer_btn_list .answer_btn_item .answer_btn .txt b {
    display: block;
    font-family: 'Gyeonggi Title';
    font-size: var(--fs-lg-28);
    font-weight: 500;
    margin-bottom: 1rem;
}

/* 나에게 맞는 프로그램 : icon */
.check_cont .check_btn_list .check_btn_item .check_btn_01 span.icon {
    background-image: url(../img/sub/guide/btn_icon_01.png);
}
.check_cont .check_btn_list .check_btn_item .check_btn_02 span.icon {
    background-image: url(../img/sub/guide/btn_icon_02.png);
}
.answer_cont1 .answer_btn_list .answer_btn_item .answer_btn_01 .icon {
    background-image: url(../img/sub/guide/btn_icon_01.png);
}
.answer_cont1 .answer_btn_list .answer_btn_item .answer_btn_02 .icon {
    background-image: url(../img/sub/guide/btn_icon_02.png);
}
.answer_cont2 .answer_btn_list .answer_btn_item .answer_btn_01 .icon {
    background-image: url(../img/sub/guide/btn_icon_03.png);
}
.answer_cont2 .answer_btn_list .answer_btn_item .answer_btn_02 .icon {
    background-image: url(../img/sub/guide/btn_icon_02.png);
}
.answer_cont3 .answer_btn_list .answer_btn_item .answer_btn_01 .icon {
    background-image: url(../img/sub/guide/btn_icon_03.png);
}
.answer_cont3 .answer_btn_list .answer_btn_item .answer_btn_02 .icon {
    background-image: url(../img/sub/guide/btn_icon_01.png);
}

@media (max-width: 1280px) {
    .answer_cont .answer_btn_list .answer_btn_item {
        width: calc((100% - 4rem) /2);
    }
}

@media (max-width: 1024px) {
    .answer_cont .answer_btn_list .answer_btn_item {
        aspect-ratio: initial;
        height: 22rem;
    }
    .answer_cont .answer_btn_list .answer_btn_item .answer_btn { 
        gap: 2rem;
        padding: 3rem;
    }
}

@media (max-width: 720px) {
    .answer_cont .answer_btn_list { flex-direction: column; }
    .answer_cont .answer_btn_list .answer_btn_item { width: 100%; }
    .answer_cont .answer_btn_list .answer_btn_item .answer_btn { padding: 4rem 6rem; gap: 4rem; }
}

@media (max-width: 460px) {
    .answer_cont .answer_btn_list .answer_btn_item {
        height: auto;
    }
    .answer_cont .answer_btn_list .answer_btn_item .answer_btn {
        flex-direction: column;
    }
    .answer_cont .answer_btn_list .answer_btn_item .answer_btn .txt {
        text-align: center;
    }
}



/* 25-08-18 */
/* 맞춤 컨설팅(guide) > 나에게 맞는 프로그램(debt_result_03) */
/* 답변 페이지 */
.system {
    width: calc(70% + 4rem);
    margin: 8rem auto 12rem;
    display: flex;
    /* flex-wrap: wrap; */
    justify-content: center;
    gap: 4rem;
}
.system .systemTit {
    width: 32%;
    margin: 0 auto;
    font-family: 'Gyeonggi Title';
    font-size: var(--fs-md-20);
    font-weight: 500;
    color: var(--clr-black);
    padding: 2rem;
    background-color: var(--clr-white);
    border: 0.2rem solid var(--clr-gray-e);
    border-radius: 5rem;
}
.system .systemList {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 2rem;
    margin-top: 6rem;
}
.system .systemList .systemItem {
    /* width: 22rem; */
    background-color: var(--clr-white);
    border: 0.2rem solid var(--clr-gray-e);
    flex: 1;
    border-radius: 1.4rem;
}
.system .systemList .systemItem .term {
    width: 100%;
    min-height: 6rem;
    padding: 2rem 1.5rem;
    font-size: var(--fs-md);
    font-weight: 500;
    color: var(--clr-white);
    text-align: center;
    background-color: var(--clr-gray-dark);
    border: 0.2rem solid var(--clr-gray-dark);
    border-radius: 1.4rem 1.4rem 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.system .systemList .systemItem .details {
    width: 100%;
    min-height: 10rem;
    padding: 1.5rem 1.5rem;
    font-size: var(--fs-xs);
    /*
    background-color: var(--clr-white);
    border: 0.2rem solid var(--clr-gray-e);
    */
}
.system .ccrs .systemList .systemItem .term {
    background-color: var(--clr-navy);
    border: 0.2rem solid var(--clr-navy);
}
.system .scourt .systemList .systemItem .term {
    background-color: var(--clr-blue-dark);
    border: 0.2rem solid var(--clr-blue-dark);
    background-color: var(--clr-blue-Medium);
    border: 0.2rem solid var(--clr-blue-Medium);
}

/* line */
.system .systemTit, 
.system .systemList, 
.system .systemList .systemItem {
    position: relative;
}
.system .systemTit::after,
.system .systemList::after,
.system .systemList .systemItem::after {
    content: '';
    position: absolute;
    border: 0.1rem solid var(--clr-gray-c);
}
.system .systemTit::after {
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 3rem;
}
.system .systemList::after {
    bottom: calc((100% + 3rem));
}
.system .ccrs .systemList::after {
    width: calc((100% - 4rem) / 3 / 2 + 2rem + (100% - 4rem) / 3 + 2rem + (100% - 4rem) / 3 / 2);
}
.system .scourt .systemList::after {
    width: calc(50% + 1rem);
}
.system .systemList .systemItem::after {
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 3.2rem;
    border-style: dashed;
}

@media (max-width: 1280px) {
    .system { width: 100%; }
}

@media (max-width: 1024px) {
    .system { width: 90%; flex-direction: column; }
}

@media (max-width: 560px) {
    .system { gap: 6rem; }
    .system .systemList { 
        flex-direction: column; 
        margin-top: 1rem; 
        gap: 1rem;
    }
    .system .systemTit { 
        width: 100%; 
        border-width: 0.3rem;
        color: var(--clr-white);
        background-color: var(--clr-blue-dark);
        border-color: var(--clr-blue-dark);
    }
    .system .ccrs .systemList .systemItem .term, 
    .system .scourt .systemList .systemItem .term {
        min-height: auto;
        padding: 2rem 2rem;
        color: var(--clr-navy);
        background-color: var(--clr-gray-bar);
        border-color: transparent;
        border-radius: 0;
    }
    
    .system .systemList .systemItem .details {
        min-height: auto;
        padding: 3rem 2rem;
    }
    .system .systemList .systemItem { border-radius: 0; }
    
    .system .systemTit::after,
    .system .systemList::after,
    .system .systemList .systemItem::after { content: none; }
}



.button-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.check_button {
    flex: 1 1 13%;
    min-width: 100px;
    padding: 10px;
    border-radius: 5px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: var(--fs-md);
    height: 50px;
    border: 2px solid var(--clr-blue);
}
.check_button:hover {
    background-color: var(--clr-blue);
    color: var(--clr-blue-light);
    font-weight: 600;
}
.check_input-wrap {
    margin-top: 10px;
}
.check_input-wrap input[type='text'] {
    width: 100%;
    padding: 12px;
    border-radius: 5px;
    font-size: 1.6rem;
    border: 2px solid var(--clr-gray-dark);
}
.btn_send {
    display: block;
    font-size: var(--fs-md-20);
    line-height: 70px;
    color: #fff;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    width: 28rem;
    height: 70px;
    border-radius: 4rem;
    background-color: #001c3d;
}
.btn_send::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1777fe;
    transform: translateY(-100%);
    transition: transform 0.4s ease;
    z-index: 0;
}
.btn_send:hover::before {
    transform: translateY(0);
}
.btn_send:hover {
    color: #fff;
}
.btn_send span {
    position: relative;
    z-index: 1;
}



/* sub : menu 03 */
/* 상담센터(help) > 자주 묻는 질문(FAQ) */
.faq-inner {
    width: 90%;
    margin: 0 auto;
}
.faq-item {
    background: #f5f6f8;
    border-radius: 20px;
    margin-bottom: 1.6rem;
    overflow: hidden;
    font-size: var(--fs-md-20);
    padding: 2.8rem 0 0 0;
}
.faq-question {
    margin-bottom: 2.8rem;
    padding: 0 4rem 0 8.2rem;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    position: relative;
    text-align: left;
}
.faq-question > span:nth-child(1)::before {
    content: 'Q';
    width: 28px;
    height: 28px;
    background-color: var(--clr-blue-Medium);
    position: absolute;
    left: 4rem;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 100px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 71px;
    color: #555;
    background: #f5f6f8;
    font-size: var(--fs-xs);
    transition: max-height 0.4s ease, padding 0.3s ease;
    text-align: left;
    position: relative;
}
.faq-answer span {
    display: block;
    position: relative;
    padding:2.8rem 0 2.8rem 4.2rem;
    font-size: var(--fs-md);
    color:#61676e;
    line-height: 2.6rem;
    white-space: pre-line;
}
.faq-answer span::before {
    content: 'A';
    width: 28px;
    height: 28px;
    background-color: #61676e;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 100px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
}
.faq-item.active .faq-answer {
    padding: 0 4rem 0 0rem;
    margin-bottom: 20px;
    border-top: 1px solid var(--clr-gray-d);
    margin:0 4rem;
}
.faq-icon {
    font-weight: normal;
    transition: transform 0.3s ease;
}
.faq-item.active .faq-icon {
    transform: rotate(180deg);
}
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
    margin-top: 2rem;
}
.page-btn {
    border: none;
    background: none;
   font-size: var(--fs-xs);
    font-size: var(--fs-xs);
    cursor: pointer;
    padding: 1rem 1.6rem;
    border-radius: 100px;
}
.page-btn.active {
    background: var(--clr-black);
    color: var(--clr-white);
}

@media (max-width: 400px) {
    .check_button {
        flex: 1 1 100%;
    }
}

@media (max-width: 480px) {
    .subhead .lnb ul {
        flex-direction: column; /* 세로로 배치 */
        height: auto;
        line-height: normal;
        width: 100%;
    }
    .subhead .lnb ul li {
        flex: none;
        width: 100%;
        border-bottom: 0.1rem solid #ccc;
    }
    .insa-wrap {
        padding: 2rem 3.5rem;
    }
    .insa-inner {
        gap: 20rem;
    }
    .insa-text h2 {
        font-size: 2rem !important;
    }
    .insa-text h2 strong {
        font-size: 2rem !important;
    }
    .rl-support .rl_txt {
        padding: 2rem 2rem;
    }
}

@media (max-width: 600px) {
    .profile-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
        flex-wrap: wrap;
    }
    .profile-grid {
        grid-template-columns: 1fr;
    }
    .profile-info ul {
        padding-left: 0;
        list-style: none;
    }
    .check_button {
        flex: 1 1 45%;
    }
    .faq-question {
        font-size: 1.8rem;
    }
}

@media (max-width: 768px) {
    .faq-inner {
        width:100%;
    }
    .faq-icon> img{ 
        width:11px;
        height:6px;
    }
    .faq-item{
        font-size: var(--fs-md);
    }
    .faq-question {
        margin-bottom: 2.8rem;
        padding: 0 2.8rem 0 8rem;
    }
    .faq-question > span:nth-child(1)::before {
        width: 28px;
        height: 28px;
        left: 4rem;
    }
    .faq-item.active .faq-answer {
        padding: 0 2.8rem 0 0;
    }
    .subhead .lnb ul {
        height: auto;
        line-height: 50px;
    }
    .subhead .lnb ul li {
        font-size: 1.8rem;
    }
    .insa-text h2 {
        font-size: var(--fs-lg-28);
    }
    .insa-text h2 strong {
        font-size: var(--fs-lg-30);
    }
    .insa-content p {
        font-size: 1.8rem;
    }
    .profile-grid {
        grid-template-columns: repeat(1, 1fr) !important;
        gap: 20px;
    }
    .profile-grid .director:nth-child(2) {
        margin-top: 20%;
    }
    .auditor-card {
        max-width: 100% !important;
    }
    .auditor-card > .profile-grid {
        justify-items: normal;
    }
    .rl-card-wrap {
        grid-template-columns: 1fr;
    }
    .rl-step-wrap {
        flex-direction: column;
        gap: 15px;
        align-items: stretch; /* 자식이 부모 너비 꽉 차도록 */
    }
    .rl-arrow::before {
        content: '↓';
    }
}

@media (max-width: 992px) {
    .profile-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
    .auditor-card > .profile-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .director.purple {
        margin-top: 20%;
    }
}

@media (max-width: 1024px) {
    .insa-inner {
        flex-direction: column;
        align-items: center;
    }
    .insa-text h2 {
        letter-spacing: -1.5px;
    }
    .insa-text h2 strong {
    }
}

/* scrolla에서 애니메이션 적용 시 */
.motion .insa-inner .insa-img {
    animation-name: motion;
    animation-duration: 1s;
    animation-fill-mode: both;
}
.motion .insa-inner .insa-text h2 {
    animation-name: motion;
    animation-duration: 1.5s;
    animation-fill-mode: both;
}
.motion .insa-inner .insa-text .insa-content {
    animation-name: motion;
    animation-duration: 2s;
    animation-fill-mode: both;
}
.chairman.motion > img {
    animation-name: motion;
    animation-duration: 2.2s;
    animation-fill-mode: both;
}
.chairman.motion > .profile-info {
    animation-name: motion;
    animation-duration: 2.5s;
    animation-fill-mode: both;
}
.isa.motion > h2 {
    animation-name: motion;
    animation-duration: 2.7s;
    animation-fill-mode: both;
}
.isa.motion > .profile-grid .profile-card:nth-child(1) {
    animation-name: motion;
    animation-duration: 3s;
    animation-fill-mode: both;
}
.isa.motion > .profile-grid .profile-card:nth-child(2) {
    animation-name: motion;
    animation-duration: 3.2s;
    animation-fill-mode: both;
}
.isa.motion > .profile-grid .profile-card:nth-child(3) {
    animation-name: motion;
    animation-duration: 3.5s;
    animation-fill-mode: both;
}
.auditor-card.motion > h2 {
    animation-name: motion;
    animation-duration: 3.7s;
    animation-fill-mode: both;
}
.auditor-card.motion > .profile-grid {
    animation-name: motion;
    animation-duration: 4s;
    animation-fill-mode: both;
}
.rl-support.motion > h2:nth-child(1) {
    animation-name: motion;
    animation-duration: 1s;
    animation-fill-mode: both;
}
.rl-support.motion > p {
  animation-name: motion;
  animation-duration: 1.5s;
  animation-fill-mode: both;
}
.rl-support.motion > p {
    animation-name: motion;
    animation-duration: 1.5s;
    animation-fill-mode: both;
}
.rl-support.motion > h2:nth-child(3) {
    animation-name: motion;
    animation-duration: 1.8s;
    animation-fill-mode: both;
}
.rl-support.motion .rl-card-wrap {
    animation-name: motion;
    animation-duration: 2.2s;
    animation-fill-mode: both;
}
.rl-support.motion > h2:nth-child(6) {
    animation-name: motion;
    animation-duration: 2.5s;
    animation-fill-mode: both;
}
.rl-support.motion .rl-step-wrap {
    animation-name: motion;
    animation-duration: 3s;
    animation-fill-mode: both;
}
@keyframes motion {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}



/* sub : menu 02 */
/* 채권조회(check) > 심사 및 소각조회 (certify) */
.certify-step h4 {
    font-size: var(--fs-md-20);
    line-height: 4rem;
    color:#001c3d;
}
.certify-step h4 span {
    font-size: var(--fs-lg-30);
}
.certify-step ul{
    display: flex;
    justify-content: center;
    padding: 3.4rem 0 5.2rem 0;
}
.certify-step ul li {
    position: relative;
    font-size: 2.4rem;
    color:#fff;
    line-height: 4rem;
    width: 4rem;
    height: 4rem;
    border-radius: 4rem;
    margin-right: 5.2rem;
}
.certify-step-on {
    background-color: #001c3d;
    background-color: var(--clr-navy);
}
.certify-step-off{
    background-color:#ccc;
}
.certify-step ul li:after{
    position: absolute;
    top:1.8rem;
    left:5.5rem;
    content: '';
    display: block;
    width:22px;
    height:4px;
}
.certify-step-on:after{
    background-image: url(../img/sub/check/stepLine_on.png);
}
.certify-step-off:after{
    background-image: url(../img/sub/check/stepLine_off.png);
}
.certify-step ul li:last-child{
    margin-right: 0;
}
.certify-step ul li:last-child:after{
    display: none;
}
.certify-wrap{
    /*
    margin-top:16rem;
    */
    width:100%;
    padding: 5.5rem 0;
    text-align: center;
    box-sizing: border-box;
    background-color:#f5f5f5;
    border-radius: 4.8rem;
}
.certify-wrap h2{
	font-family: 'Gyeonggi Title';
	font-size:var(--fs-xl);
	font-weight:bold;
	padding-bottom:50px;
	box-sizing:border-box;
}
.certify-wrap p{
	font-size:var(--fs-md);
	line-height:1.5;
}
.certify_box{
    margin: 0 auto;
    width:990px;
    /*
    height:280px;
    */
}
.certify_box:after{
    content: '';
    display: block;
    clear: both;
}
.id_phone h3,
.id_sns h3{
    position: relative;
    font-size: 2.4rem;
}
.id_phone h3{
    color:#fff;
}
.id_sns h3{
    text-align: left;
    margin-left:5.2rem;
}
.id_phone h3:after{
    content: "";
    position: absolute;
    top: 650%;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 5px;
    background: url(../img/sub/check/arrow_fff.png);
    transition: all 0.3s;
}
.id_sns h3:after{
    content: "";
    position: absolute;
    top: 50%;
    right: 79%;
    transform: translateY(-50%);
    width: 20px;
    height: 5px;
    background: url(../img/sub/check/arrow_000.png);
    transition: all 0.3s;
}
.id_phone,
.id_sns{
    height:100%;
    height:280px;
    padding-top:5.8rem;
    box-shadow: 0rem 2rem 4rem rgba(13, 14, 15, 0.10);
    border-radius: 2.8rem;
}
.id_phone{
    float:left;
    width:220px;
    background-color:var(--clr-blue-Medium);
    cursor: pointer;
}
.id_phone img{
    margin-top: 3.8rem;
}
.id_sns{
    float:right;
    width:740px;
    background-color:#fff;
}
.id_sns ul{
    margin: 0 auto;
    width: 90%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 3.8rem;
}
.id_sns ul li{
    flex-grow: 1;
}
.id_sns ul li a img {
    display: block;
    box-shadow: 0rem 1rem 3rem rgba(13, 14, 15, 0.15);
    border-radius: 1.4rem;
    margin: 0 auto 1rem;
}
.id_sns ul li a span{
    display: block;
    font-size:1.6rem;
    line-height: 2rem;
    color:#111;
    opacity: 0.75;
}

@media screen and (max-width: 1024px) {
    .certify-wrap{
        padding:4.4rem 2rem 14.2rem 2rem;
        padding:4.4rem 2rem;
    }
    .certify_box{
        width:100%;
    }
    .id_phone h3,
    .id_sns h3{
        font-size: 2.2rem;
    }
    .id_sns h3{
        margin-left:4.8rem;
    }
    .id_phone,
    .id_sns{
        height:100%;
        height: 28rem;
        padding-top:5.8rem;
        box-shadow: 0rem 2rem 4rem rgba(13, 14, 15, 0.10);
        border-radius: 2.8rem;
    }
    .id_phone{
        width:calc(25.26% - 28px);
    }
    .id_sns{
        width:74.74%;
    }
    .id_sns ul{
        gap:0 0rem;
    }
}

@media screen and (max-width: 798px) {
    .id_sns h3{
        margin-left:0;
        text-align: center;
        margin-right:10%;
    }
    .id_phone{
        width:calc(35.26% - 28px);
    }
    .id_sns{
        width:64.74%;
    }
    .id_sns h3:after{
        right: 32%;
    }
    .id_sns ul li { 
        width: 16.666%; 
        flex-grow: initial;
    }
    .id_phone img,
    .id_sns ul li a img{
        width:52px;
    }
    .id_sns ul li a span{
        font-size:1.6rem;
        line-height: 2rem;
    }
}

@media screen and (max-width: 640px) {
    .certify-step h4{
        font-size: 1.8rem;
        line-height: 3.4rem;
    }
    .certify-step h4 span{
        font-size: 2.4rem;
    }
    .certify-step ul{
        padding:2rem 0 3rem 0;
    }
    .certify-step ul li{
        font-size: 2.2rem;
        line-height: 3.4rem;
        width:3.4rem;
        height:3.4rem;
        margin-right: 4.2rem;
    }
    .certify-step ul li:after{
        top:1.4rem;
        left:4.4rem;
    }
    .certify-wrap{
        padding:4.4rem 2rem 38.2rem 2rem;
        padding: 4.4rem 2rem;
        border-radius: 2.8rem;
    }
    .id_phone,
    .id_sns{
        width:100%;
    }
    .id_phone{
        margin-bottom: 28px;
    }
    .id_sns{
        height: auto;
        min-height: 28rem;
        margin-bottom: 8rem;
        padding-bottom: 5.8rem;
    }
    .id_sns h3{
        margin-right:0;
    }
    .id_sns h3:after{
        display: none;
    }
    .id_sns ul {
        gap: 2rem 1rem;
    }
    .id_sns ul li { 
        width: 30%;
    }
}

@media screen and (max-width: 420px) {
	.id_sns ul li {
		width: 40%;
	}
    .id_sns ul li a span{
        font-size:1.6rem;
        line-height: 2rem;
    }
}



/* sub : menu 04 */
/* 상담센터(help) > 상담센터안내(info) */
.tabs {
    margin-top: 1rem;
    /* padding-bottom: 4rem; */
    background-color: #ffffff;
    width: 100%;
}

/* 탭 스타일 */
.tab_item {
    width: calc(100%/5);
    min-width:268px;
    height: 6.8rem;
    border-radius: 20px 20px 0 0;
    background-color: #fff;
    line-height: 6.8rem;
    font-size: 2rem;
    text-align: center;
    color: var(--clr-gray);
    display: block;
    float: left;
    text-align: center;
    font-weight: 600;
    transition: all 0.2s ease;
    cursor: pointer;
}
.tab_item:hover {
    color:#1777fe;
}

/* 라디오 버튼 UI삭제*/
input[name="tab_item"] {
    display: none;
}

/* 탭 컨텐츠 스타일 */
.tab_content {
    display: none;
    padding: 60px 80px;
    background-color: #f5f6f8;
    border-radius: 0 0 28px 28px;
    clear: both;
}
/* 선택 된 탭 콘텐츠를 표시 */
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
    display: block;
}
/* 선택된 탭 스타일 */
.tabs input:checked + .tab_item {
    background-color: #f5f6f8;
    color: #111;
}
.search_center{
    height:68px;
    display: flex;
}
.search_center li{
    background-color:#fff;
    border-radius: 20px;
    font-size:1.8rem;
    line-height:58px;
}
.search_select{
    width:340px;
}
.search_select select,
.search_input input{
    width:100%;
    height:100%;
    border-radius: 20px;
    padding-left:32px;
    box-shadow: 0rem 1rem 3rem rgba(13, 14, 15, 0.10);
}
.b_sel{
    background: url(../img/sub/help/arrow.png) #fff no-repeat;
    -webkit-appearance: none;
    appearance: none;
    background-position: center right 32px;
}
.search_input{
    position: relative;
    margin-left:2.8rem;
    width:70.32%;
}
.search_input input{
    padding-right:8rem;
}
.search_input button{
    position: absolute;
    top:21px;
    right:30px;
}
.center_area{
    margin-top:4rem;
    width:100%;
    display: flex;
    flex-direction: row-reverse;
}
.center_area>div{
    background-color:#fff;
    height:458px;
    border-radius: 20px;
    box-shadow: 0rem 1rem 3rem rgba(13, 14, 15, 0.10);
}
.center_list {
    width:calc(50% - 14px);
    margin-right: 2.8rem;
    padding:28px 32px;
}
.center_list ul{
    max-height: 380px;
    overflow-y: auto;
}
.center_list ul li{
    padding: 20px 0;
    width: 100%;
    border-bottom: 1px solid #ddd;
}
.center_list li p:first-child {
    max-width: 22%;
    padding:0 20px;
}
.center_list li p:nth-child(2) {
    max-width: 22%;
    font-size: 1.8rem;
    font-weight: 600;
}
.center_list li p:nth-child(2) span {
    font-size: 1.6rem;
    line-height: 3rem;
    font-weight: 500;
    color: var(--clr-gray);
}
.center_list li p {
    display: table-cell;
    vertical-align: middle;
}
.center_detail{
    width:calc(50% - 14px);
}
.center_detail:hover .center_info p{
    background-color:#1777fe;
    transition: all 0.2s;
}
.center_detail:hover .center_info p a{
    color:#fff;
    font-weight:bold;
}
.center_info {
    position: relative;
    text-align: left;
    padding: 30px;
}
.center_info ul {
    display: flex;
    flex-wrap: wrap;
}
.center_info ul li:first-child {
    width: 100%;
}
.center_info ul li{
    position: relative;
    width: 40%;
    padding-left: 40px;
    font-size: 1.8rem;
    color: #909090;
    margin-top: 16px;
}
.center_info ul li:after{
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width:30px;
    height:30px;
}
.map_area {
    position: relative;
    width: 100%;
    height: 270px;
    overflow: hidden;
    border-radius: 20px 20px 0 0;
    background: url(../img/sub/help/map.png) no-repeat center;
}
.map_area img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.center_info {
    position: relative;
    text-align: left;
    padding: 30px;
}
.center_info h3 {
    font-size: 2.1rem;
    font-weight: 600;
}
.center_info p {
    position: absolute;
    right: 30px;
    top: 20px;
    font-size: 1.8rem;
    padding:14px 18px;
    border-radius: 20px;
    background-color:#efefef;
}
.center_info p a{
    display:block;
}
.center_info ul li:nth-child(1):after {
    background: url(../img/sub/help/info_icon01.png);
}
.center_info ul li:nth-child(2):after {
    background: url(../img/sub/help/info_icon02.png);
}
.center_info ul li:nth-child(3):after {
    background: url(../img/sub/help/info_icon03.png);
}

@media screen and (max-width: 1240px) {
    .center_area{
        flex-direction: row;
        display: block;
    }
    .center_area>div{
        width:100%;
        height:auto;
    }
    .center_list {
        margin-top:28px;
        margin-right:0;
    }
    /*
    .map_area {
        background-image:  url(../img/sub/help/map.png);
        background-size: cover;
    }
    */ 
    .map_area img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@media screen and (max-width: 798px) {
    .search_select{
        width:30%;
        min-width:220px;
    }
    .search_select select,
    .search_input input{
        padding-left:28px;
    }
    .b_sel{
        background-position: center right 28px;
    }
    .search_input{
        width:70%;
    }
    .certify-wrap img{
    max-width:40%}
}

@media screen and (max-width: 798px) {
    .search_select{
        width:30%;
    }
    .search_input{
        width:70%;
    }
}

@media screen and (max-width: 680px) {
    .tab_item {
        width: calc(100%/2);
        min-width:200px;
        height: 6.2rem;
        line-height: 6.2rem;
        font-size: 1.8rem;
    }
    .tab_content {
        padding: 4.8rem 2.8rem;
    }
        .search_center{
        display: block;
        height:auto;
    }
    .search_input {
        margin-left:0;
    }
    .search_select{
        width:100%;
        height:68px;
        margin-bottom:1.4rem;
    }
    .search_input{
        width:100%;
        height:68px;
    }
    .center_info ul li:first-child {
        margin-top:2.8rem;
    }
    .center_info ul li{
        width: 100%;
    }
}

@media screen and (max-width: 480px) {
    .tab_item {
        width: 100%;
        height: 6.2rem;
        line-height: 6.2rem;
        border-radius: 0;
        border: 0.2rem solid var(--clr-gray-d);
        font-size: 1.8rem;
        margin-bottom: 1rem;
    }
    .tab_item:last-of-type {
    	margin-bottom: 1rem;
    }
    .tabs input:checked + .tab_item {
    	/*
    	color: var(--clr-blue);
        border-color: var(--clr-blue);
    	*/
    	border-color: var(--clr-black);
        background-color: var(--clr-white);
    }
    .map_area {
        height: 20rem;
    } 
    .center_info{
        padding: 2rem;
    }
    .center_info p {
        display: none;
    }
    .center_info h3{
        text-align: center;
        font-size: 2rem;
    }
    .center_info ul li:first-child {
        margin-top: 1.8rem;
    }
    .center_info ul li {
        font-size: 1.6rem;
    }
    .center_list {
        padding: 2rem;
    }
    .center_list li p:nth-child(2) {
        line-height: 2.8rem;
    }
}



/* sub : menu 04 */
/* 상담센터(help) > 상담 신청 (apply) */
.sub_hbox{
	/* margin-top: 9rem; */
    width: 100%;
    background-color: #f4f6fd;
    border-radius: 28px;
    padding: 48px 68px;
    display: flex;
}
.hbox_icon {
    width: 140px;
    margin-right: 4rem;
    display: flex;
    align-items: center;
}
.hbox_icon img {
    margin: 0 auto;
}
.hbox_txtin {
	padding: 30px 15px 30px 64px;
	padding: 3rem 4rem;
    border-radius: 16px;
    background: #f5f5f5;
}
.hbox_txt p {
    text-align: left;
    font-size:2.4rem;
    line-height: 2.4rem;
    color:#000e1f;
}
/* .hbox_txt p:first-child{
    margin-bottom: 2rem;
} */
.hbox_txt p span{
    font-size:1.8rem;
    opacity: 0.75;
}
.hbox_txt .hbox_list {
    padding: 1rem 0;
}
.hbox_txt .hbox_list li {
    font-size: 1.6rem;
    padding: 0.5rem 1rem;
    color: #000e1f;
    position: relative;
}
.hbox_txt .hbox_list li.bullet {
    padding: 0.2rem 2.5rem;
}
.hbox_txt .hbox_list li.bullet::before {
    content: '';
    position: absolute;
    top: 1.2rem;
    left: 1rem;
    width: 0.4rem;
    height: 0.1rem;
    background-color: #000e1f;
}
.apply_list,
.apply_input{
    margin-top:8rem;
    text-align: center;
}
.apply_input{
    margin-bottom: 20rem;
}
.app_form>p,
.input_form>p{
    float:left;
    font-size: 2.4rem;
    color:#000e1f;
    margin-bottom: 2.2rem;
}
.app_form fieldset{
    float:right;
}
.app_total li{
    font-size: 1.8rem;
    float:left;
    margin-right:4px;
}
.app_count{
    color:#1777fe;
}
.app_form:after,
.input_form:after{
    content: '';
    display: block;
    clear: both;
}
.apply_table,
.input_form_tit{
    border-top:2px solid #000e1f;
}
.apply_table table {
    width:100%;
}
.apply_table table thead tr{
    height:64px;
    background-color:#f4f6fd;
    font-size: 2rem;
    color:#222;
    line-height:64px;
}
.apply_table table thead tr th:nth-child(1){
    width:16%;
}
.apply_table table thead tr th:nth-child(2){
    width:35%;
}
.apply_table table thead tr th:nth-child(3){
    width:17%;
}
.apply_table table thead tr th:nth-child(4){
    width:15%;
}
.apply_table table thead tr th:nth-child(5){
    width:17%;
}
.table-no-list{
    font-size: 1.8rem;
    line-height:88px;
    color:#000e1f;
    text-align: center;
    opacity:0.5;
    height:88px;
    border-bottom: 1px solid #ddd;
}
.input_form_group{
    display:flex;
    height:6.4rem;
    text-align:left;
    line-height: 6.4rem;
    margin-bottom: 2.4rem;
}
.input_form_left{
    font-size: 2rem;
    width:19.5%;
    padding:0 5rem 0 6px;
}
.input_form_right{
    width:80.5%;
    padding-right:8rem;
}
.input_form_right>input,
.input_form_right>textarea,
.phone_input_list>li>select,
.phone_input_list>li>input{
    border:1px solid #ddd;
    border-radius:2.8rem;
}
.radio_check_right label {
    font-size: 2rem;
}
.radio_check_right label input{
    margin-right:1.6rem;
    width:16px;
    height:16px;
}
.tit_input_right input{
    font-size: 1.8rem;
    width:100%;
    height:64px;
    padding:0 30px;
}
.txtarea{
    height:350px;
}
.txtarea_right textarea{
    font-size: 1.8rem;
    width:100%;
    height:350px;
    padding:30px;
}
.phone_input_list{
    display: flex;
}
.phone_input_list li{
    position: relative;
    margin-right:24px;
}
.phone_input_list li:after{
    position: absolute;
    font-size:1.8rem;
    opacity: 0.5;
    content:'-';
    display: block;
    top:0px;
    right:-18px;
}
.phone_input_list li:last-child:after{
    display: none;
}
.phone_input_list li select,
.phone_input_list li input{
    height:64px;
    font-size: 1.8rem;
    padding:0 30px;
}
.phone_input_list li select{
    width:158px;
}
.phone_input_list li input{
    width:120px;
}
.add_file_right{
    height:118px;
}
.add_file_right p{
    font-size:1.8rem;
    color:#000e1f;
    opacity: 0.5;
}
.add_file_right a{
    width:100px;
    line-height: 48px;
    font-size: 1.8rem;
    color:#222;
    font-weight:600;
    background-color: #efefef;
    padding:0 18px;
    border-radius:2rem;
}
.apply_btn {
    margin-top:102px;
    width:100%;
    height:70px;
}
.apply_btn a {
    font-size:2rem;
    line-height: 70px;
    color:#fff;
    width:28rem;
    height:70px;
    border-radius:4rem;
    background-color: #001c3d;
}
.apply_btn a:hover{
    background-color:#1777fe;
}

@media screen and (max-width: 1024px) {
    .sub_hbox {
        margin: 0rem auto;
        padding: 48px 48px;
    }
    .apply_table table thead tr,
    .radio_check_right label{
    font-size: 1.8rem;
    }
        .table-no-list {
        font-size: 1.6rem;
    }
    .input_form_left {
        font-size: 1.8rem;
        width: 20%;
        padding: 0 2rem 0 2rem;
    }
    .input_form_right {
        width: 80%;
        padding-right: 4rem;
    }
    .tit_input_right input,
    .phone_input_list li select,
    .phone_input_list li input {
        font-size: 1.6rem;
        height: 60px;
    }
    .add_file_right a {
        font-size: 1.6rem;
        text-align: center;
    }
    .txtarea {
        height: 280px;
    }
    .txtarea_right textarea {
        font-size: 1.6rem;
        height: 280px;
    }
    .add_file_right p {
        font-size: 1.6rem;
    }
    .apply_btn a {
        font-size: 1.8rem;
        line-height: 60px;
        width: 22rem;
        height: 60px;  
    }
}

@media screen and (max-width: 680px) {
    .sub_hbox {
        padding: 28px 28px;
    }
    .hbox_icon {
        width: 128px;
        margin-right: 2.8rem;
        display: flex;
        align-items: center;
    }
    .hbox_icon>img{
    }
    .hbox_txt p,
    .app_form>p,
    .input_form>p {
        font-size: 2.2rem;
        line-height: 2.2rem;
    }
    .hbox_txt p:first-child {
        margin-bottom: 2rem;
    }
    .hbox_txt p span {
        font-size: 1.8rem;
    }
    .apply_table table thead tr,
    .radio_check_right label{
    	font-size: 1.8rem;
    }
    .table-no-list {
    	font-size: 1.6rem;
    }
    .input_form_left {
        font-size: 1.8rem;
        width: 20%;
        padding: 0 2rem 0 2rem;
    }
    .input_form_right {
        width: 80%;
        padding-right: 4rem;
    }
    .tit_input_right input,
    .phone_input_list li select,
    .phone_input_list li input {
        font-size: 1.6rem;
        height: 60px;
    }
    .add_file_right a {
        font-size: 1.6rem;
        text-align: center;
    }
    .txtarea {
        height: 280px;
    }
    .txtarea_right textarea {
        font-size: 1.6rem;
        height: 280px;
    }
    .add_file_right p {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }
    .apply_btn a {
        font-size: 1.8rem;
        line-height: 60px;
        width: 22rem;
        height: 60px;  
    }
}

@media screen and (max-width: 480px) {
    .sub_hbox{
        display: block;
    }
    .hbox_icon,
    .hbox_txt{
        width:100%;
        margin-right:0;
        display: block;
    }
    .hbox_icon img{
        display: block;
        margin: 0 auto;
    }
    .hbox_txt p:first-child {
        margin:1.8rem 0;
    }
    .hbox_txt p {
        text-align: center;
    }
    .tit_input_right input,
    .phone_input_list li select,
    .phone_input_list li input {
        font-size: 1.4rem;
        height: 48px;
    }
    .txtarea {
        height: 200px;
    }
    .txtarea_right textarea {
        font-size: 1.4rem;
        height: 200px;
    }  
    .phone_input_list li {
        margin-right: 12px;
        width:100%;
    }
    .phone_input_list li:last-child {
        margin-right:0;
    }
    .phone_input_list li:after {
        font-size: 1.4rem;
        right: -10px;
    }
    .phone_input_list li select {
        width:100%;
        min-width:88px;
    }
    .phone_input_list li input {
        width:100%;
    }
    .phone_input_list li select, .phone_input_list li input {
        padding: 0 20px;
    }    
    .apply_table table thead tr,
    .radio_check_right label,
    .input_form_left {
        font-size: 1.6rem;
    }
    .input_form_left {
        padding: 0 2rem 0 0;
    }
    .input_form_right {
        width: 80%;
        padding-right:0
    }   
    .add_file_right a {
        font-size: 1.4rem;
    }
}

@media screen and (max-width: 420px){
    .phone_input_list li:first-child,
    .phone_input_list li:nth-child(2),
    .phone_input_list li:nth-child(3){
        width:100%;    
    }
}


/*2025-08-29 나에게 알맞은 프로그램 tabindex 웹접근성 추가 시작*/
.diagnosis_form input[type="radio"]{
	display : inline-block !important;
	position : absolute !important;
	width : 1px !important;
	height : 1px !important;
	margin : 0 !important;
	padding : !important;
	opacity : 0 !important;
	pointer-events : none;
}

.diagnosis_form input[type="radio"]:focus-visible + label, .diagnosis_form label:has(input[type="radio"]:focus-visible){
	outline : 2px solid #b6bf3;
	outline-offset : 3px;
	border-radius: 8px;	
}
/*2025-08-29 나에게 알맞은 프로그램 tabindex 웹접근성 추가 끝 */

/* 2025-09-01 pc-br 클래스 : 데스크톱에서는 br이 적용되지만, 모바일에서는 br이 적용되지 않게하여, 띄워쓰기 관련 문제가 발생하지 않게 조치 시작 */

.pc-br { display: none; }
@media ( min-width : 1024px ){
	.pc-br { display: inline; }
}

.wrapping-word { white-space : nowrap; }


/* 2025-09-01 pc-br 클래스 : 데스크톱에서는 br이 적용되지만, 모바일에서는 br이 적용되지 않게하여, 띄워쓰기 관련 문제가 발생하지 않게 조치 끝*/



/* 25-09-09 채무현황 조회 페이지 추가 */
/*25-09-26 채무현황 조회 중간설명 도입에 따라 추가*/
.debt-status {
	margin-top : 6rem;
}

.debt-status h2 {
    font-family: 'Gyeonggi Title';
    font-weight: 500;
    font-size: var(--fs-lg-32);
    text-align: left;
    margin-bottom: 6rem;
}
.debt-guide h3 {
    font-size: 2.5rem;
    font-weight: 500;
    margin-bottom: 2rem;
}
.debt-guide .guideList {
	counter-reset: item;
    width: 100%;
    padding: 4rem;
    box-sizing: border-box;
    background-color: #f7f7f7;
    border-radius: 1.8rem;
    margin-bottom: 4rem;
}
.debt-guide .guideList li {
	list-style-type: none; 
	counter-increment: item; 
    position: relative;
	font-size: var(--fs-md);
    color: #61676e;
    color: var(--clr-gray-dark);
    line-height: 1.5;
    padding-left: 2rem;
    padding-bottom: 2rem;
}
.debt-guide .guideList li:last-of-type { 
    padding-bottom: 0; 
}
.debt-guide .guideList li:before {
	content: counter(item) ". "; 
    position: absolute;
    left: 0;
    top: 0;
}
.debt-guide .guideList li span { 
    display: block; 
}
.debt-guide .guideList li span.textBlue {
    color: var(--clr-blue);
}

/* btn */
.debt-status-btn {
	/*
	display: flex;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    gap: 4rem;
    */
    }
.debt-status-btn .statusBtn {
    width: 60rem;
    height: 14rem;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* align-items: center; */
    gap: 1.5rem;
    padding: 8rem 6rem;
    font-size: var(--fs-lg);
    font-weight: 500;
    color: var(--clr-white);
    text-align: left; 
    border-radius: 2rem;
    box-shadow: 0 1rem 2rem rgb(13 14 15 / 7%);
    transition: all 0.4s;
    position: relative;
}
.debt-status-btn .statusBtn:hover {
    box-shadow: 0rem 1.5rem 3rem rgb(13 14 15 / 25%);
}
.debt-status-btn > a.statusBtn {
    background-color: var(--clr-blue);
    margin-bottom: 4rem;
}
.debt-status-btn button.statusBtn {
    background-color: var(--clr-blue-green);
    margin-bottom: 6rem;
}
.debt-status-btn .statusBtn .txt1 {
    font-family: 'Gyeonggi Title';
    font-size: var(--fs-lg-28);
    font-weight: 600;
}
.debt-status-btn .statusBtn .txt2 {
    font-size: var(--fs-md);
    font-weight: 500;
}
.debt-status-btn .statusBtn .icon {
    position: absolute; 
    top: 50%; 
    right: 3rem; 
    transform: translateY(-50%); 
    width: 7rem; 
    height: 7rem; 
    border-radius: 1.4rem; 
    background: var(--clr-white) no-repeat 50% 50% / contain;
    background-image: url(../img/sub/guide/btn_icon_01_re.png);
    text-indent: -99999rem;
    transition: all 0.4s;
}
.debt-status-btn .statusBtn:hover .icon {
    top: 48%;
}
.debt-status-btn a.statusBtn .icon {
    background-image: url(../img/sub/guide/btn_icon_03_re.png);
}
.debt-status-btn button.statusBtn .icon {
    background-image: url(../img/sub/guide/btn_icon_01_re.png);
}
.debt-status-btn button.statusBtn.active {
    background-color: var(--clr-navy);
    position: relative;
}
.debt-status-btn button.statusBtn.active::after {
    content: '';
    position: absolute;
    bottom: -1.4rem;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 1.5rem 1rem 0px 1rem;
    border-color: var(--clr-navy) transparent transparent transparent;
}

/* more */
.moreContent {
    width: 100%;
    margin-top: 2rem;
    padding: 6rem;
    background-color: #f4f6fd;
    border-radius: 1.8rem;
}
.moreContent h2 {
    margin-bottom: 3rem;
}
.moreContent .textBlue {
    color: var(--clr-blue-Medium);
}
.moreContent > p {
    font-size: var(--fs-md-20);
    line-height: 1.5;
    margin-bottom: 4rem;
}
.moreContent ol.mainList > li {
    margin-bottom: 4rem;
}
.moreContent ol.mainList > li:last-of-type {
    margin-bottom: 0;
}
.moreContent ol.mainList > li > strong {
    display: block;
    font-size: var(--fs-lg);
    font-weight: 400;
    margin-bottom: 1rem;
}
.moreContent ol.mainList ul.subList {}
.moreContent ol.mainList ul.subList li {
    font-size: var(--fs-md);
    line-height: 1.8;
    padding-left: 2rem;
    position: relative;
}
.moreContent ol.mainList ul.subList > li::before {
    content: '';
    position: absolute;
    top: 1.3rem;
    left: 1rem;
    width: 0.3rem;
    height: 0.3rem;
    background-color: var(--clr-gray-bar);
}
.moreContent ol.mainList ul.subList li a {
    word-break: break-all;
    font-size: var(--fs-xs);
    color: var(--clr-gray-dark);
    transition: all 0.4s;
}
.moreContent ol.mainList ul.subList li a:hover {
    color: var(--clr-blue);
    text-decoration: underline;
}
.moreContent ol.mainList ul.subList .textBlue {
    color: var(--clr-blue-Medium);
}
.moreContent ol.mainList ul.subList ol.detailList {}
.moreContent ol.mainList ul.subList ol.detailList > li {
    position: static;
}
.moreContent ol.mainList ul.subList ol.detailList ul.subList li {
    font-size: var(--fs-md);
    padding-left: 0;
    position: static;
}
.moreContent ol.mainList p {
    font-size: var(--fs-md);
    padding-left: 1rem;
}

@media screen and (max-width: 640px){
    .debt-status-btn .statusBtn { 
        width: 94%; 
    }
}

@media screen and (max-width: 460px){
    .debt-guide .guideList {
        padding: 4rem 4rem;
    }
    .moreContent {
        padding: 4rem 4rem;
    }
    .debt-status-btn .statusBtn { 
        height: 26rem; 
        padding: 4rem 2rem;
        justify-content: flex-start;
        align-items: center;
    }
    .debt-status-btn .statusBtn .icon {
        bottom: 4rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .moreContent ol.mainList ul.subList li {
        padding-left: 1rem;
    }
    .moreContent ol.mainList ul.subList > li::before {
        left: 0rem;
    }
    .moreContent ol.mainList ul.subList ol.detailList > li {
        left: 0rem;
    }
}



/* 25-09-17 기관소개 > 제도안내 > 처리절차 수정 */
.process-wrap { 
    display: flex; 
    justify-content: space-between;
    align-items: center;
    gap: 6rem;
}
.process-step {
    width: 25%;
}
.process-step .text {
    font-size: var(--fs-2xs);
    color: var(--clr-black);
    text-align: center;
    padding-bottom: 0.5rem;
}
.process-step .text1 {
    font-size: var(--fs-md-20);
    font-weight: 600;
    color: var(--clr-white);
    text-align: center;
    line-height: 1.3;
    background-color: var(--clr-gray-dark);
    padding: 1.7rem 1rem;
    box-sizing: border-box;
}
.process-step .text2 {
    font-size: var(--fs-xs);
    color: var(--clr-black);
    text-align: center;
    line-height: 1.1;
    padding: 1.5rem 0.5rem;
    border: 0.3rem solid var(--clr-gray);
    background-color: var(--clr-white);
    box-sizing: border-box;
}

/* 색상코드 */
.process-step .blueBG .text1 { background-color: var(--clr-blue);}
.process-step .navyBG .text1 { background-color:var(--clr-navy); }
.process-step .greenBG .text1 { background-color:var(--clr-blue-green); }
.process-step .violetBG .text1 { background-color:var(--clr-violet); }

.process-step .blueBG .text2 { border-color: var(--clr-blue); }
.process-step .navyBG .text2 { border-color:var(--clr-navy); }
.process-step .greenBG .text2 { border-color:var(--clr-blue-green); }
.process-step .violetBG .text2 { border-color:var(--clr-violet); }

/* 단계별 */
.process-step .step-02 ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 3rem;
}
.process-step .step-03 {}
.process-step .step-03 ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4rem;
}
.process-step .step-04 {}
.process-step .step-04 ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.5rem;
    border: 0.1rem dashed var(--clr-navy);
    border-radius: 0rem;
    padding: 0.8rem;
}
.process-step .step-04 .text3 {
    position: absolute;
    top: 60%;
    right: -4.5rem;
    font-size: var(--fs-2xs);
    color: var(--clr-blue-dark);
    line-height: 1;
}
.process-step .step-05 {}

/* 화살표 이미지 */
.process-wrap .arrow-before,
.process-wrap .arrow-after,
.process-wrap .arrow-both {
    position: relative;
}
.process-wrap .arrow-before::before, 
.process-wrap .arrow-after::after {
    /* content: url(../img/sub/check/arrow_000.png); */
    content: '';
    background-image: url(../img/sub/check/arrow_000.png);
    background-repeat: no-repeat;
    width: 2rem;
    height: 0.5rem;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.process-wrap .arrow-before::before { 
    left: -4rem; 
}
.process-wrap .arrow-after::after { 
    right: -4rem; 
}
.process-wrap .arrow-both::before,
.process-wrap .arrow-both::after {
    /* content: url(../img/sub/check/arrow_000.png); */
    content: '';
    background-image: url(../img/sub/check/arrow_000.png);
    background-repeat: no-repeat;
    width: 2rem;
    height: 0.5rem;
    position: absolute;
    right: -4rem;
}
.process-wrap .arrow-both::before { 
    top: 46%; 
}
.process-wrap .arrow-both::after { 
    bottom: 46%; 
    transform: rotate(180deg); 
    opacity: 0.35;
}

/* 플러스 이미지*/
.process-step .step-02 .plus {
    position: relative;
}
.process-step .step-02 .plus::before,
.process-step .step-02 .plus::after {
    content: url(../img/sub/about/plus_g.png);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    /*
    content: '';
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    background-image: url(../img/sub/about/plus_g.png);
    background-repeat: no-repeat;
    */
    z-index: 999;
}
.process-step .step-02 .plus::before {
    top: -2.5rem;
}
.process-step .step-02 .plus::after {
    bottom: -2.8rem;
}

/* 박스 라운드 */
.process-step .borderA { border-radius: 1.2rem; }
.process-step .borderT { border-radius: 1.2rem 1.2rem 0 0; }
.process-step .borderB { border-radius: 0 0 1.2rem 1.2rem; }

/*  그림자 */
.process-step .shadow { 
    box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.1); 
}

@media screen and (max-width: 1200px){
    .process-wrap { 
        flex-direction: column; 
        padding: 3rem; 
        background-color: var(--clr-white-dark); 
        border-radius: 1.8rem; 
    }
    .process-step { width: auto; min-width: 32rem; }
    .process-step .step li { min-width: 20rem; align-content: center; }
    .process-step .step-02 ul { flex-direction: row; }
    .process-step .step-03 ul { flex-direction: row; }
    .process-step .step-04 ul { flex-direction: row; }
    .process-step .step-04 .text3 {
        top: auto;
        bottom: -4rem;
        right: auto;
        left: calc(50% - 6rem);
        transform: translateX(-50%);
    }
    .process-step .step-04 .text3 .m_none { display: none; }

    .process-wrap .arrow-before::before { 
        top: -4rem; 
        right: auto;
        left: 50%; 
        transform: translateX(-50%) rotate(90deg); 
    }
    .process-wrap .arrow-after::after { 
        top: auto; 
        right: auto;
        left: 50%; 
        bottom: -4rem;
        transform: translateX(-50%) rotate(90deg); 
    }
    .process-wrap .arrow-both::before { 
        top: auto;
        bottom: -3.5rem;
        right: calc(50% - 2rem);
        transform: rotate(90deg); 
    }
    .process-wrap .arrow-both::after { 
        top: auto;
        bottom: -3.5rem;
        left: calc(50% - 2rem); 
        right: auto;
        transform: rotate(270deg); 
    }

    .process-step .step-02 .plus::before { 
        top: 50%;
        left: -2.5rem; 
        transform: translateY(-50%); 
    }
    .process-step .step-02 .plus::after { 
        bottom: auto; 
        top: 50%;
        left: auto;
        right: -2.5rem; 
        transform: translateY(-50%); 
    }
}

@media screen and (max-width: 960px){
    .process-step .step li { min-width: 14rem; }
    .process-step .text2 { padding: 1.5rem 4rem; }
    .process-step .step-02 ul { flex-wrap: wrap; }
    .process-step .step-02 ul li.text1 { width: 100%; }
    .process-step .step-02 ul li.text2 { width: calc((100% - 6rem) / 3); }
    .process-wrap .arrow-before::before, 
    .process-wrap .arrow-after::after,
    .process-wrap .arrow-both::before,
    .process-wrap .arrow-both::after {
        background-size: cover;
    }
    .process-step .text1 .m_none { display: none; }
}

@media screen and (max-width: 640px){
    .process-step .text2 { padding: 1.5rem 2rem; }
}

@media screen and (max-width: 560px){
    .process-step .step-02 ul { flex-direction: column; }
    .process-step .step-02 ul li.text2 { width: 100%; }
    .process-step .step-02 .plus::before {
        top: -2.5rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .process-step .step-02 .plus::after {
        top: auto;
        bottom: -2.8rem;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }
}

@media screen and (max-width: 460px){ 
    .process-step { min-width: none; width: 90%; }
    .process-step .step-03 ul { flex-direction: column; gap: 1.5rem; }
    .process-wrap .step-03 .navyBG.arrow-before::before { content: none; }
    .process-step .step-04 ul { flex-direction: column; }
}
