@charset "utf-8";
@import url('../css/sub2.css');

/**
모든 sub css
**/


/* 페이지 타이틀 */

.section-title-container {
    text-align: center;
    padding: 20px;
}

.section-title-container .title {
    color: var(--font-color-primary);
    padding-bottom: 48px;
    position: relative;
    font-weight: 700;
}

.section-title-container .title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 140px;
    height: 5px;
    background-color: var(--font-color-primary);
}

.section-title-container .description {
    color: var(--color-gray-900);
    margin: 48px auto 0;
    text-align: center;
    line-height: 32px;
}


/* 썸네일 목록 컴포넌트 */

.article-list {
    margin-top: 16px;
    background-color: var(--color-white);
    border-top: 2px solid var(--color-black);
;
}

.article-item {
    border-bottom: 1px solid var(--color-gray-300);
}

.article-link {
    display: flex;
    gap: 20px;
    padding: 42px 0;
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.article-link:hover {
    background-color: #f8f9fa;
}

.article-thumbnail {
    overflow: hidden;
    position: relative;
    width: 240px;
    height: 152px;
    background-color: var(--color-gray-50);
    border: 1px solid var(--color-gray-300);
    flex-shrink: 0;
    background-image: url(../images/bg-card-defaul-1.jpg);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
}

.article-thumbnail img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: auto;
    transform: translate(-50%, -50%);
}

.article-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.article-date {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: var(--color-gray-700);
}

.article-title {
    font-weight: 700;
    font-size: 22px;
    line-height: 22px;
    text-align: center;
    color: var(--font-color-primary);
    /* margin-top: 8px; */
    display: flex;
    align-items: center;
}

.article-title::before {
    content: '';
    display: inline-flex;
    width: 4px;
    height: 22px;
    margin-right: 8px;
    background-color: var(--font-color-primary);
}

.article-description {
    margin-top: 8px;
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
    color: var(--font-color-primary);
    flex-grow: 1;
}

.article-keywords {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    color: var(--color-primary);
}

.article-tag {
    background-color: var(--color-white);
    color: var(--font-color-primary);
    font-weight: 500;
    font-size: 16px;
    line-height: 16px;
    width: 185px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
    border: 1px solid var(--color-gray-300);
}

@media (max-width: 768px) {
    .article-link {
        flex-direction: column;
    }
    .article-thumbnail {
        width: 100%;
        aspect-ratio: 1 / 0.6;
        height: auto;
    }
    .article-title {
        text-align: left;
        line-height: 32px;
        align-items: flex-start;
        margin-top: 4px;
    }
    .article-title::before {
        min-width: 4px;
        margin-top: 6px;
    }
    .article-description {
        line-height: 26px;
    }
    .article-keywords {
        margin-top: 24px;
    }
    .article-tag {
        font-size: 15px;
        line-height: 15px;
        width: auto;
        height: 39px;
        display: flex;
        padding: 12px 16px;
        border-radius: 100px;
    }
}

/* 메인 */
.login-guide-msg {
    display: flex;
    flex-direction: column;
    gap: 2px;
    color: var(--color-black);
    margin-top: 43px;
    font-family: var(--font-family-gmarket);
}
.login-guide-msg .sub-text {
    font-weight: 400;
    font-size: 22px;
    line-height: 33px;
}
.login-guide-msg .sub-text a:not(.btn) {
    color: var(--color-secondary-01);
}
.login-guide-msg .main-text {
    font-weight: 400;
    font-size: 42px;
    line-height: 59px;
    display: flex;
    align-items: center;
    gap: 2px;
}
.login-guide-msg .main-text a {
    color: #F1764C;
    display: inline-flex;
    align-items: center;
    border-bottom: 4px solid #F1764C;
    margin-left: 5px;
}
.main-job-card-section .job-card-grid {
    padding: 32px 0;
}
@media (max-width: 768px) {
    .content-inner-fix.main-job-card-section  {
        padding: 0 0 0 16px;
        position: relative;
    }
    .login-guide-msg .main-text {
        font-size: 30px;
        line-height: 50px;
    }
    .login-guide-msg .sub-text {
        font-size: 18px;
        line-height: 24px;
        padding-right: 16px;
    }
    .login-guide-msg .main-text a {
        line-height: 32px;
    }
    .main-job-card-section .job-card-grid {
        padding: 24px 16px 24px 0;
    }
    .main-job-card-section .job-card-grid .job-card {
        gap: 0;
    }
}

/* 게시글 상세 */

.board-view-section {
    padding-bottom: 60px;
}

.board-view-header {
    padding-bottom: 24px;
    border-bottom: 2px solid var(--color-black);
}

.board-view-header h3 {
    font-weight: 700;
    font-size: 32px;
    line-height: 32px;
    color: var(--color-black);
}

.board-view-header-desc {
    margin-top: 16px;
    font-weight: 400;
    font-size: 22px;
    line-height: 32px;
    color: var(--color-black);
}
.board-view-header.no-bottom-border {
    border-bottom: 0;
}


/* 공유하기 */

.board-sns-share {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0;
}

.board-sns-share .sns-list {
    display: flex;
    align-items: center;
    gap: 8px;
}

.board-sns-share .btn-like-action {
    border: 0;
    background-color: transparent;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 5px;
    color: var(--color-black);
    font-weight: 500;
    font-size: 18px;
    line-height: 18px;
    cursor: pointer;
}

.board-sns-share .btn-like-action .ico.ico-favor::after {
    width: 28px;
    height: 28px;
}

.board-sns-share .btn-like-action span {
    vertical-align: middle;
}

.board-view-content {
    margin: 40px 0;
    padding: 40px 10px;
    /* min-height: 400px; */
    color: var(--font-color-secondary);
    font-size: var(--font-size-base);
    line-height: 1.8;
    display: flex;
    align-items: center;
    justify-content: center;
    /* background-color: var(--color-gray-50);
    border: 1px solid var(--color-gray-600); */
}

.board-view-info {
    font-size: var(--font-size-base);
    border-top: 1px solid var(--color-gray-300);
}

.board-view-info dl {
    display: flex;
    border-bottom: 1px solid var(--color-gray-300);
}

.board-view-info dt {
    background-color: var(--color-gray-50);
    color: var(--font-color-primary);
    padding: 20px 16px;
    width: 160px;
    text-align: left;
    font-weight: 500;
    font-size: 16px;
    line-height: 16px;
}

.board-view-info dd {
    padding: 20px 16px;
    color: var(--font-color-tertiary);
    display: flex;
    align-items: center;
    gap: 8px;
}

.board-view-info dd .hashtag {
    color: var(--font-color-tertiary);
    font-size: var(--font-size-xs);
}

@media (max-width: 768px) {
    .board-view-section {
        padding: 32px 16px 24px;
    }
    .board-view-header h3 {
        font-size: 32px;
        line-height: 42px;
    }
    .board-view-info dt {
        width: 88px;
    }
}


/* 연관컨텐츠 */

.related-content-wrap {
    margin-top: 40px;
}

.related-content-wrap h4 {
    font-size: var(--font-size-base-2);
    font-weight: 700;
    color: var(--font-color-primary);
    margin-bottom: 20px;
}

.related-content-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    border-top: 1px solid var(--color-black);
    border-bottom: 1px solid var(--color-gray-300);
    padding: 15px 0;
}

.related-content-item a {
    display: block;
    text-decoration: none;
}

.related-content-item .img-box {
    margin-bottom: 12px;
}
.related-content-item .img-box img{display:block; width:100%; aspect-ratio: 33 / 20;}

.related-content-item .title {
    font-size: var(--font-size-base);
    color: var(--font-color-secondary);
    line-height: 1.6;
}

@media (max-width: 768px) {
    .related-content-list {
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
        border-top: 1px solid var(--color-black);
        border-bottom: 1px solid var(--color-gray-300);
        padding: 15px 0;
    }
    .banner-zone {
        width: 100%;
        margin-top: 32px;
    }
    .banner-zone+.bottom-sns-area {
        margin-top: 0;
    }
    .banner-zone a {
        display: block;
        width: 100%;
    }
    .banner-zone img {
        width: 100%;
    }
}


/* faq */

.faq-accordion {
    border-top: 2px solid var(--color-black);
;
}

.faq-item {
    border-bottom: 1px solid var(--color-gray-100);
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 0;
    cursor: pointer;
    width: 100%;
    border: none;
    background: none;
    text-align: left;
}

.faq-question::after {
    content: '';
    display: inline-flex;
    width: 32px;
    height: 32px;
    background: url('../img/common/ico-arrow-down.svg') no-repeat;
    transition: transform 0.3s ease;
}

.faq-question .q {
    color: var(--font-color-primary);
    font-weight: 700;
    font-size: 22px;
    line-height: 22px;
    margin-right: 24px;
}

.faq-question .faq-tit {
    flex: 1;
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
}

.faq-item.is-active .faq-question::after {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
}

.faq-answer-content {
    padding: 20px 20px 20px 0px;
    display: flex;
    gap: 12px;
    line-height: 1.7;
    color: var(--color-gray-900);
    margin-left: 46px;
    border-top: 1px solid var(--color-gray-300);
}

.faq-answer .a {
    color: var(--color-primary);
    font-weight: 700;
    font-size: 22px;
    line-height: 22px;
}

.faq-item.is-active .faq-answer {
    max-height: 500px;
    /* Should be larger than any possible content height */
    /* padding-top: 20px; */
    padding-bottom: 20px;
}

.faq-answer .tit {
    color: var(--color-primary);
    font-weight: 700;
    font-size: 22px;
    line-height: 22px;
    margin-bottom: 8px;
}

.faq-answer .text {
    color: var(--font-color-primary);
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
}


/* // 알자리 안내 */

.tab-nav-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 42px;
    padding: 48px 0;
}

.tab-nav-icon a {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    color: var(--font-color-primary);
    font-weight: 600;
    font-size: 22px;
    line-height: 32px;
    text-align: center;
}

.tab-nav-icon a.is-active {
    font-weight: 600;
    color: var(--color-primary);
}

.tab-nav-icon a::before {
    content: '';
    display: inline-flex;
    width: 120px;
    height: 120px;
    background-color: var(--color-white);
    border: 1px solid var(--color-gray-300);
    border-radius: 24px;
    background-repeat: no-repeat;
    background-position: center center;
}

.tab-nav-icon a.is-active::before {
    border: 1px solid var(--color-primary);
    background-color: #CDD9EA;
}

.tab-nav-icon a.ico-job::before {
    background-image: url(../img/common/ico-pin.svg);
}

.tab-nav-icon a.ico-suport::before {
    background-image: url(../img/common/ico-pen.svg);
}

.tab-nav-icon a.ico-puzzle::before {
    background-image: url(../img/common/ico-puzle.svg);
}

.tab-nav-icon a.ico-mic::before {
    background-image: url(../img/common/ico-mic.svg);
}

.tab-nav-icon a.ico-building::before {
    background-image: url(../img/common/ico-build.svg);
}

@media (max-width: 768px) {
    .job-card-category {
        gap: 9px;
        background-color: var(--color-gray-100);
        padding: 24px 16px;
        margin-bottom: 32px;
        width: 100%;
    }
    .tab-nav-icon a::before {
        width: 60px;
        height: 60px;
        border-radius: 12px;
        background-size: 34px 34px;
    }

    .tab-nav-icon a {
        font-size: 15px;
        line-height: 17px;
    }
}
@media (max-width: 480px) {
    .tab-nav-icon a::before {
        width: 60px;
        height: 60px;
        border-radius: 12px;
        background-size: 34px 34px;
    }

}

/* job info */

.cont-section {
    margin-top: 120px;
}

.cont-section .h2-title {
    font-weight: 700;
    padding-bottom: 24px;
    border-bottom: 2px solid var(--color-black);
    margin-bottom: 40px;
}

.job-categories {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-gray-50);
    gap: 48px;
    padding: 48px 0;
}

.category-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    text-decoration: none;
    min-width: 160px;
}

.category-icon-wrapper {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background-color: var(--color-white);
    border: 1px solid var(--color-gray-300);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color 0.2s;
}

.category-icon-wrapper img {
    width: 60px;
    height: auto;
}

.category-title {
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #132037;
}

.program-list {
    margin: 0px;
}

.program-item {
    padding: 40px 0;
    border-bottom: 1px solid var(--color-gray-300);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.program-title {
    font-weight: 700;
    font-size: 22px;
    line-height: 32px;
    color: var(--font-color-primary);
    display: flex;
    align-items: center;
}

.program-title::before {
    content: '';
    display: inline-flex;
    width: 4px;
    height: 22px;
    background-color: var(--font-color-primary);
    margin-right: 8px;
}

.description-list {
    margin: 24px 0 0;
}

.description-list li {
    position: relative;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    padding-left: 10px;
}

.description-list li::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 10px;
    width: 4px;
    height: 4px;
    border-radius: 110px;
    background-color: var(--font-color-primary);
}

.description-list li+li {
    margin-top: 12px;
}

.description-list li strong {
    color: #4C6390;
    font-weight: 600;
}

.program-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
}

.program-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.program-tag {
    background-color: var(--color-gray-50);
    border: 1px solid var(--color-gray-300);
    color: var(--font-color-primary);
    padding: 16px 24px;
    border-radius: 100px;
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
}

.btn-go {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background-color: var(--color-primary);
    color: var(--color-white);
    padding: 19px 24px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 700;
    font-size: 18px;
    flex-shrink: 0;
}


/* //검색 조건 */

.filter-options-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--color-gray-300);
    border-bottom: 1px solid var(--color-gray-300);
    font-family: var(--font-family-main);
}

.filter-options-top + .filter-options-top {
    border-top: 0;
}

.filter-options-top .filter-group {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 50%;
}

.filter-group .tit {
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    padding-left: 16px;
    background-color: var(--color-gray-50);
    width: 160px;
    display: inline-flex;
    height: 56px;
    align-items: center;
    color: var(--font-color-primary);
}
.filter-options-top .filter-list {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    width: calc(100% - 160px);
    background-color: var(--color-white);
}

@media (max-width: 768px) {
    .filter-options-top {
        flex-direction: column;
    }
    .filter-options-top .filter-group {
        width: 100%;
        gap: 0;
        background-color: var(--color-gray-50);
        border-bottom: 1px solid var(--color-gray-300);
    }
    .filter-options-top .filter-group:last-child {
        border-bottom: 0;
    }
    .filter-group .tit {
        width: 88px;
    }
    .filter-options-top .filter-list {
        width: calc(100% - 88px);
        padding: 16px;
    }
    .filter-options-top .filter-list .radio-item {
        display: inline-flex;
        width: 90px;
        white-space: nowrap;
        align-items: center;
    }
    .filter-options-top .radio-group {
        flex: 1;
        flex-wrap: wrap;
        gap: 16px;
        padding: 16px;
        background-color: var(--color-white);
    }
    .content-section.no-padding .filter-main-panel,
    .content-section.no-padding .box-type.bg-gray {
        margin: 24px 16px 0;
    }

    .content-section.no-padding .filter-options-top {
        margin: 0 16px;
    }
    /* .content-section.no-padding .filter-main-panel {
        padding: 0 16px;
    } */
}


/* 메인 필터(일자리) */
.filter-main-panel {
    display: grid;
    margin-top: 25px;
    grid-template-columns: 1.2fr 1.2fr 1fr 1.6fr;
    /* 컬럼 비율 조정 */
    border-top: 1px solid var(--color-gray-300);
    border-bottom: 1px solid var(--color-gray-300);
    font-family: var(--font-family-main);
}

.filter-main-panel.column-items3 {
    grid-template-columns: 1.2fr 1.2fr 1.6fr;
}

.filter-column {
    border-left: 1px solid var(--color-gray-300);
}

.filter-column:first-child {
    border-left: none;
}

.filter-column .title {
    text-align: center;
    padding: 20px 0;
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    background-color: var(--color-gray-50);
;
    color: var(--font-color-primary);
    border-bottom: 1px solid var(--color-gray-300);
}

.filter-option {
    height: 293px;
    overflow-y: scroll;
}

.filter-column ul {
    display: flex;
    flex-direction: column;
}

.filter-column ul li a{
    display: flex;
    align-items: center;
    gap: 8px;
    height: 48px;
    padding-left: 16px;
}

.filter-column ul li.is-active {
    background-color: #F2F8FF;
}

.filter-column ul li.is-active a,
.filter-column ul li:hover a {
    color: var(--font-color-accent);
    /* display: block; */
    width: 100%;
}

.filter-column ul li.is-active::before,
.filter-column ul li:hover::before {
    background-color: var(--font-color-accent);
}

.filter-column ul li a::before {
    content: '';
    display: inline-flex;
    width: 4px;
    height: 4px;
    background-color: var(--font-color-primary);
    border-radius: 100px;
}


/* 근무지 컬럼 특별 스타일 */

.location-sub-column {
    display: flex;
    justify-content: space-between;
}

.location-sub-column .filter-option-wrap {
    width: calc(100% / 2);
    border-right: 1px solid var(--color-gray-300);
}

.location-sub-column .filter-option-wrap:last-child {
    border-right: 0;
}

.location-sub-column .filter-option-wrap .lo-title {
    background-color: #E6EBF5;
    padding: 8px 0;
    font-weight: 500;
    font-size: 15px;
    line-height: 15px;
    color: var(--font-color-primary);
    border-bottom: 1px solid var(--color-gray-300);
    text-align: center;
}

@media (max-width: 768px) {
    .filter-main-panel {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 0.7fr 0.7fr 0.3fr 0.7fr;
        border-top: 0;
    }
    .filter-main-panel.column-items3 {
        grid-template-columns: 1fr;
        grid-template-rows: 0.1fr;
    }
    .filter-column {
        border-left: 0;
    }
    .filter-column .title {
        border-top: 1px solid var(--color-gray-300);
    }
    .filter-option {
        height: 195px;
        overflow-y: scroll;
    }
}


/* //검색 */

.box-type.bg-gray {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--color-gray-50);
    min-height: 88px;
    padding: 16px;
    margin-top: 24px;
    font-family: var(--font-family-main);
}

.select-list {
    display: flex;
    gap: 8px;
    align-items: center;
    /* max-width: 60%; */
    flex: 1 1 480px;
    flex-wrap: wrap;
}

.selected-option {
    font-weight: 400;
    font-size: 15px;
    line-height: 15px;
    color: #333333;
    padding: 0 12px;
    height: 40px;
    border-radius: 100px;
    border: 1px solid var(--color-gray-300);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.btn-remove-option {
    background-color: transparent;
    border: 0;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.select-list .bar {
    width: 1px;
    height: 16px;
    background-color: var(--color-gray-300);
    margin: 0 5px;
}

.select-list .btn-reset {
    background-color: transparent;
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 2px;
    border: 0;
}

.box-type.bg-gray .input-group.search {
    max-width: 500px;
    margin-top: 0;
}

@media (max-width: 768px) {
    .box-type.bg-gray {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: auto;
        padding: 16px 16px;
    }
    .select-list {
        width: 100%;
        flex-wrap: wrap;
        height: auto;
        max-width: 100%;
        padding-bottom: 16px;
        flex: 1;
    }
}


/* 채용정보 */

.job-list-container {
    margin: 64px auto;
}

.job-card-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.job-card a {
    cursor: pointer;
}

.job-card {
    background-color: var(--color-white);
    box-shadow: 0px 0px 24px 0px #0000001A;
    border-radius: 43px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 40px 0 0 0;
    transition: box-shadow 0.3s, transform 0.3s;
    /* cursor: pointer; */
    overflow: hidden;
    width: calc((100% / 3) - 20px);
    margin-bottom: 20px;
    border: 1px solid #fff;
}

.job-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}
.job-card.is-ing:hover {
    border: 1px solid #F1764C;
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}
.job-card.is-ing:hover .status-button.apply {
    background-color: #F1764C;
}
.job-card-grid.grid-3 {
    padding-left: 12px;
}
.job-card-grid.grid-3 .job-card {
    width: calc((100% / 3) - 20px);
}
.job-card .card-header {
    display: flex;
    /* justify-content: space-between; */
    align-items: center;
    padding: 0 20px;
    position: relative;
    gap: 4px;
}

.job-card .card-header .mark img {
    width: 40px;
}

.job-card .job-tag {
    background-color: #EAEDE2;
    color: #5A6B2F;
    font-weight: 700;
    font-size: 16px;
    line-height: 17px;
    padding: 0px 10px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.job-card .job-tag.type2 {
    background-color: #FEF1DE;
    color: #D46D08;
}

.job-card .job-tag.type3 {
    background-color: #ECF0F6;
    color: #4A5875;
}

.job-card .job-tag.type4 {
    background-color: #E3E7FF;
    color: #6566EB;
}
.job-card .job-tag.type-a {
    background: #F54B84;
    color: var(--color-white);
}
.job-card .job-tag.type-b {
    background: #F6EDFD;
    color: #A548E3;
}
.job-card .job-tag.type-c {
    background: #999999;
    color: var(--color-white);
}
.job-card .job-tag.type-d {
    background: #E0F0FB;
    color: #2F97E1;
}
/* main tag type
sub page 체크후  */
.board-section .job-card .job-tag.type4 {
    background-color: #E3E7FF;
    color: #6566EB;
}
.board-section .job-card .job-tag.type4 {
    background-color: #E3E7FF;
    color: #6566EB;
}
.board-section .job-tag.tag-type1 {
    color: #E34875;
    background-color: #FFE7EE;
}
.board-section .job-tag.tag-type2 {
    color: #D46D08;
    background-color: #FEF1DE;
}
.board-section .job-tag.tag-type3 {
    color: #4A5875;
    background-color: #ECF0F6;
}
.board-section .job-tag.tag-type4 {
    color: #6566EB;
    background-color: #E3E7FF;
}
.board-section .job-tag.tag-type5 {
    color: #5A6B2F;
    background-color: #EAEDE2;
}
.board-section .job-tag.tag-type6 {
    color: var(--color-white);
    background-color: #2F97E1;
}
.board-section .job-tag.tag-type7 {
    color: var(--color-white);
    background-color: #F54B84;
}

/* 바로가기 */
.content-inner-full.quick-move-section {
    background: #F5F5F5
}
.content-inner-full.quick-move-section .title {
    font-weight: 700;
    font-size: 42px;
    line-height: 59px;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom:13px;
}
.section-inner {
    width: 100%;
    max-width: var(--layout-max-width);
    padding: 64px 0 80px;
    margin: 0 auto;
    background: #F5F5F5 url(../img/common/bg_main_section02.png) no-repeat 100% 0;
}
.main-quick-link {
    display: flex;
    gap: 0px;
    align-items: center;
}
.main-quick-link .quick-link {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-left: 20px;
}
.main-quick-link .quick-link a {
    display: inline-flex;
    width: 332px;
    height: 178px;
    border-radius: 28px;
    background-color: #fff;
    box-shadow: 0px 0px 20px 0px #0000001A;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    color: var(--color-black);
    font-weight: 700;
    font-size: 32px;
    line-height: 32px;
    padding-left: 45px;
    border: 1px solid #fff;
}
.main-quick-link .quick-link a i {
    width: 64px;
    height: 73px;
}
.main-quick-link .quick-link a .ico-quick01 {
    background: url(../img/common/ico-main-quick01.svg) no-repeat;
    background-size: 100% auto;
}
.main-quick-link .quick-link a:hover {
    background-color: #FFF4EE;
    border: 2px solid #F1764C;
    color: #F1764C;
    transition: all 0.3s;
}
.main-quick-link .quick-link a .ico-quick02 {
    background: url(../img/common/ico-main-quick02.svg) no-repeat;
    background-size: 100% auto;
}
.main-quick-link .quick-link a .ico-quick03 {
    background: url(../img/common/ico-main-quick03.svg) no-repeat;
    background-size: 100% auto;
}
.main-quick-link .quick-link a .ico-quick04 {
    background: url(../img/common/ico-main-quick04.svg) no-repeat;
    background-size: 100% auto;
}
@media (min-width: 769px) and (max-width: 1439px) {
    .content-inner-full.quick-move-section .section-inner {
        padding: 34px 32px;
    }
    .main-quick-link {
        flex-wrap: wrap;
    }
    .bn01,
    .bn02 {
        width: 50%;
    }
    .bn01 img,
    .bn02 img {
        width: 100%;
    }
    .main-quick-link .quick-link a {
        width: 48%;
    }

}

@media (max-width: 768px) {
    .content-inner-full.quick-move-section .section-inner {
        width: 100%;
        max-width: 100%;
        padding: 34px 16px;
        background: none;
    }
    .content-inner-full.quick-move-section .title {
        font-size: 30px;
        line-height: 50px;
    }
    .content-inner-full.quick-move-section .title img {
        width: 58px;
    }
    .main-quick-link {
        flex-wrap: wrap;
    }
    .bn01,
    .bn02 {
        width: 50%;
    }
    .bn01 img,
    .bn02 img {
        width: 100%;
    }
    .quick-link {
        flex-wrap: wrap;
        margin-top: 8px;
    }
    .main-quick-link .quick-link {
        margin-left: 0;
        gap: 16px;
    }
    .main-quick-link .quick-link a {
        width: calc(50% - 9px);
        height: 88px;
        padding-left: 16px;
        font-size: 15.95px;
        line-height: 15.95px;
        border-radius: 18px;
        gap: 5px;
    }
    .main-quick-link .quick-link a i {
        width: 31px;
        height: 36px;
    }
    .main-job-card-section .job-card-grid::after {
        content: '';
        display: block;
        position: absolute;
        width: 31px;
        top:0;
        right:0;
        bottom: 0;
        background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
    }

}

.job-card-grid.edu-card-list .label-area {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.job-card-grid.edu-card-list .label-area .label {
    display: inline-flex;
    border-radius: 8px;
    padding: 4px 10px;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
}
.job-card-grid.edu-card-list .label-area .label.label-type01 {
    color: #E51042;
    border: 1px solid #E5104280
}
.job-card-grid.edu-card-list .label-area .label.label-type02 {
    color: var(--color-white);
    border: 1px solid #101BE5;
    background-color: #101BE5;
}
.job-card-grid.edu-card-list .label-area .label.label-type03 {
    color: var(--color-white);
    border: 1px solid #E51042;
    background-color: #E51042;
}

.job-card-grid.edu-card-list .card-body-top {
    height: 100px;
}

/* 최신소식 */
.content-inner-fix.board-section {
    padding: 100px 0;
}
.main-tab .tab-head {
    display: flex;
    align-items: center;
    gap: 0;
}
.main-tab .tab-head .tab-menu-wrap {
    display: flex;
    background-color: #F8F8F8;
    border: 1px solid #D8D9DA;
    border-radius: 20px;
    padding-bottom: 0;
    overflow: visible;
}
.main-tab .tab-head .tab-menu-wrap button {
    border: 0;
    background-color: transparent;
    border-radius: 0;
    color: #1515154D;
    font-weight: 400;
    font-size: 32px;
    line-height: 48px;
    width: auto;
    height: auto;
    padding: 15px 50px;
    position: relative;
    border-radius: 20px;
}
.main-tab .tab-head .tab-menu-wrap button.is-active {
    background: #F1764C;
    color: #fff;
}
.main-tab .tab-head .tab-menu-wrap button.is-active::after {
    content: '';
    display: block;
    position: absolute;
    width: 34px;
    height: 24px;
    bottom: -17px;
    left: 50%;
    transform: translateX(-50%);
    background: url(../img/common/ico-arrow-donw-org.png) no-repeat;
}
.main-tab .tab-head .tab-menu-title {
    color: var(--color-black);
    font-weight: 400;
    font-size: 42px;
    line-height: 59px;
    font-family: var(--font-family-gmarket);
    margin-left: 30px;
}
.main-tab .tab-head .tab-menu-wrap button .ico-main-tab01 {
    background: url(../img/common/icon-main-tab01.svg) no-repeat;
    background-size: 100% auto;
    width: 28px;
    height: 30px;
}
.main-tab .tab-head .tab-menu-wrap button .ico-main-tab02 {
    background: url(../img/common/icon-main-tab02.svg) no-repeat center center;
    background-size: 100% auto;
    width: 32px;
    height: 28px;
}
.main-tab .tab-head .tab-menu-wrap button.is-active .ico-main-tab01 {
    background: url(../img/common/icon-main-tab01-on.svg) no-repeat center center;
}
.main-tab .tab-head .tab-menu-wrap button.is-active .ico-main-tab02 {
    background: url(../img/common/icon-main-tab02-on.svg) no-repeat center center;
}
.main-tab .tab-content {
    padding-top: 48px;
    flex-direction: column;
}

.content-inner-full.main-board-list {
    background-color: var(--color-primary);
    padding: 100px 0;
}
.content-inner-full.main-board-list .section-inner {
    margin: 0 auto;
    max-width: var(--layout-max-width);
    display: flex;
    justify-content: space-between;
    background: none;
}
.content-inner-full.main-board-list .section-inner .main-board-box {
    background-color: var(--color-white);
    border-radius: 30px;
    padding: 60px 40px;
    position: relative;
    width: calc(50% - 19px);
}
.content-inner-full.main-board-list .section-inner .main-board-box .title {
    font-family: var(--font-family-gmarket);
    font-weight: 400;
    font-size: 36px;
    line-height: 36px;
}
.content-inner-full.main-board-list .section-inner .main-board-box .btn-more {
    position: absolute;
    right: 40px;
    top: 70px;
    font-weight: 400;
    font-size: 20px;
    line-height: 100%;
    color: var(--color-gray-800);
    display: flex;
    align-items: center;
    gap: 5px;
    background-color: #EEF1F5;
    border-radius: 100px;
    padding: 12px;
}
.content-inner-full.main-board-list .section-inner .main-board-box .btn-more i {
    width: 16px;
    height: 16px;
}
.content-inner-full.main-board-list  .board-list {
    margin-top: 35px;
}
.content-inner-full.main-board-list  .board-list li {
    border-bottom: 1px solid var(--color-gray-300);
    color: var(--color-black);
    font-weight: 600;
    font-size: 22px;
    line-height: 100%;
    padding: 34px 0;
}
.content-inner-full.main-board-list  .board-list li a {
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    display: block;
    text-overflow: ellipsis;
}
.content-inner-full.main-board-list  .board-list li a span {
    display: inline-flex;
}
.content-inner-full.main-board-list  .board-list li a span.cate01 {
    color: #558BCF;
    background-color:#E1F3FF;
}
.content-inner-full.main-board-list  .board-list li a span.cate02 {
    color: #F76C5E;
    background: #F5A62333;
}
.content-inner-full.main-board-list  .board-list li a span.cate10 {
    color: #3D5FEA;
    background: #C4D0FF80;
}
@media (min-width: 769px) and (max-width: 1439px) {
    .content-inner-fix.board-section {
        padding: 100px 32px;
    }
    .job-card-grid {
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
    }
    .job-card {
        border-radius: 43px;
        min-width: 312px;
        width: 312px;
        margin-bottom: 0px;
    }
}

@media (min-width: 769px) and (max-width: 1439px) {
    .content-inner-full.main-board-list .section-inner .main-board-box .title {
        font-size: 24px;
        line-height: 100%;
    }
    .main-tab .tab-head .tab-menu-wrap button.is-active::after {
        width: 28px;
        height: 20px;
        background-size: contain;
    }
    .main-tab .tab-head .tab-menu-wrap {
        border-radius: 20px;
        width: 100%;
    }
    .content-inner-fix.board-section {
        padding: 48px 0px;
    }
    .main-tab .tab-head {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 8px;
        padding: 0 16px;
    }
    .main-tab .tab-head .tab-menu-title {
        margin-left: 0;
        font-size: 30px;
        line-height: 50px;
    }
    .main-tab .tab-head .tab-menu-wrap button {
        font-size: 20px;
        line-height: 36px;
        padding: 15px 0;
        width: 50%;
    }
    .main-tab .tab-head .tab-menu-wrap button.is-active .ico-main-tab01 {
        width: 22px;
        height: 22px;
        background-size: contain;
    }
    .main-tab .tab-head .tab-menu-wrap button.is-active .ico-main-tab02 {
        width: 32px;
        height: 28px;
        background-size: contain;
    }

    .content-inner-full.main-board-list {
        padding: 80px 32px;
    }
    .content-inner-full.main-board-list .section-inner {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .content-inner-full.main-board-list {
        padding: 48px 16px;
    }
    .content-inner-full.main-board-list .section-inner {
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 30px;
    }
    .content-inner-full.main-board-list .section-inner .main-board-box {
        width: 100%;
        padding: 48px 16px;
    }
    .content-inner-full.main-board-list .section-inner .main-board-box .btn-more {
        top: 46px;
        right: 20px;
        font-size: 15px;
        line-height: 15px;
        background-color: #EEF1F5;
        border-radius: 100px;
        padding: 12px;
    }
    .content-inner-full.main-board-list .section-inner .main-board-box .btn-more i {
        width: 12px;
        height: 12px;
    }
    .content-inner-full.main-board-list .board-list {
        margin-top: 14px;
        display: flex;
        flex-direction: column;
    }
    .content-inner-full.main-board-list .board-list li {
        padding: 24px 0;
        font-size: 18px;
        line-height: 23.4px;
    }
    .content-inner-full.main-board-list .board-list li a {
        position: relative;
        white-space: wrap;
        padding-left: 48px;
    }
    .content-inner-full.main-board-list .board-list li a span {
        position: absolute;
        left: 0;
        top: 0;
    }
    .content-inner-full.main-board-list .section-inner .main-board-box .title {
        font-size: 24px;
        line-height: 100%;
    }
    .main-tab .tab-head .tab-menu-wrap button.is-active::after {
        width: 28px;
        height: 20px;
        background-size: contain;
    }
    .main-tab .tab-head .tab-menu-wrap {
        border-radius: 20px;
        width: 100%;
    }
    .content-inner-fix.board-section {
        padding: 48px 0px;
    }
    .main-tab .tab-head {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 8px;
        padding: 0 16px;
    }
    .main-tab .tab-head .tab-menu-title {
        margin-left: 0;
        font-size: 30px;
        line-height: 50px;
    }
    .main-tab .tab-head .tab-menu-wrap button {
        font-size: 20px;
        line-height: 36px;
        padding: 15px 0;
        width: 50%;
    }
    .main-tab .tab-head .tab-menu-wrap button.is-active .ico-main-tab01 {
        width: 22px;
        height: 22px;
        background-size: contain;
    }
    .main-tab .tab-head .tab-menu-wrap button.is-active .ico-main-tab02 {
        width: 32px;
        height: 28px;
        background-size: contain;
    }
    .main-tab .tab-content {
        position: relative;
        width: 100%;
        overflow-x: auto;
        padding-top: 16px;
    }
    .main-tab .job-card-grid {
        padding: 24px 24px 16px 16px;
    }
    .main-tab .job-card-grid::after {
        content: '';
        display: block;
        position: absolute;
        width: 31px;
        top:0;
        right:0;
        bottom: 0;
        background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
    }
    .main-tab .tab-content .btn-load-more {
        padding-bottom: 16px;
    }

}

/* /일자리 정보 */
.job-card .like-button,
.like-button2 {
    background: transparent;
    border: none;
    cursor: pointer;
    width: 28px;
    height: 28px;
    position: absolute;
    right: 27px;
    top: 5px;
}

.card-body {
    padding: 0 20px;
}
.card-body .thumb {
    width: 100%;
    height: 224px;
    background-color: #F5F5F5;
    /* border-radius: 10px; */
    border: 1px solid var(--color-gray-300);
    overflow: hidden;
    margin-bottom: 20px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.card-body .thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card-body .title-line {
    /* height: 64px; */
    height: 2.91em;
    font-weight: 700;
    font-size: 22px;
    line-height: 32px;
    margin-bottom: 8px;
    color: var(--font-color-primary);
    /* 말줄임(ellipsis) 2줄 처리 */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* 2줄만 표시 */
    -webkit-box-orient: vertical;
    word-break: break-all;
    /* 단어 중간 줄바꿈 허용 (필요시) */
}
.card-body .title-line.line-3 {
    -webkit-line-clamp: 3;
}
.card-body .hot-icon {
    width: 20px;
    height: 20px;
}
.card-body-top {
    height: 180px;
    border-bottom: 1px solid var(--color-gray-300);
}
.card-body-top .job-details {
    border-bottom: 0;
}
.job-details {
    min-height: 55px;
    font-weight: 400;
    font-size: 18px;
    line-height: 24px;
    color: #666;
    padding: 10px 0 20px;
    border-bottom: 1px solid var(--color-gray-300);
}
.job-details + .recruitment-info {
    border-top: 0;
    padding-top: 0;
}
.job-details .bar {
    width: 1px;
    height: 13px;
    display: inline-flex;
    margin: 0 6px;
    background-color: #1515154D
}

.recruitment-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
    padding: 20px 0 30px;
    border-top: 1px solid var(--border-color-primary);
}
.recruitment-info span {
    display: inline-flex;
    justify-content: space-between;
}
.recruitment-info span strong {
    width: calc(100% - 70px);
}
.recruitment-info.long-type {
    border-top: 1px solid var(--border-color-primary);
}
.recruitment-info.long-type span strong {
    width: calc(100% - 110px);
}
.recruitment-info span strong.bar {padding-left: 10px;position: relative;}
.recruitment-info span strong.bar::before{
    content: '';
    width: 1px;
    height: 12px;
    display: inline-flex;
    background-color: #1515154D;
    position: absolute;
    left:0;
    top:8px;
}
.card-footer {
    margin-top: auto;
}

.status-button {
    width: 100%;
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    color: #777777;
    cursor: pointer;
    border: 0;
    background-color: #DEDEDE;
    transition: background-color 0.2s;
    padding: 19px 0;
}

.status-button span {
    font-weight: 400;
    color: rgba(102, 102, 102, 0.6);
}

.status-button.apply {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.status-button.apply span {
    font-weight: 400;
    color: rgba(255, 255, 255, 0.6);
}
.button-area.mypage-type1 {
    flex-direction: column;
    gap: 10px;
    padding-bottom: 40px;
}
.button-area.mypage-type1 .btn {
    width: 100%;
}
@media (max-width: 768px) {
    .job-list-container {
        margin-top: 48px;
        position: relative;
    }
    .job-list-container::after {
        content: '';
        display: block;
        position: absolute;
        width: 31px;
        top:30px;
        right:0;
        bottom: 0;
        background: linear-gradient(270deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%);
    }
    .job-card-grid {
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
        padding: 24px 16px;
    }
    .job-card {
        border-radius: 43px;
        min-width: 90%;
        width: 312px;
        margin-bottom: 0px;
    }
    .card-body .title-line {
        font-size: 18px;
        line-height: 28px;
    }
    .card-body-top {
        height: 175px;
    }
    .job-card-grid.edu-card-list .card-body-top {
        height: 70px;
    }
    .status-button {
        font-size: 16px;
        line-height: 26px;
    }
    .job-details {
        font-size: 16px;
        line-height: 27px;
    }
    .recruitment-info {
        font-size: 16px;
        line-height: 27px;
        padding: 16px 0 24px;
    }
}

/* swiper */
.main-banner-slider {
    padding: 100px 0 0px;
}
.main-banner-slider .type01 {
    padding-bottom: 30px;
}
.main-banner-slider .swiper-button {
    display: flex;
    justify-content: flex-end;
    position: relative;
    width: 100%;
    max-width: var(--layout-max-width);
    margin: 35px auto 0;
}
.main-banner-slider .swiper-slide {
    width: calc(20% - 40px);
}
.main-banner-slider .swiper-slide img {
    width: 100%;
}
.main-banner-slider .swiper-button .swiper-autoplay-button .pause {
    display: none;
}
.main-banner-slider .swiper-button .swiper-autoplay-button img.play{width:34px; height:34px; margin-top:4px;}
.main-banner-slider .swiper-button .swiper-autoplay-button {
    position: absolute;
    right: 35px;
    bottom:-10px;
    width: 34px;
    height: 34px;
    background-color: transparent;
    border: 0;
    left: auto;
    border: 0;
    background-color: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.main-banner-slider .swiper-button .swiper-button-prev {
    position: absolute;
    right: 68px;
    bottom:0;
    width: 34px;
    height: 34px;
    background-color: transparent;
    border: 0;
    left: auto;
}
.main-banner-slider .swiper-button .swiper-button-next {
    position: absolute;
    right: 0;
    bottom:0;
    width: 34px;
    height: 34px;
    background-color: transparent;
    border: 0;
}
.main-banner-slider .swiper-button .swiper-button-prev img,
.main-banner-slider .swiper-button .swiper-button-next img {
    width: 100%;
}
.main-banner-slider .swiper-button .swiper-button-prev::after,
.main-banner-slider .swiper-button .swiper-button-next::after {
    display: none;
}
@media (max-width: 768px) {
    .main-banner-slider {
        padding: 48px 0 0px;
    }
    .main-banner-slider .swiper-slide {
        width: 48vw;
    }
    .main-banner-slider .swiper-button .swiper-autoplay-button {
        right: 37px;
        bottom: 4px;
        width: 17px;
        height: 17px;
    }
    .main-banner-slider .swiper-button .swiper-autoplay-button img {
        width: 17px;
        height: 17px;
    }
    .main-banner-slider .swiper-button .swiper-button-prev {
        right: 56px;
        width: 20px;
        height: 20px;
    }
    .main-banner-slider .swiper-button .swiper-button-next {
        right: 16px;
        width: 20px;
        height: 20px;
    }
}

/* //채용 제목 */

.box-type.job-title,
.box-type-2.job-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #E6EBF5;
    padding: 40px;
    transition: all 0.3s;
    gap:16px;
}

.box-type.job-title.is-fixed,
.box-type-2.job-title.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 11;
    transition: all 0.3s;
}

.box-type.job-title .job-title-info,
.box-type-2job-title .job-title-info {
    flex: 1;
}
.box-type.job-title.type02,
.box-type-2.job-title.type02 {
    align-items: flex-start;
}
.box-type.job-title.type02 .job-util,
.box-type-2.job-title.type02 .job-util {
    justify-content: space-between;
    height: 150px;
}
.box-type.job-title .job-title-info .title-area,
.box-type-2.job-title .job-title-info .title-area {
    font-weight: 800;
    font-size: 32px;
    line-height: 40px; /* cy 수정 25.08.12 */
    color: var(--color-primary);
}

.box-type.job-title .job-title-info .title-area .date,
.box-type-2.job-title .job-title-info .title-area .date {
    display:inline-block;
    gap: 4px;
    border: 1px solid #B9C4D8;
    border-radius: 100px;
    font-weight: 500;
    font-size: 18px;
    line-height: 18px;
    color: var(--font-color-primary);
    padding: 8px 12px;
    margin-left: 5px;
    vertical-align: middle;
    white-space: nowrap;
}

.box-type.job-title .job-title-info .description,
.box-type-2.job-title .job-title-info .description {
    font-weight: 400;
    font-size: 18px;
    line-height: 20px;
    color: var(--font-color-primary);
    margin-top: 18px;
}
.box-type.job-title .job-title-info .keyword-area,
.box-type-2.job-title .job-title-info .keyword-area {
    margin-top: 24px;
    display: flex;
    align-items: center;
    gap: 16px;
}
.box-type.job-title .job-title-info .keyword-area .keyword-tit,
.box-type-2.job-title .job-title-info .keyword-area .keyword-tit {
    flex:0 0 auto;
    align-self:flex-start;
    margin-top:18px;
    color: var(--color-primary);
    font-weight: 500;
    line-height: 18px;
    font-size: 18px;
}

/* keyword-list */
.keyword-list{display:flex; gap:8px; flex-wrap:wrap;}


.box-type.job-title .job-util,
.box-type-2.job-title .job-util {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    gap: 16px;
}
.box-type.job-title .job-util .util-group,
.box-type-2.job-title .job-util .util-group {
    display: flex;
    align-items: center;
    gap: 0px;
}
.box-type.job-title .job-util .util-group button:first-child::after,
.box-type-2.job-title .job-util .util-group button:first-child::after {
    content: '';
    display: inline-flex;
    width: 1px;
    height: 13px;
    background-color: var(--color-gray-300);
    margin: 0 16px;
}
.btn-like-text {
    border: 0;
    background-color: transparent;
    font-weight: 500;
    font-size: 18px;
    line-height: 18px;
    color: var(--font-color-primary);
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

@media (max-width: 768px) {
    .box-type.job-title,
    .box-type-2.job-title {
        flex-direction: column;
        padding: 20px;
    }
    .box-type.job-title .job-title-info .title-area,
    .box-type-2.job-title .job-title-info .title-area {
        font-size: 24px;
        line-height: 28px;
    }
    .fa-center {text-align:center;}
    .box-type.job-title .job-title-info .description,
    .box-type-2.job-title .job-title-info .description {
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
    }
    .box-type.job-title .job-title-info .title-area .date,
    .box-type-2.job-title .job-title-info .title-area .date {
        border-radius: 100px;
        font-size: 13px;
        line-height: 13px;
        padding: 5px 8px;
    }
    .box-type.job-title .job-util,
    .box-type-2.job-title .job-util {
        justify-content: space-between;
        flex-direction: row;
        align-items: center;
        width: 100%;
        margin-top: 16px;
    }
    .box-type.job-title .job-title-info .keyword-area,
    .box-type-2.job-title .job-title-info .keyword-area {
        display: none;
    }
    .box-type.job-title.type02 .job-util,
    .box-type-2.job-title.type02 .job-util {
        justify-content: flex-end;
        height: auto;
        flex-direction: column;
        align-items: flex-end;
    }
}


/* Editor Content Area Style */

.editor-content-area {
    /*display: flex;
    justify-content: center;*/
    margin-top: 20px;
    /* padding: 40px; */
    /* border: 1px solid #D8D9DA; */
    /* min-height: 500px; */
    align-items: center;
    color: var(--font-color-primary);
    /* background-color: var(--color-gray-50); */
;
    border-radius: 4px;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
}


/* 약관 */

.gray-box.yakguan-step {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-gray-50);
;
    padding: 24px 0;
}

.gray-box.yakguan-step ol {
    display: flex;
    align-items: center;
    justify-content: center;
}

.gray-box.yakguan-step ol li {
    position: relative;
    font-weight: 700;
    font-size: 18px;
    line-height: 18px;
    color: #8092B3;
    display: flex;
    align-items: center;
    gap: 5px;
    padding-right: 56px;
}

.gray-box.yakguan-step ol li:last-child {
    padding-right: 0;
}

.gray-box.yakguan-step ol li span {
    display: inline-flex;
    width: 24px;
    height: 24px;
    border-radius: 100px;
    font-weight: 700;
    font-size: 16px;
    line-height: 23px;
    justify-content: center;
    align-items: center;
    color: rgba(79, 103, 147, 0.68);
    background-color: rgba(230, 235, 245, 1);
}

.gray-box.yakguan-step ol li::after {
    content: '';
    height: 1px;
    width: 24px;
    display: block;
    border-top: 1px dotted rgba(128, 146, 179, 1);
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateX(-50%);
}

.gray-box.yakguan-step ol li:last-child:after {
    display: none;
}

.gray-box.yakguan-step ol li.is-active {
    color: var(--font-color-accent);
}

.gray-box.yakguan-step ol li.is-active span {
    background-color: var(--font-color-accent);
    color: #fff;
}

@media (max-width: 768px) {
    .gray-box.yakguan-step ol li {
        font-size: 14px;
        line-height: 16px;
        padding-right: 32px;
    }
    .gray-box.yakguan-step ol li::after {
        width: 16px;
        right: 0;
    }
    .gray-box.yakguan-step ol li span {
        width: 20px;
        height: 20px;
        font-size: 13px;
        line-height: 20px;
    }
}


/* text box */

.text-box-section {
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: var(--font-color-primary);
}

.text-area-wrap {
    width: 100%;
    height: 160px;
    border: 1px solid var(--color-gray-300);
    overflow-y: scroll;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    padding: 16px;
}

.title-bar-type {
    font-weight: 700;
    font-size: 22px;
    line-height: 32px;
    color: var(--font-color-primary);
    display: flex;
    align-items: center;
}

.title-bar-type::before {
    content: '';
    display: inline-flex;
    width: 4px;
    height: 22px;
    background-color: var(--font-color-primary);
    margin-right: 8px;
}

.yakguan-check-area {
    background-color: #E6EBF5;
    padding: 16px;
}

@media (max-width: 768px) {
    .text-box-section {
        font-size: 14px;
        line-height: 20px;
    }
    .text-area-wrap {
        font-size: 14px;
        line-height: 20px;
    }
    .title-bar-type {
        font-size: 18px;
        line-height: 20px;
    }
    .title-bar-type::before {
        height: 18px;
    }
}


/* 이력서 선택 */

.resume-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 47px;
    width: 100%;
}

.resume-wrap .resume-guide-text {
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
    color: var(--font-color-primary);
    width: 48%;
}

.resume-wrap .resume-guide-text a {
    margin-top: 8px;
    color: var(--font-color-accent);
    display: block;
}

.resume-list-dropdown {
    width: 48%;
}

.resume-list-dropdown .dropdown-wrap {
    position: relative;
    width: 100%;
}

.resume-list-dropdown .dropdown-wrap .btn.btn-resume-select {
    width: 100%;
    border-radius: 8px;
    background-color: #fff;
    border: 1px solid var(--color-gray-300);
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 12px;
    color: var(--font-color-primary);
    font-family: Pretendard;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    gap: 8px;
    overflow: hidden;
}
.resume-list-dropdown .dropdown-wrap .btn.btn-resume-select:hover {
    border: 1px solid #D8D9DA;
    background: #F7F7F7;
}
.resume-list-dropdown .dropdown-wrap .btn-resume-select span {
    position: relative;
    color: var(--font-color-accent);
}

.resume-list-dropdown .dropdown-wrap .btn-resume-select span::before {
    content: '';
    width: 1px;
    height: 14px;
    background-color: var(--color-gray-300);
    display: inline-flex;
    margin: 0 8px;
}

.resume-list-dropdown .dropdown-wrap .btn-resume-select .title {
    flex: 1;
    justify-content: flex-start;
    display: flex;
}

.resume-list-dropdown .dropdown-wrap .btn-resume-select .date {
    color: #999999;
    font-size: 16px;
}

.resume-list-dropdown .dropdown-wrap .btn-resume-select::after {
    content: '';
    display: inline-flex;
    width: 24px;
    height: 24px;
    background: url('../img/common/ico_h24_arrow2_down.svg') no-repeat center;
    transition: all 0.3s;
}

.btn.btn-resume-select.is-active::after {
    transform: rotate(-180deg);
    transition: all 0.3s;
}

.dropdown-list.is-open {
    display: flex;
    width: 100%;
    border-radius: 8px;
    background-color: #fff;
    position: absolute;
    top: 56px;
    left: 0;
    border: 1px solid var(--color-gray-300);
    overflow: hidden;
}
.dropdown-list.mx-ht100 {
    max-height: 100px;
    overflow-y: auto;
}
.dropdown-list ul {
    width: 100%;
}

.dropdown-list ul li button {
    width: 100%;
    background-color: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 12px;
    cursor: pointer;
}
.dropdown-list ul li:hover,
.dropdown-list ul li.is-active {
    background: #F2F8FF;
}
.dropdown-list ul li .title {
    color: var(--color-black);
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
}
.dropdown-list ul li .title span {
    color: var(--color-secondary-01);
}
.dropdown-list ul li .title span::before {
    content: '';
    width: 1px;
    height: 14px;
    background-color: var(--color-gray-300);
    display: inline-flex;
    margin: 0 8px;
}
.dropdown-list ul li .date {
    color: #999999;
}
.must {
    color: var(--color-accent);
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
}

.border-line-box {
    border: 1px solid var(--color-gray-300);
    padding: 32px;
    margin-top: 40px;
}

.activity-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.activity-item .th-name {
    margin-right: 6px;
}

.scroll-type {
    height: 680px;
    overflow-y: auto;
}


/* 폼 섹션 스타일 */

.section-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 18px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--color-black);
;
}

.form-section .check-list {
    display: flex;
    flex-direction: column;
}

.form-section .check-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0px 16px;
    border-bottom: 1px solid var(--color-gray-300);
}

.form-section .check-list li .tit {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: var(--font-color-primary);
}

.form-section .check-list li .tit strong {
    display: block;
    margin-top: 6px;
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #666;
}

.form-section .check-list li.sub-list {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding-left: 32px;
}

.form-section .check-list li.column-items2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0px 16px;
    border-bottom: 1px solid var(--color-gray-300);
    gap: 16px;
}

.form-section .check-list li.column-items2 .activity-item {
    width: calc(100% / 3);
    display: flex;
    gap: 16px;
}

.form-section .check-list li.column-items2 .activity-item .input-area {
    flex: 1;
}

.yakguan-table-wrap {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 25px;
}

.yakguan-table-wrap dl {
    width: calc(100% / 4);
    border-top: 2px solid var(--color-black);
    border-bottom: 1px solid var(--color-gray-300);
    border-left: 1px solid var(--color-gray-300);
}

.yakguan-table-wrap dl dt {
    vertical-align: middle;
    text-align: center;
    background-color: #E6EBF5;
    font-weight: 700;
    font-size: 18px;
    line-height: 18px;
    height: 56px;
    border-left: 1px solid #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.yakguan-table-wrap dl:first-child {
    border-left: 0;
}

.yakguan-table-wrap dl dd {
    vertical-align: middle;
    font-weight: 400;
    font-size: 18px;
    line-height: 26px;
    min-height: 56px;
    padding: 16px;
}

@media (max-width: 768px) {
    .resume-wrap {
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        margin-top: 47px;
    }
    .resume-wrap .resume-guide-text {
        width: 100%;
        margin-bottom: 40px;
        font-weight: 400;
        font-size: 16px;
        line-height: 24px;
    }
    .resume-wrap .resume-list-dropdown {
        width: 100%;
    }
    .resume-list-dropdown .dropdown-wrap .btn-resume-select .title {
        font-size: 16px;
        line-height: 16px;
    }
    .resume-list-dropdown .dropdown-wrap .btn-resume-select .date {
        font-size: 14px;
    }
    .border-line-box {
        padding: 32px 16px;
        margin-top: 40px;
    }
    .form-section .section-title {
        font-size: 16px;
        line-height: 16px;
    }
    .activity-item .th-name {
        display: inline-flex;
        width: 56px;
    }
    .form-section .check-list .activity-container .input-area.has-button input {
        width: 80%;
    }
    .form-section .check-list li {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 16px;
    }
    .form-section .check-list li .tit {
        font-size: 15px;
        line-height: 23px;
    }
    .form-section .check-list li .tit strong {
        font-size: 14px;
        line-height: 14px;
    }
    .form-section .check-list li.sub-list {
        gap: 10px;
        padding-left: 0px;
    }
    .form-section .check-list li.sub-list .input-area {
        display: block;
        width: 100%;
    }
    .form-section .check-list li.sub-list .input-area .th-name {
        margin-top: 16px;
        display: block;
        margin-bottom: 8px;
        font-size: 15px;
        line-height: 16px;
    }
    .form-section .check-list li.column-items2 {
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding: 16px 0px 16px;
        border-bottom: 1px solid var(--color-gray-300);
        gap: 16px;
    }
    .form-section .check-list li.column-items2 .activity-item {
        width: 100%;
        display: flex;
        gap: 16px;
    }
    .form-section .check-list li.column-items2 .activity-item .th-name {
        width: 45px;
        margin-right: 0;
    }
    .form-section .check-list li.column-items2 .activity-item .input-area {
        flex: 1;
    }
    .yakguan-table-wrap {
        flex-direction: column;
    }
    .yakguan-table-wrap dl {
        width: 100%;
        border-top: 1px solid var(--color-gray-300);
        border-left: 0;
    }
    .yakguan-table-wrap dl dt {
        font-size: 14px;
        line-height: 14px;
        height: 32px;
    }
    .yakguan-table-wrap dl dd {
        font-size: 14px;
        line-height: 16px;
    }
}

/* 마이페이지 */
.box-type-round {
    box-shadow: 0px 0px 24px 0px #0000001A;
    border-radius: 32px;
    padding: 40px;
    background-color: #fff;
}
.subpage-title {
    font-family: var(--font-family-gmarket);
    color: var(--color-black);
    font-size: 32px;
    line-height: 42px;
}

.mypage-data-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 기본 2열 레이아웃 */
    gap: 0px; /* 아이템 사이의 간격 */
    margin-top: 24px;
    border-top: 2px solid var(--color-black);
}

.mypage-data-list dl {
    border-bottom: 1px solid #dee2e6;
    border-left: 1px solid #dee2e6;
    display: flex;
    justify-content: space-between;
}
.mypage-data-list dl:nth-child(1),
.mypage-data-list dl:nth-child(3) {
    border-left: 0;
}
.mypage-data-list dt {
    font-weight: 500;
    font-size: 18px;
    background-color: #F8F8F8;
    width: 160px;
    padding: 20px;
}

.mypage-data-list dd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    flex: 1;
}

.mypage-data-list .t-item {
    font-size: 16px;
    color: #6c757d;
}

.mypage-data-list .t-value a {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-secondary);
}

.subpage-tit2 {
    font-weight: 800;
    font-size: 22px;
    line-height: 22px;
}
.subpage-title a {
    color: #F1764C;
}
.member-data {
    display: flex;
    justify-content: space-between;
}
.member-data .t-value {
    padding-right: 16px;
}
.member-data .t-value a {
    color: var(--color-secondary);
}
.mypage-menu-list {
    margin-top: 64px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    background-color: var(--color-gray-50);
    border: 1px solid var(--color-gray-300);
    border-top: 0;
    border-left: 0;
    flex-wrap: wrap;
}
.mypage-menu-list li {
    width: calc(100% / 3);
    border-top: 1px solid var(--color-gray-300);
    border-left: 1px solid var(--color-gray-300);
}
.mypage-menu-list li a {
    padding: 24px 0 24px 40px;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    color: var(--color-black);
    display: flex;
    align-items: center;
    gap: 16px;
}

.mypage-menu-list li:nth-last-child(-n+3) a{outline:1px solid var(--color-gray-300);}

/* 마이페이지 메뉴 아코디언 */
.faq-accordion.mypage {
    border: 0;
    margin-top: 32px;
    margin-top: 0;
}

.faq-accordion.mypage .mypage-menu-list {
    margin-top: 0;
}
.faq-accordion.mypage .faq-item {
    border: 0;
}
.faq-accordion.mypage .page-title-wrap {

}
.faq-accordion.mypage .page-title {
    display: flex;
    align-items: center;
    gap: 26px;
}
.faq-accordion.mypage button.faq-question {
    display: inline-flex;
    width: fit-content;
    padding: 0;
    font-size: 16px;
    line-height: 2;
    cursor: pointer;
}

.faq-accordion.mypage .faq-answer {
    padding: 0;
}
.faq-accordion.mypage .faq-item .faq-answer {
    height: 0;
    transition: height 0.5s ease-out, padding 0.6s ease-out;
    max-height: unset;
}
.faq-accordion.mypage .faq-item.is-active .faq-answer {
    height: 337.41px;
    padding-top: 45px;
}
.faq-accordion.mypage .faq-answer {
    padding-top: 0;
}
.faq-accordion.mypage .faq-answer-content {
    margin: 0;
    padding: 0;
    border: 0;
}
/* 모바일 화면 (768px 이하) */
@media (max-width: 768px) {
    .faq-accordion.mypage .faq-item.is-active .faq-answer {
        height: 828px;
        padding-top: 24px;
    }
}

/* // 마이페이지 메뉴 아코디언 */


/* 모바일 화면 (768px 이하) */
@media (max-width: 768px) {
    .box-type-round {
        padding: 40px 20px;
    }
    .mypage-data-list {
        grid-template-columns: 1fr; /* 1열 레이아웃으로 변경 */
    }
    .mypage-data-list dl {
        border-left: 0;
    }
    .mypage-data-list dt {
        width: 88px;
        font-size: 16px;
        line-height: 18px;
        padding: 16px 0 16px 10px;
    }
    .mypage-data-list dd {
        font-size: 16px;
        line-height: 16px;
        padding: 16px 10px;
    }

    .mypage-menu-list {
        justify-content: center
    }
    .mypage-menu-list li {
        width: 100%;
    }
    .mypage-menu-list li a {
        padding: 20px 0 20px 20px;
        font-size: 18px;
        line-height: 26px;
    }
    .mypage-menu-list li img {
        width: 48px;
    }
}

.input-group {
    display: flex;
    align-items: center;
    gap:8px;
}
.input-group .input-area input[type="text"],
.input-group .input-area input[type="number"],
.input-group .input-area input[type="url"],
.input-group .input-area input[type="email"] {
    width: 100%;
}
.address-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.file-input-wrapper.type2 {
    max-width: 500px;
}
.file-input-wrapper.type2 input[type='text'] {
    border: 1px solid var(--color-gray-300);
    border-radius: 6px;
    padding: 0 12px;
    font-size: 15px;
    height: 42px;
    width: 530px;
}
.interest-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    max-width: 800px;
}
.interest-note {
    margin-top: 16px;
    font-size: 14px;
    color: #666;
    border-top: 1px solid #D8D9DA;
    padding-top: 16px;
}
.job-group-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    max-width: 800px;
}
.job-group-grid .radio-item {
    width: calc(33% - 16px);
}
.job-group-grid .radio-item.other-option {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space:nowrap;
    width: 100%;
}
.job-group-grid .radio-item.other-option .input-other {
    border: 1px solid var(--color-gray-300);
    border-radius: 6px;
    padding: 0 12px;
    font-size: 15px;
    height: 42px;
    width: 400px;
}
.job-seeking-status {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.job-seeking-status .radio-item-desc {
    display: flex;
    align-items: center;
    gap: 16px;
}
.job-seeking-status .radio-item-desc label {
    min-width: 200px;
}
.job-seeking-status .description {
    font-size: 16px;
    color: #666;
    display: flex;
}
.job-seeking-status .description::before {
    content: '';
    display: inline-flex;
    width: 1px;
    height: 14px;
    background-color: #D8D9DA;
    margin-right: 12px;
}
.job-seeking-status.type-02 {
    flex-direction: column;
    gap: 8px;
}
.job-seeking-status.type-02 .radio-item-desc {
    border-bottom: 1px solid var(--color-gray-300);
    padding: 16px 0;
    display: flex;
    align-items: center;
    gap: 16px;
}
.job-seeking-status.type-02 .radio-item-desc label {
    min-width: 0;
}
.job-seeking-status.type-02 .radio-item-desc:first-child {
    padding-top: 8px;
}
.job-seeking-status.type-02 .radio-item-desc:last-child {
    border-bottom: 0;
    padding-bottom: 8px;
}

.job-seeking-status.type-02 .description.job-type {
    display: flex;
    align-items: center;
    gap: 16px;
}
.job-seeking-status.type-02 .description.job-type::before {
    margin-right: 0;
}

@media (max-width: 768px) {
    .job-seeking-status.type-02 .radio-item-desc {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
    .job-seeking-status.type-02 .radio-item-desc label {
        min-width: 100%;
    }
    .job-seeking-status.type-02 .description {
        padding-left: 0;
    }
    .job-seeking-status.type-02 .description::before {
        display: none;
    }
    .job-seeking-status.type-02 .description.job-type {
        flex-wrap: wrap;
    }
    .job-seeking-status.type-02 .description.job-type::before {
        margin-right: 0;
    }
    .job-seeking-status.type-02 .description.job-type label {
        min-width: 45%;
    }
    .job-seeking-status.type-02 .input-group.phone-group {
        flex-direction: row;
        align-items: flex-start;
        gap: 8px;
    }
}

.note-text {
    margin-top: 16px;
    color: #666;
}
.input-group.phone-group .items1,
.input-group.phone-group .items2 {
    display: flex;
    align-items: center;
    gap: 8px;
}
.input-group.email-group .items1,
.input-group.email-group .items2 {
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 768px) {
    .input-group.phone-group {
        flex-direction: column;
        align-items: flex-start;
    }
    .input-group.phone-group .items1 {
        width: 100%;
    }
    .input-group.phone-group .items1 .wid120 {
        width: 90%;
    }
    .input-group.phone-group .items2 {
        width: 100%;
    }
    .input-group.phone-group .items2 .wid120 {
        width: 45%;
    }

    .input-group.email-group {
        flex-direction: column;
        align-items: flex-start;
    }
    .input-group.email-group .items1 {
        width: 100%;
    }
    .input-group.email-group .items1 .wid200 {
        width: 90%;
    }
    .input-group.email-group .items2 {
        width: 100%;
    }
    .input-group.email-group .items2 .wid200 {
        width: 45%;
    }

    .address-wrap {
        flex-direction: column;
    }
    .input-group.post-code .wid200 {
        width: calc(100% - 120px);
    }

    .input-group.add-input {
        flex-direction: column;
    }
    .input-group.add-input .input-area.wid400 {
        width: 100%;
    }
    .mo-size.wid400 {
        width: 100%;
    }
    .mo-size.wid200 {
        width: 100%;
    }
    .file-input-wrapper.type2 {
        flex-direction: column;
        align-items: flex-start;
    }
    .file-input-wrapper.type2 input[type='text'] {
        width: 100%;
    }
    .file-input-wrapper.type2 input[type='file'] {
        width: 100%;
        height: 94px;
    }
    .interest-grid {
        grid-template-columns: repeat(1, 1fr);
        max-width: 100%;
    }
    .job-group-grid {
        flex-direction: column;
        max-width: 100%;
    }
    .job-group-grid .radio-item {
        width: auto;
    }
    .job-group-grid .radio-item.other-option .input-other {
        width: 60%;
    }
    .job-seeking-status .radio-item-desc {
        flex-direction: column;
        gap: 6px;
    }
    .job-seeking-status .description {
        padding-left: 28px;
    }
    .job-seeking-status .description::before {
        display: none;
    }
    .button-area.flex-justify-between.mo-button-reverser {
        flex-direction: column-reverse;
        gap: 16px;
    }
    .button-area.flex-justify-between.mo-button-reverser div {
        width: 100%;
    }
    .button-area.flex-justify-between.mo-button-reverser div .btn-primary {
        width: 100%;
    }
    .button-area.flex-justify-between.mo-button-reverser div .btn-secondary {
        width: calc(50% - 3px);
    }
    .input-group.industry {
        flex-direction: column;
        align-items: flex-start;
    }
    .input-group.industry .input-area {
        width: 100%;
    }
    .mo-full.wid160 {
        width: 100%;
    }
    .input-group.total-member {
        display: block;
    }
    .input-group.total-member .total {
        margin-bottom: 10px;
    }
    .input-group.total-member .input-area {
        display: inline-flex;
    }
    .input-group.total-member .input-area.wid72 {
        width: 56px;
    }
    .flex.insulan-check {
        flex-direction: column;
        max-width: 100%;
    }
    .mo-derection {
        flex-direction: column;
    }
    .button-area.flex-justify-between.mo-button-full div {
        width: calc(50% - 5px);
    }
    .button-area.flex-justify-between.mo-button-full div .btn {
        width: 100%;
    }
    .button-area.flex-end.mo-button-full {
        justify-content: space-between;
    }
    .button-area.flex-end.mo-button-full .btn {
        width: calc(50% - 5px);
    }
}

.box-type.bg-primary {
    background-color: #E6EBF5;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var(--color-black);
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
}


.title-type {
    font-family: Pretendard;
    font-weight: 800;
    font-size: 18px;
    line-height: 20px;
}
.title-type.title-type22 {
    font-size: 22px;
    line-height: 22px;
}
.out-notice-list {
    display: flex;
    flex-direction: column;
    list-style-type: decimal;
    margin: 0 16px;
}
.out-notice-list li {
    border-bottom: 1px solid #D8D9DA;
    padding: 24px 16px;
    font-weight: 400;
    font-size: 15px;
    line-height: 23px;
}
.out-notice-list li:first-child {
    padding-top: 0;
}
.out-notice-list li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.job-search-check > li {
    margin-bottom: 32px;
}
.job-search-check > li:last-child {
    margin-bottom: 0;
}
.box-type.bg-primary.type-left {
    justify-content: flex-start;
    padding: 16px;
    margin-top: 16px;
    align-items: flex-start;
}
.list-type-dot li {
    position: relative;
    padding-left: 10px;
    font-weight: 400;
    font-size: 15px;
    line-height: 23px;
    text-align: left;
}
.list-type-dot li::before {
    content: '';
    width: 4px;
    height: 4px;
    background-color: var(--color-black);
    border-radius: 50%;
    display: block;
    left: 0;
    top: 8px;
    position: absolute;
}


/* 기업지원 */
/* 테이블 필수입력값 */
th .must {
    margin-left: 4px;
}

/* input 사이즈 공통 */
.input-size-md {
    width: 286px;
    max-width: 100%;
}
.input-size-sm {
    width: 120px;
    max-width: 100%;
}
.input-size-xs {
    width: 80px;
    max-width: 100%;
}
.input-size-sm input,
.input-size-xs input,
.input-size-md input {
    width: 100%;
}

/* textarea */
.form-section .textarea-wrap {
    padding: 16px;
}

.form-section textarea {
    resize: none;
    font-size: 15px;
    display: block;
    width: 100%;
    height: 83px;
    padding: 16px 12px;
    border-color: var(--color-gray-300);
    border-style: solid;
    border-radius: 4px;
    font-family: var(--font-family-main);
    appearance: none;
}

/* 이력서 관리 */
.job-search-condition-board {
    display: flex;
    flex-direction: column;
}
.job-search-condition-board .sub-text {
    color: var(--color-black);
    font-weight: 400;
    font-size: 22px;
    line-height: 32px;
    font-family: var(--font-family-gmarket);
}
.job-search-condition-board .main-text-wrap {
    color: var(--color-black);
    font-weight: 400;
    font-size: 32px;
    line-height: 42px;
    font-family: var(--font-family-gmarket);
    display: flex;
    align-items: center;
    gap: 5px;
}
.job-search-condition-board .main-text-wrap strong {
    color: #F1764C;
}
.job-search-condition-board .main-text-wrap .btn {
    border-radius: 4px;
}
.job-keyword-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
}
.job-keyword-wrap .job-keyword {
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
    border-radius: 100px;
    border: 1px solid #D8D9DA;
    padding: 14px 16px;
    background-color: var(--color-gray-50);
}
.job-keyword-wrap .job-keyword span {
    color: var(--color-secondary-01);
}
.box-type.bg-primary.type-left.mt-24 {
    margin-top: 24px;
}
.box-type.bg-primary.type-left.mt-40 {
    margin-top: 40px;
}
.resume-list-header {
    border-bottom: 2px solid var(--color-black);
    padding-bottom: 16px;
    position: relative;
}
.resume-list-header h3 {
    font-weight: 800;
    font-size: 22px;
    line-height: 22px;
}
.resume-list-header .resume-count {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    margin-top: 8px;
}
.btn-updata {
    position: absolute;
    right: 0;
    top:20px;
    height: 32px;
    padding: 8px 12px;
    font-weight: 500;
    min-width: auto;
}

.resume-list-section {
    margin-top: 24px;
}
.resume-card {
    margin-bottom: 40px;
    background-color: #fff;
    border: 1px solid #D8D9DA;
    border-radius: 32px;
    box-shadow: 0px 0px 24px 0px #0000001A;
    overflow: hidden;
}

.resume-card-header {
    border-bottom: 1px solid var(--color-black);
    padding: 1rem 1.5rem;
    font-size: 0.875rem;
    color: #666;
    padding: 40px 0 20px;
    margin:0 40px;
}
.resume-card-header .last-updata-text {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    margin-bottom: 8px;
}


.resume-card-body-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.resume-card-body-top .resume-title {
    font-weight: 800;
    font-size: 32px;
    line-height: 32px;
    flex-grow: 1;
    color: var(--color-black);
}

.resume-controls {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
}


.resume-card-body {
    padding: 20px 40px;
}

.resume-card-body-main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.progress-section {
    width: 30%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.progress-section .progress-data {
    display: flex;
    align-items: center;
    gap:8px;
}
.progress-section .progress-data .progress-text {
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    color: var(--color-black);
}
.progress-section .progress-data .percentage {
    font-family: var(--font-family-gmarket);
    font-weight: 700;
    font-size: 22px;
    line-height: 22px;
    color: var(--color-secondary-01);
}


.progress-bar-container {
    background-color: #E6EBF5;
    border-radius: 9999px;
    height: 8px;
    flex: 1;
    overflow: hidden;
}

.progress-bar {
    background-color: #007aff;
    height: 100%;
}

.progress-text {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
}
.progress-text .percentage {
    font-size: 1.5rem;
    font-weight: 700;
    color: #007aff;
}
.progress-text-label {
    font-weight: 500;
}

.progress-subtext {
    font-size: 0.75rem;
    color: #666;
    margin-top: 0.5rem;
}

.keywords-section .keywords-title {
    font-weight: 700;
    font-size: 16px;
    line-height: 16px;
    color: #4F6793;
}

.keywords-section {
    flex: 1;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.keywords-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.keyword-tag {
    background-color: #fff;
    border: 1px solid #D8D9DA;
    padding: 12px 16px;
    border-radius: 9999px;
    color: var(--color-black);
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
}

.resume-card-footer {
    background-color: #F8F8F8;
    padding: 20px 40px;
    border-top: 1px solid #D8D9DA;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
.resume-card-footer .btn {
    width: 150px;
}
.add-resume-icon {
    border: 1px solid #D8D9DA;
    background-color: transparent;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    font-weight: 800;
    font-size: 22px;
    line-height: 22px;
    color: var(--color-primary);
    padding: 24px 48px;
    gap: 8px;
    margin-bottom: 16px;
}
@media (max-width: 768px) {
    .job-search-condition-board {
        padding: 0 16px;
    }
    .job-search-condition-board .sub-text {
        font-size: 18px;
        line-height: 18px;
    }
    .job-search-condition-board .main-text-wrap {
        font-size: 22px;
        line-height: 22px;
        flex-direction: column;
        align-items: flex-start;
    }
    .job-keyword-wrap {
        flex-wrap: wrap;
    }
    .job-keyword-wrap .job-keyword {
        font-size: 16px;
        line-height: 16px;
        padding: 12px 16px;
    }
    .box-type.bg-primary.type-left.mt-24 {
        margin: 24px 16px;
    }
    .btn-updata {
        margin-top: 16px;
        position: relative;
        top: auto;
    }

    .resume-list-header h3 {
        font-size: 22px;
        line-height: 22px;
    }
    .resume-card-header {
        padding: 32px 0 20px;
        margin: 0 20px;
    }

    .resume-card-body-top .resume-title {
        font-size: 18px;
        line-height: 18px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .resume-card-body {
        padding: 20px 20px;
    }
    .resume-card-body-main {
        flex-direction: column;
        gap: 16px;
    }
    .progress-section {
        width: 100%;
        gap: 0;
    }
    .keywords-section {
        align-items: flex-start;
        justify-content: flex-start;
    }
    .keyword-tag {
        font-size: 15px;
        line-height: 15px;
    }
    .add-resume-icon {
        font-size: 18px;
        line-height: 18px;
    }
    .ico.ico-plus48 {
        width: 32px;
        height: 32px;
    }
    .box-type.bg-primary {
        padding: 16px;
    }
    .resume-card-footer{
        padding: 20px;
    }
}

/* 추가입력사항 > 마이테이터 */
.mydata-info-section .description {
    line-height: 24px;
}
.mydata-info-section .mydata-example-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.mydata-info-section .mydata-example-wrapper li {
    padding: 24px 16px;
    border-radius: 4px;
    font-weight: 500;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    background-color: var(--color-gray-50);
    flex-basis: 280px;
    line-height: 18px;
}
.mydata-info-section .mydata-example-wrapper li span:not(:last-child) {
    display: block;
    margin-bottom: 4px;
}

/* 이력서 관리 팝업 */
.modal-page-title {
    font-weight: 700;
    font-size: 18px;
    line-height: 18px;
    display: flex;
    align-items: center;
}
.modal-page-title span {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
}

.cover-letter-section {
    font-size: 16px;
    line-height: 24px;
}
.cover-letter-section + .cover-letter-section {
    margin-top: 16px;
}
.cover-letter-section h4 {
    font-weight: 700;
}

.cover-letter-section p {
    font-size: 0.95rem;
    color: var(--text-secondary);
    line-height: 1.8;
}
.history-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    line-height: 18px;
    gap: 10px;
}
.history-item-num {
    font-weight: 700;
}
.progress-data.mypage-resumeform {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 40px auto;
}

.progress-bar {
    background-color: #007aff;
    height: 100%;
}

.progress-data.mypage-resumeform  .progress-text {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.25rem;
}
.progress-data.mypage-resumeform .percentage {
    font-size: 1.5rem;
    font-weight: 700;
    color: #007aff;
}
.tab-menu-wrap {
    display: flex;
    align-items: center;
    gap:4px;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 6px;
    -ms-overflow-style: none; /* 인터넷 익스플로러 */
    scrollbar-width: none; /* 파이어폭스 */
}
.mypage-scroll-type.tab-container-full .tab-menu-wrap button,
.tab-menu-wrap.scroll-tab button {
    white-space: nowrap;
}
.box-type-line {
    border: 1px solid #D8D9DA;
    border-radius: 4px;
    padding: 16px;
    width: 100%;
    margin-top: 16px;
}
.section-wrap {
    width: 100%;
}
.input-group.period-setting .start-day {
    display: flex;
    align-items: center;
    gap: 8px;
}
.input-group.period-setting {
    display: flex;
}
.progress-section.mypage-resumeform {
    max-width: 70%;
    width: 100%;
    margin: 40px auto;
}
@media (max-width: 768px) {
    .input-group.period-setting {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
    .input-group.period-setting .start-day {
        width: calc(100% - 20px);
    }
    .progress-section.mypage-resumeform {
        max-width: 100%;
        width: 100%;
        margin: 40px auto;
    }
}

.check-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    border-bottom: 1px solid var(--color-gray-300);
    padding-bottom: 16px;
}
.check-group .check-wrap {
    width: calc(100% / 5);
}
.check-util {
    display: flex;
    align-items: center;
    gap: 12px;
}
.multi-item-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.text-box-section.resume-area {
    width: calc(100% - 16px);
}
.border-line-box.self-introduction-notice {
    padding: 16px;
}
.self-introduction-notice .tit {
    color: var(--color-black);
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
}
.self-introduction-notice .description {
    color: #666666;
    margin: 4px 0;
}
.self-introduction-notice .butotn-area {
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 768px) {
    .check-group .check-wrap {
        width: calc(50% - 16px);
    }
    .multi-item-title {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    .multi-item-title .check-util {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
    }
    .self-introduction-notice .butotn-area {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 8px;
    }
    .self-introduction-notice .butotn-area .btn {
        font-weight: 400;
        height: auto;
        text-align: left;
        padding: 8px 16px;
        white-space: normal;
    }
    .mo-button-full.button-wid150 {
        width: 100%;
    }
}

/* 상담내역 */
.consult-container {
    display: flex;
    border-top: 2px solid var(--color-black);
    gap: 20px;
    margin: 24px 0;
    padding-top: 40px;
    flex-wrap: nowrap;
}

.consult-card {
    background-color: #fff;
    border: 1px solid var(--border-color-primary);
    border-radius: 32px;
    padding: 40px 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    width: calc(25% - 14px);
}

.consult-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.consult-header {
    margin-bottom: 4px;
}

.status-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 8px;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
}

.status-green {
    border: 1px solid #00A85A;
    background: #E5F6EE;
    color: #00A85A;
}
.status-orange {
    border: 1px solid #F1764C;
    color: #F1764C;
    background: #FEF1ED;
}
.status-blue {
    color: #0178FF;
    border: 1px solid #0178FF;
    background: #e5f1ff;
}
.status-pink {
    color: #FF4C4C;
    border: 1px solid #FF4C4C;
    background: #FFEDED;
}
.status-pink-2 {
    color: #ff31b3;
    border: 1px solid #ff31b3;
    background: #f9e5f2
}
.status-darkblue {
    color: #35558F;
    border: 1px solid #35558F;
    background: #EAEEF4;
}
.status-gray {
    color: #666666;
    border: 1px solid #666;
    background: #EFEFEF;
}

.consult-body {
    padding: 20px 0;
}
.consult-body h4 {
    color: #666;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
}
.consult-date {
    color: #151515;
    text-overflow: ellipsis;
    font-size: 22px;
    font-weight: 700;
    line-height: 32px;
}

.consult-info {
    font-size: 0.95rem;
    color: var(--text-secondary);
    border-top: 1px solid #1515154D;
    padding-top: 16px;
}

.info-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

.info-item .label {
    color: #666;
    font-size: 18px;
    font-weight: 400;
    line-height: 27px;
    width: 67px;
}

.info-item .value {
    color: #151515;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 27px;
}
.info-item .value::before {
    content: '';
    width: 1px;
    display: inline-flex;
    height: 12px;
    background: rgba(21, 21, 21, 0.30);
    margin-right: 8px;
}
@media (max-width: 768px) {
    .consult-container {
        overflow-x: auto;
    }
    .consult-card {
        min-width: 330px;
    }
    .table-wrap.scroll-table {
        overflow-x: auto;
    }
    .button-area.mo-harf {
        justify-content: space-between;
    }
    .button-area.mo-harf .btn {
        width: calc(50% - 3px);
    }
}
.page-title.bottom-line {
    border-bottom: 2px solid var(--color-black);
    padding-bottom: 24px;
    width: 100%;
}
.label-status {
    color: #151515;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    border-radius: 100px;
    background: #E6EBF5;
    display: inline-flex;
    padding: 4px 16px;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}
.label-status.is-dissabled {
    background: #E6EBF5;
    color: #999999;
}

.border-top-none {
    border-top: 0;
}
.table-wrap.border-top-none table {
    border-top: 0;
}

.tab-wid-full.tab-container-full {
    gap: 0;
}
.tab-wid-full.tab-container-full .tab-head {
    gap: 0;
}
.tab-menu-wrap.has-bottom-line {
    border-bottom: 2px solid var(--color-black);
    width: 100%;
    padding-bottom: 24px;
}
.tab-wid-full.tab-container-full .tab-menu-wrap {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    gap: 0;
}
.tab-wid-full.tab-container-full .tab-menu-wrap .tab-menu {
    border: 0;
    width: 50%;
    border-radius: 0px;
    background: #E6EBF5;
    color: var(--color-black);
    font-size: 18px;
    font-weight: 400;
    line-height: 18px;
}
.tab-wid-full.tab-container-full .tab-menu-wrap .tab-menu.is-active {
    background-color: var(--color-primary);
    color: var(--color-white);
}

.time-select-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.time-select-item {
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #D8D9DA;
    padding-bottom: 8px;
}
.time-select-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.time-select-item label {
    width: 70px;
}
.full-date {
    color: #666;
    font-size: 18px;
    font-weight: 400;
    line-height: 27px;
}
@media (max-width: 768px) {
    .page-title.bottom-line {
        padding-bottom: 16px;
    }
    .time-select-group {
        flex-wrap: wrap;
    }
    .time-select-item {
        flex-wrap: wrap;
    }
    .time-select-item label {
        width: 100%;
    }
}

/* 가치동행 */
.active-board-container {
    margin-top: 60px;
    background: #E6EBF5;
    padding: 40px;
}
.active-board-title {
    border-bottom: 1px solid #C0CADD;
    padding-bottom: 32px;
}
.active-board-title .tit {
    color:#4F6793;
    font-size: 32px;
    font-weight: 800;
    line-height: 32px;
}
.active-board-title p {
    margin-top: 18px;
    font-size: 18px;
    color: var(--color-black);
    font-weight: 400;
    line-height: 18px;
}
.active-content-grid {
    display: flex;
    padding: 32px 0;
    gap: 16px;
}
.active-info-card {
    border-radius: 32px;
    background: #FFF;
    display: flex;
    padding: 40px 24px;
    flex-direction: column;
    width: calc((100% / 3) - 10px);
}
.active-info-card h4 {
    color: #151515;
    font-size: 18px;
    font-weight: 700;
    line-height: 18px;
}
.highlight-num {
    color: var(--color-secondary-01);
}
.table-wrap table tbody td.text-r {
    text-align: right;
}
@media (max-width: 768px) {
    .active-board-container {
        margin-top: 60px;
        padding: 20px;
    }
    .active-board-title .tit {
        font-size: 24px;
        line-height: 34px;
    }
    .active-board-title p {
        margin-top: 8px;
        font-size: 16px;
    }
    .active-board-title {
        padding-bottom: 16px;
    }
    .active-content-grid {
        flex-direction: column;
        padding: 32px 16;
    }
    .active-info-card {
        width: 100%;
    }
    .mo-size.wid160 {
        width: 100%;
    }
    .active-board-container  .button-area {
        justify-content: flex-end !important;
    }
}

.search-my-id {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 505px;
    margin: 0 auto;
    gap: 8px;
}

.input-group.jumin {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 8px;
    width: 100%;
    max-width: 300px;
}

/* 캘린더 초기화 */
.fc-button-group {
    gap: 4px;
}
.fc-button-group .fc-button {
    display: flex;
    height: 48px;
    padding: 0px 16px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    border: 1px solid #D8D9DA;
    background: #FFF;
    color: #151515;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
}
.fc-button-group .fc-button:hover {
    border-radius: 8px;
    border: 1px solid #D8D9DA;
    background: #FFF;
    color: var(--color-black);
}
.fc-direction-ltr .fc-button-group > .fc-button:not(:first-child) {
    border-bottom-left-radius: 8px;
    border-top-left-radius: 8px;
    margin-left: 0px;
}
.fc-direction-ltr .fc-button-group > .fc-button:not(:last-child) {
    border-bottom-right-radius: 8px;
    border-top-right-radius: 8px;
}
.fc-button-group .fc-button.fc-button-active {
    border-radius: 8px;
    background-color: var(--color-primary);
}
.fc .fc-today-button,
.fc .fc-next-button,
.fc .fc-prev-button {
    background-color: #E1E6F1;
    color: #151515;
}
.fc .fc-button-primary:focus {
    box-shadow: none;
}
.fc-theme-standard th .fc-scrollgrid-sync-inner a  {
    display: flex;
    height: 48px;
    padding: 12px;
    align-items: center;
    justify-content: flex-start;
}
.fc-day.fc-day-sat,
.fc-day.fc-day-sun {
    background: #F8F8F8;
}
.fc .fc-daygrid-day-top {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
}
.fc-theme-standard th {
    border-top: 0;
}
.fc-theme-standard .fc-scrollgrid {
    border: 0;
}
.fc-theme-standard td, .fc-theme-standard th {
    border-right: 0;
}
.fc-daygrid-event-dot {
    display: none;
}
.fc-event {
    padding: 8px;
    border-radius: 4px;
    background: rgba(205, 229, 255, 0.70);
    /* margin-left: 12px;
    margin-right: 12px; */
    display: inline-flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
    width: calc(100% - 12px);
    margin: 0 auto;
}

.fc-event-time {
    color: #4F6793;
    font-size: 16px;
    font-weight: 700;
    line-height: 16px;
}
.fc-event-title {
    color: #4F6793;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
}
.fc-event-title.fc-sticky {
    /* color: #fff; */
    color: #4F6793;
    font-size: 16px;
    font-weight: 700;
    line-height: 16px;
}
@media (max-width: 768px) {
    .fc .fc-toolbar {
        flex-direction: column;
        gap: 24px;
    }
    .fc-toolbar-chunk {
        width: 100%;
    }
    .fc .fc-toolbar-chunk:first-child .fc-button-group {
        width: 100%;
        justify-content: flex-start;
    }
    .fc .fc-toolbar-title {
        text-align: center;
    }
    .fc .fc-toolbar-chunk:last-child  .fc-button-group {
        width: 100%;
        justify-content: center;
    }
    .fc .fc-button-group > .fc-button {
        flex: initial;
    }
}

/* /커뮤니티 */
.board-box-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 14px 5px;
    width: 100%;
}
.board-box {
    border-radius: 8px;
    border: 1px solid #D8D9DA;
    background: #F8F8F8;
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10);
    aspect-ratio: 1 / 0.7;
    margin:14px 0;
    overflow: hidden;
}
.board-box a {
    display: block;
    overflow: hidden;
}
.board-box a img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.box-community-top {
    background: #E6EBF5;
    display: flex;
    padding: 40px;
    align-items: flex-start;
    gap: 16px;
    flex-direction: column;
    position: relative;
}
.box-community-top .tit {
    color: var(--color-primary);
    font-size: 32px;
    font-weight: 800;
    line-height: 32px;
}
.box-community-top .description {
    color: var(--color-black);
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    width: 100%;
    max-width: calc(100% - 200px);
}
.box-community-top .button-section {
    position: absolute;
    right: 40px;
    bottom: 40px;
}
@media (min-width: 769px) {
    .tab-menu-wrap.box-type {
        gap: 0;
        width: 100%;
        justify-content: space-around;
        padding-bottom: 0;
    }
    .tab-menu-wrap.box-type .tab-menu {
        width: calc(100% / 3);
        background: #E6EBF5;
        border: 0;
        border-radius: 0;
    }
}
.tab-menu-wrap.box-type .tab-menu.is-active {
    background: var(--color-primary);
}
.tab-content__wrap.box-line {
    border: 1px solid #D8D9DA;
    border-top: 0;
    padding: 64px 32px;
}
.mySwiper.type02 {
    width: 100%;
}
.mySwiper.type02 .swiper-wrapper {
    width: 100%;
}
.slider-inner-box {
    border: 1px solid #D8D9DA;
    background: #F8F8F8;
    width: calc(100% - 116px);
    padding: 32px 0;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    color: var(--color-black);
}
.slider-inner-box .mem-title {
    font-size: 22px;
    font-weight: 700;
    line-height: 32px;
}
.slider-inner-box .mem-name {
    font-size: 18px;
    font-weight: 500;
    line-height: 18px;
}
.mySwiper.type02 .swiper-button-next,
.mySwiper.type02 .swiper-button-prev {
    background-color: transparent;
    border: 0;
    width: 42px;
    height: 42px;
}
.mySwiper.type02 .swiper-button-next:after,
.mySwiper.type02 .swiper-button-prev:after  {
    display: none;
}
.member-detail-wrap {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    gap: 24px;
}
.member-detail-wrap .member-photo {
    border: 1px solid #D8D9DA;
    background: #F8F8F8;
    display: flex;
    width: 240px;
    height: 152px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.member-detail-wrap .member-photo img {
    width: 100%;
    height: auto;
}
.member-detail-wrap .member-detail {
    flex: 1;
}
.member-detail .area-cate {
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
}
.member-detail .tltle {
    font-size: 18px;
    font-weight: 700;
    line-height: 18px;
    margin-top: 8px;
}

.related-gallery {
    border-top: 1px solid #151515;
    border-bottom: 1px solid #D8D9DA;
    padding: 16px;
}
.related-gallery ul {
    display: flex;
    align-items: center;
    gap: 16px;
}
.related-gallery ul li {
    width: calc(100% / 4);
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    position: relative;
}
.related-gallery ul li .thumbnail {
    border: 1px solid #D8D9DA;
    background: #F8F8F8;
    width: 100%;
    aspect-ratio: 1 / 0.7;
    overflow: hidden;
}
.related-gallery ul li .thumbnail img {
    width: 100%;
}
.related-gallery ul li a {
    display: block;
    width: 100%;
    min-height: 200px;
    color: var(--color-black);
}
.related-gallery ul li a .subject {
    margin-top: 16px;
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.related-gallery ul li a .description {
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* 반응형: 화면이 768px보다 작을 때 */
@media (max-width: 768px) {
    .board-box-grid {
        width: 100%;
        overflow-x: auto;
        grid-template-columns: repeat(8, 300px);
    }
    .box-community-top {
        padding: 20px;
    }
    .tab-content__wrap.box-line {
        border: 0;
        padding:64px 16px;
    }
    .box-community-top .tit {
        font-size: 24px;
        line-height: 24px;
    }
    .box-community-top .description {
        font-size: 16px;
        line-height: 24px;
        max-width: 100%;
    }
    .box-community-top .button-section {
        position: relative;
        right: auto;
        bottom: auto;
        display: flex;
        justify-content: flex-end;
        width: 100%;
    }
    .slider-inner-box {
        width: 100%;
        aspect-ratio: 1 / 1;
    }
    .member-detail-wrap {
        flex-direction: column;
        justify-content: flex-start;
    }

    .related-gallery {
        width: 100%;
        overflow-x: scroll;
    }
    .related-gallery ul {
        flex-wrap: nowrap;
    }
    .related-gallery ul li {
        min-width: 90%;
    }
}

.tag-list-light {
    color: #666;
    font-size: 16px;
    font-weight: 400;
    line-height: 18px;
    margin-top: 4px;
}

.img-preview {
    margin-top: 8px;
    width: 200px;
    height: 200px;
    border: 1px solid #D8D9DA;
    background: #F8F8F8;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.img-preview img {
    width: 100%;
    height: auto;
    object-fit: contain;
}
.img-preview.size-80 {
    width: 80px;
    height: 80px;
    margin: 0 auto;
}

/* 공고관리 */
.job-posting-container .tab-container-sort {
    margin-bottom: 24px;
}
.job-posting-container .tab-menu-wrap.box-type .tab-menu{
    width: calc(100% / 2);
}
.job-posting-container .table-wrap.no-line-mg{
    border-top: 2px solid var(--color-black);
}
.job-posting-container .table-list{
    margin-top: 40px;
    word-break: break-all;
    overflow-wrap: break-word;
}
.job-posting-container .table-list .btn + .btn{
    margin-top: 8px;
}
.job-posting-container .table-list .input-area{
    flex-wrap: wrap;
    gap: 8px;
}
.job-posting-container .table-wrap .input-group{
    flex-wrap: wrap;
}
.job-posting-container .button-section{
    text-align: right;
    margin-bottom: 16px;
}
.job-posting-container .input-group.date-group .items{
    display: flex;
    align-items: center;
    gap: 4px;
}
.job-posting-container .check-list .file-input-wrapper input{
    width: 100%;
    height: 40px;
    border: 1px solid var(--color-gray-300);
    border-radius: 6px;
    padding: 0 12px;
    font-size: 15px;
}
.job-posting-container .input-area.ht-100 input[type="text"]{
    height: 100px;
}
.job-posting-container th.add-data{
    background-color: #E6EBF5;
}
.job-posting-container td.delete-btn-box{
    background: #F8F8F8;
    border-left: 1px solid #E1E6F1;
}
.modal-body-container .tab-wid-full.tab-container-full.sticky{
    position: relative;
}
.modal-body-container .tab-wid-full.tab-container-full.sticky .tab-head, .modal-body-container.ht-full.sticky .box-community-top.box-type{
    position: sticky;
    top: 0;
    z-index: 10;
}
@media(max-width: 768px){
    .job-posting-container .tab-container-sort .tab-menu-wrap{
        /* display: none; */
    }
    .job-posting-container .tab-content__wrap.box-line{
        padding: 32px 0 64px;
    }
    .job-posting-container .tab-menu-wrap.box-type .tab-menu{
        width: auto;
    }
    .job-posting-container .input-area[class*="wid"] {
        width: 100%;
    }

}
.login-wrap .login-area{
    width: 400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 24px;
    border-bottom: 1px solid #D8D9DA;
    padding-bottom: 24px;

}
.login-wrap .login-area .login-item .input-area{
    flex-direction: column;
    align-items: flex-start;
}
.login-wrap .login-item .tit{
    font-weight: 700;
}
.login-wrap .login-area .login-item .input-area input{
    flex: none;
    width: 100%
}
.login-wrap .login-area .login-item .button-area{
    margin-top: 0;
    flex-direction: column;
    gap: 8px;
}
.login-wrap .login-area .login-item .button-area .btn{
    width: 100%;
}
.login-wrap .login-area .login-item .desc{
    font-size: 16px;
    color: #666;
}
.login-wrap .find-area{
    width: 400px;
    margin: 24px auto 0;
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 32px 16px;
}
/* .login-wrap .find-area br {
    display: none;
} */
.login-wrap .find-area a{
    text-decoration: underline;
    color: #333;
    font-size: 15px;
}
.login-wrap .welcome-wrap .welcome-tite{
    padding: 24px 40px;
    word-break: keep-all;
}
.login-wrap .data-match{
    border-radius: 16px;
    background-color: #fff;
    padding: 24px;
    display: flex;
    color: #151515;
    margin-top: 24px;
}
.login-wrap .data-match .matched-item{
    font-size: 16px;
    width: 96px;
    text-align-last: left;
}
.login-wrap .data-match .matched-text{
    font-size: 18px;
    font-weight: 700;
}
.login-wrap .login-area > .data-match{
    border-radius: 0;
    background-color: #E6EBF5;
}

.login-card {
    border: 1px solid #D8D9DA;
    border-radius: 32px;
    margin: 0 auto;
    overflow: hidden;
    box-shadow: 0 0 24px rgba(0, 0, 0, 0.1);
}
.login-card + .login-card{
    margin-top: 40px;
}
.login-card .top-bar .tit-box{
    display: flex;
    gap: 16px;
}
.login-card .top-bar .tit.tooltip{
    padding-right: 28px;
    position: relative;
}
.login-card .top-bar .tit.tooltip::after{
    content: "";
    position: absolute;
    display: block;
    background: url(../img/common/tooltip_btn.png) no-repeat;
    width: 24px;
    height: 24px;
    top: 0;
    right: 0;
    cursor: pointer;
}
.login-card .top-bar .txt{
    display: inline-block;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
}
.login-card .top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 25px 40px;
    margin-bottom: 20px;
    font-size: 22px;
    font-weight: bold;
    background-color: #F8F8F8;
}

.login-card .toggle-switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 24px;
}

.login-card .toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.login-card .slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0;
    right: 0; bottom: 0;
    background-color: #ccc;
    border-radius: 24px;
    transition: 0.4s;
}

.login-card .slider::before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: 0.4s;
}

.login-card input:checked + .slider {
    background-color: #2680EB;
}

.login-card input:checked + .slider::before {
    transform: translateX(24px);
}
.login-card .join-member{
    font-size: 15px;
    display: flex;
    gap: 24px;
}
.login-card .join-member .join-member-item{
    display: flex;
    gap: 8px;
    line-height: 24px;
}
.login-card .join-member .btn-pop{
    color: #4F6793;
    position: relative;
    padding-right: 24px;
}
.login-card .join-member .btn-pop::after{
    content: "";
    position: absolute;
    display: block;
    background: url(../img/common/arrow_navy_right.png) no-repeat;
    width: 24px;
    height: 24px;
    top: 0;
    right: 0;
    cursor: pointer;
}
.login-options {
    padding: 40px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.login-box{
    position: relative;
    border-radius: 16px;
    border: 1px solid #D8D9DA;
    padding: 33px 72px 33px 88px;
    word-break: keep-all;
    background-repeat: no-repeat;
    background-position: 24px center;
}
.login-box::after{
    content: "";
    position: absolute;
    display: block;
    background: url(../img/common/ico_arrow2_right.png) no-repeat;
    width: 32px;
    height: 32px;
    top: 50%;
    transform: translateY(-50%);
    right: 24px;
}
.login-box.mobile{
    background-image: url(../img/common/ico_mobile.png);
}
.login-box.easy{
    background-image: url(../img/common/ico_easy.png);
}
.login-box.public{
    background-image: url(../img/common/ico_public.png);
}
.login-box.financial{
    background-image: url(../img/common/ico_financial.png);
}

.login-box h3 {
    margin: 0 0 8px;
    font-size: 22px;
    color: #4F6793;
}

.login-box p {
    font-size: 16px;
    color: #666;
}

.sub-login h4 {
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: bold;
}

.id-login {
    background: #e6f0fd;
    border: 1px solid #91bdfb;
}


@media(max-width: 768px){
    .login-wrap .login-area{
        width: 100%;
    }
    .login-wrap .find-area{
        width: 100%;
    }
    .login-wrap .welcome-wrap{
        max-width: 100%;
    }
    .login-wrap .welcome-wrap .welcome-tite{
        font-size: 18px;
    }
    .login-card .top-bar{
        display: block;
        padding: 24px 20px;
    }
    .login-card .top-bar .tit-box.has-bottom-line{
        border-bottom: 1px solid #D8D9DA;
        padding-bottom: 16px;
        justify-content: space-between;
    }
    .login-card .join-member {
        flex-direction: column;
        gap: 0;
    }
    .login-card .join-member .join-member-item {
        justify-content: space-between;
        margin-top: 16px;
    }
    .login-options{
        grid-template-columns: 1fr;
        padding: 20px;
    }
    .login-card .top-bar .tit{
        font-size: 18px;
        line-height: 24px;
    }
    .login-box{
        padding: 24px 64px 24px 80px;
        background-position: 16px center;
    }
}

/* 공통 - 게시판목록 */
.fix-pin .title-line, .fix-pin .article-details{
    position: relative;
    padding-right: 28px;
    width: 100%;
}
.fix-pin .title-line::after{
    content: url('../img/common/fix_pin_on.png');
    position: absolute;
    top: 0;
    right: 0;
}
.fix-pin .article-details::after{
    content: url('../img/common/fix_pin_on.png');
    position: absolute;
    top: 16px;
    right: 0;
}
.fix-pin .article-title.file::after{
    content: '';
    flex:0 0 auto;
    background-image: url('../img/common/ico_file.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    width: 48px;
    height: 40px;
    display: inline-block;
    margin-left: 8px;
}
.job-card-grid.masonry-grid{
    position: relative;
    display: block;
}
.job-card-grid.masonry-grid::after {
    content: "";
    display: block;
    clear: both;
}
.job-card-grid.masonry-grid .job-card {
    float: left;
    margin-bottom: 20px;
}
@media(max-width: 768px){
    .fix-pin .article-details::after{
        top: 30px;
    }
    .fix-pin .article-title.file::after{
        width: 40px;
        height: 34px;
        vertical-align: bottom;
    }
    .article-title.file{
        display: inline;
    }
    .job-card-grid.masonry-grid{
        display: flex;
        align-items: flex-start;
    }
}

.job-posting-container.global-search{
    display: flex;
    gap : 24px;
}
.job-posting-container.global-search .tab-container-full{
    width: 1194px;
}
.job-posting-container.global-search .tab-menu-wrap.scroll-tab .font-body-style3.tab-menu{
    display: block;
}
.job-posting-container.global-search .article-result{
    font-size: 18px;
    color: #151515;
}
.tab-menu-wrap .result-count{
    font-size: 15px;
    display: block;
    color: #999;
}
.tab-menu.is-active .result-count{
    color: #fff;
}
.result-keyword{
    color: var(--color-secondary);
}
.job-posting-container.global-search .article-details{
    flex: 1;
}
.job-posting-container.global-search .article-tag{
    width: auto;
    padding: 16px 24px;
}
.job-posting-container.global-search .article-bottom{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.job-posting-container.global-search .sort-wrap{
    display: flex;
    gap: 16px;
    border-top: 1px solid #151515;
    border-bottom: 1px solid #D8D9DA;
    padding: 16px;
}
.job-posting-container.global-search .sort-wrap .input-area{
    width: 200px;
}
.job-posting-container.global-search .button-area.btn-load-more{
    margin: 64px 0;
}
.job-posting-container.global-search .search-keyword{
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.job-posting-container.global-search .search-keyword .search-box {
    border: 1px solid #ccc;
    border-radius: 0 8px 8px 8px;
    overflow: hidden;
}
.job-posting-container.global-search .search-keyword .search-list{
    padding: 20px;
}
.job-posting-container.global-search .search-keyword .search-list li+li{
    margin-top: 8px;
}
.job-posting-container.global-search .search-keyword .search-box-title{
    color: #4F6793;
    font-size: 16px;
    position: relative;
    background-color: #f8f8f8;
    padding: 16px 20px;
}
.job-posting-container.global-search .search-keyword .search-box-title::before{
    content: "";
    width: 2px;
    height: 14px;
    background-color: #4F6793;
    display: inline-block;
    margin: 2px 8px 0 0;
}
.job-posting-container.global-search .center-filter-list,
.center-filter-list2{
    position: absolute;
    bottom: -92px;
    right: 16px;
    border: 2px solid #0178FF;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.55);
    border-radius: 16px;
    padding: 16px;
    background-color: #fff;
    z-index:100;
}
.job-posting-container.global-search .center-filter-list .pc-view{
    display: block;
}
.job-posting-container.global-search .center-filter-list .mo-view{
    display: none;
}
.job-posting-container.global-search .center-filter-list .center-filter-list-inner,
.center-filter-list2 .center-filter-list-inner{
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap:wrap;
}
.job-posting-container.global-search .tab-head{
    position: relative;
}
@media (max-width: 768px) {
    .job-posting-container.global-search .tab-menu-wrap.box-type .tab-menu{
        border-radius: 0;
        border: 0;
    }
    .job-posting-container.global-search .tab-menu-wrap.box-type{
        gap: 0;
        border-top: 1px solid #151515;
    }
    .job-posting-container.global-search .search-keyword{
        display: none;
    }
    .job-posting-container.global-search .sort-wrap{
        flex-direction: column;
    }
    .job-posting-container.global-search .sort-wrap li:last-child{
        text-align: right;
    }
    .job-posting-container.global-search .article-title{
        display: block;
    }
    .job-posting-container.global-search .article-bottom .color-gray{
        display: none;
    }
    .job-posting-container.global-search .article-bottom .article-keywords{
        flex-wrap: wrap;
    }
    .job-posting-container.global-search .tab-head{
        position: unset;
    }
    .job-posting-container.global-search .center-filter-list{
        position: fixed;
        bottom: 0;
        right: 0;
        border: none;
        width: 100%;
    }
    .job-posting-container.global-search .center-filter-list .pc-view{
        display: none;
    }
    .job-posting-container.global-search .center-filter-list .mo-view{
        display: block;
    }
    .job-posting-container.global-search .center-filter-list .mo-view .center-filter-list-inner{
        flex-direction: column;
        gap: 0;
        overflow-y: auto;
        max-height: 320px;
    }
    .job-posting-container.global-search .center-filter-list .mo-view .center-filter-list-inner li{
        width: 100%;
        text-align: left;
    }
    .job-posting-container.global-search .center-filter-list .mo-view .center-filter-list-inner .btn{
        width: 100%;
        border-top: 1px solid #eee;
        background-color: transparent;
        line-height: 50px;
    }
}



.search-form-top {
    display: flex;
    justify-content: flex-end;
    padding: 16px 0;
    margin-top: 24px;
}
.search-form-top .input-group {
    max-width: 432px;
}
@media (max-width: 768px) {
    .search-form-top {
        justify-content: center;
    }
    .search-form-top  {
        padding: 0 16px;
        max-width: 100%;
    }
}

.card-list-section {
    margin-top: 24px;
    width: 100%;
    position: relative;
}
.card-list-section .card-list-wrap {
    display: flex;
    align-items: center;
    gap: 16px;
}
.card-list-section .card-list-wrap li {
    width: calc(100% / 4);
}
.card-list-section .card-list-wrap li .card-link {
    border-radius: 32px;
    border: 1px solid #D8D9DA;
    background: #FFF;
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.10);
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    padding: 40px 24px;
    overflow: hidden;
}
.card-list-section .card-list-wrap li .card-link .thumb {
    border-radius: 8px;
    border: 1px solid #D8D9DA;
    background: #F8F8F8;
    width: 100%;
    aspect-ratio: 1 / 0.7;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.card-list-section .card-list-wrap li .card-link .thumb img {
    width: 100%;
    height: auto;
    object-fit: contain;
}
.card-list-section .card-list-wrap li .card-link .text-wrap {
    width: 100%;
    margin-top: 24px;
}
.card-list-section .card-list-wrap li .card-link .text-wrap .title {
    font-size: 22px;
    font-weight: 700;
    line-height: 32px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}
.card-list-section .card-list-wrap li .card-link .text-wrap .desc {
    color: #666;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 8px;
}
@media (max-width: 768px) {
    .card-list-section {
        overflow-x: auto;
        padding: 16px 24px 16px 16px;
    }
    .card-list-section .card-list-wrap {
        flex-wrap: nowrap;
    }
    .card-list-section .card-list-wrap li {
        min-width: 75vw;
        width: 75vw;
    }

    .content-section.mo-no-padding {
        padding: 64px 0px 64px;
    }
    .content-section.mo-no-padding .box-type.job-title.type02 {
        margin: 0 16px;
    }
    .content-section.mo-no-padding .h3-title {
        margin: 40px 16px 0;
    }
    .content-section.mo-no-padding .table-wrap,
    .content-section.mo-no-padding .editor-content-area {
        margin: 24px 16px 0;
        width: auto;
    }
    .content-section.mo-no-padding .button-area.flex-end {
        margin: 24px 16px 0;
    }

}

.share-url-box {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border-bottom: 1px solid #D8D9DA;
    background: #fff;
    padding: 8px 16px;
}
.share-url-box .input-area {
    width: 100%;
    border: 0;
    border-radius: 8px;
}
.share-url-box button {
    width: 100px;
}
.share-sns-list {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 40px 0;
    flex-wrap: wrap;
}
.share-sns-list button {
    width: calc((100% - 16px) / 3);
}

.box-organ-wrap {
    background-color: #E6EBF5;
    padding: 12px 16px;
    margin-top: 8px;
    width: 100%;
    max-width: 400px;
    font-weight: 400;
    font-size: 15px;
    line-height: 15px;
    letter-spacing: -2%;
}
.box-type-inner-title {
    border-bottom: 1px solid #C0CADD;
    padding-bottom: 8px;
}
.box-type-inner-content {
    padding: 8px 0;
    line-height: 26px;
}
@media (max-width: 768px) {
    .share-sns-list {
        overflow-y:auto;
        max-height:55vh;
        margin:40px 0 16px;

    }
    .share-sns-list button {
        width: 100%;
        padding: 16px 0;
        height: auto;
    }
    .box-organ-wrap {
        max-width: 100%;
    }
}

.member-type-wrap {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: center;
}
.member-type-wrap .btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    max-width: 216px;
    height: auto;
    padding: 24px 0;
    border-radius: 16px;
}
.member-type-wrap .btn .tit {
    font-weight: 800;
    font-size: 22px;
    line-height: 22px;
    letter-spacing: -2%;
    color: #4F6793;
}
.member-type-wrap .btn .desc {
    font-weight: 400;
    font-size: 16px;
    line-height: 16px;
    color: #666;
}
@media (max-width: 768px) {
    .member-type-wrap {
        flex-direction: column;
    }
    .member-type-wrap .btn {
        max-width: 212px;
    }
}

.certification-desc {
    font-family: Pretendard;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
}

.compnay-certification-wrap {
    border-top:1px solid #D8D9DA;
    padding: 24px 0;
    margin-top: 24px;
}

.member-certification-wrap {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.member-certification-wrap .certification-text {
    font-weight: 700;
    font-size: 18px;
    line-height: 18px;
    color: #151515;
}
.member-certification-wrap .btn {
    width: 100%;
}
.member-certification-wrap .certification-guide {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    background: #E6EBF5;
    padding: 16px;
    margin-top: 8px;
}
.member-certification-wrap .certification-guide .guide-text {
    font-size: 16px;
    font-weight: 400;
    width: 100%;
    border-bottom: 1px solid #C0CADD;
    padding-bottom: 16px;
}
.member-certification-wrap .certification-guide .guide-text:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.member-certification-wrap .certification-guide .guide-text .tit {
    font-weight: 700;
    color: #4F6793;
}
.member-certification-wrap .certification-guide .guide-text p {
    margin:4px 0 8px;
    color: #151515;
    font-family: Pretendard;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
}
.member-certification-wrap .certification-guide .guide-text ul {
    margin-top: 8px;
}
.member-certification-wrap .certification-guide .guide-text ul li {
    color: #151515;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    padding-left: 10px;
    position: relative;
}
.member-certification-wrap .certification-guide .guide-text ul li::before {
    content: '';
    display: block;
    width: 4px;
    height: 4px;
    background: #151515;
    position: absolute;
    left: 0;
    top: 10px;
    border-radius: 50%;
}
.member-benefit-wrap {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    background: #4F6793;
    padding: 40px 20px 160px;
    margin-top: 48px;
    position: relative;
}
.member-benefit-wrap::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/common/bg-dot.png) no-repeat right top;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}
.member-benefit-wrap::after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/common/bg-box-bottom.png) no-repeat right bottom;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 2;
}
.member-benefit-wrap .benefit-desc {
    color: #CDD9EA;
    font-weight: 500;
    font-size: 22px;
    line-height: 32px;
}
.member-benefit-wrap .benefit-tit {
    color: #FFF;
    font-weight: 700;
    font-size: 22px;
    line-height: 32px;
}
.member-benefit-wrap .benefit-list {
    margin-top: 40px;
}
.member-benefit-wrap .benefit-list li {
    color: #CDD9EA;
    font-weight: 400;
    font-size: 18px;
    line-height: 20px;
    padding-left: 10px;
    position: relative;
    margin-bottom: 8px;
}
.member-benefit-wrap .benefit-list li::before {
    content: '';
    display: block;
    width: 4px;
    height: 4px;
    background: #CDD9EA;
    position: absolute;
    left: 0;
    top: 10px;
    border-radius: 50%;
}
.member-benefit-wrap .benerfit-bottom-text {
    color: #fff;
    font-weight: 600;
    font-size: 22px;
    line-height: 32px;
    margin-top: 32px;
}

.table-wrap.join-info-wrap {
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
}
.table-wrap.join-info-wrap .table-body-only {
    border-top: 1px solid #151515;
}
.table-wrap.join-info-wrap .join-info-text {
    color: #666;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.table-wrap.join-info-wrap .interest-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.table-wrap.join-info-wrap .interest-grid .check-wrap {
    width: calc((100% - 32px) / 3);
}
.table-wrap.join-info-wrap .interest-grid .check-wrap.long-type {
    width: 48%;
}
@media (max-width: 768px) {
    .table-wrap.join-info-wrap .interest-grid {
        flex-direction: column;
    }
    .table-wrap.join-info-wrap .interest-grid .check-wrap {
        width: 100%;
    }
    .table-wrap.join-info-wrap .interest-grid .check-wrap.long-type {
        width: 100%;
    }
}

.join-info-title {
    font-weight: 700;
    font-size: 18px;
    line-height: 18px;
    color: #151515;
    margin-top: 24px;
}
.insurance-check-list {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}
.insurance-check-list .check-wrap {
    width: calc((100% - 48px) / 4);
}
.employee-count-wrap {
    display: flex;
    gap: 16px;
}
.employee-count-wrap .employee-count-item {
    width: auto;
    display: flex;
    align-items: center;
    gap: 4px;
}
.employee-count-wrap .employee-count-item input {
    width: 100%;
    text-align: right;
}
@media (max-width: 768px) {
    .insurance-check-list {
        flex-wrap: wrap;
    }
    .insurance-check-list .check-wrap input[type="checkbox"]+label>span {
        white-space: nowrap;
    }
    .insurance-check-list .check-wrap {
        width: calc((100% - 16px) / 2);
    }
    .radio-item3 {
        flex-wrap: wrap;
    }
    .radio-item3 .radio-item {
        white-space: nowrap;
    }

    .employee-count-wrap {
        flex-direction: column;
    }
}

.welcome-wrap {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.welcome-wrap .welcome-title {
    font-weight: 700;
    font-size: 22px;
    line-height: 32px;
    color: #151515;
    background-color: #E6EBF5;
    padding: 24px 16px;
    color:#4F6793;
    text-align: center;
}
.welcome-wrap .welcome-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #151515;
    text-align: center;
    border-bottom: 1px solid #D8D9DA;
    padding: 24px 16px;
    margin-bottom: 24px;
}
.welcome-wrap .welcome-text.no-signup{
    border-bottom: 0;
    margin: 0;
}
.welcome-wrap .btn-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 공통 */
.mt-0 {
    margin-top: 0 !important;
}

.mt-8 {
    margin-top: 8px;
}
.mt-16 {
    margin-top: 16px;
}
.mt-20 {
    margin-top: 20px;
}
.mt-40 {
    margin-top: 40px;
}

.mt-24 {
    margin-top: 24px;
}
.mt-64 {
    margin-top: 64px;
}
.mt-32 {
    margin-top: 32px;
}
.pt-0 {
    padding-top: 0;
}
.pdl-16 {
    padding-left: 16px;
}
.gap10 {
    gap: 10px;
}
.ht-100 {
    height: 100px
}
.wid100p {
    width: 100%;
}
.wid72 {
    width: 72px;
}
.wid88 {
    width: 88px;
}
.wid120 {
    width: 120px;
}
.wid100 {
    width: 100px;
}
.wid160 {
    width: 160px;
}
.wid200 {
    width: 200px;
}
.wid300 {
    width: 300px;
}
.wid400 {
    width: 400px;
}
.button-wid150 {
    width: 150px;
    padding: 0;
}
.wid35p {
    width: 35%;
}
.wid70p {
    width: 70%;
}
.block {
    display: block !important;
}
.text-l {
    text-align: left !important;
}
.flex {
    display: flex;
}
/* flex 공통 */
.align-items-center {
    align-items: center;
}
.text-l {text-align: left;}
/* border 공통 */
.no-border {
    border: none !important;
}

.text-link-underline {
    text-decoration: underline;
    color: #666;
    font-weight: 400;
    font-size: 16px;
    line-height: 18px;
    letter-spacing: -2%;
}
.font-bold {
    font-weight: 800;
}

.flex-direction {
    flex-direction: column;
}

.flex-justify-between {
    display: flex;
    justify-content: space-between;
}

.butotn-area.flex-justify-between {
    display: flex;
    justify-content: space-between;
}
.justify-center {
    justify-content: center;
}
.justify-start {
    justify-content: start;
    align-items: flex-start !important;
}
.align-item-start {
    align-items: flex-start;
}

.pc-cell {
    display: table-column-group;
}

.mo-cell {
    display: none;
}

@media (max-width: 768px) {
    .mo-cell {
        display: table-column-group;
    }
    .pc-cell {
        display: none;
    }
}

.pc-only {
    display: inline-flex;
}

.mo-only {
    display: none;
}

@media (max-width: 768px) {
    .pc-only {
        display: none;
    }
    .mo-only {
        display: inline-flex;
    }
}
.file-color {
    color: var(--color-primary);
}
.color-gray {
    color: #666;
}
.color-highlight {
    color:#FF4C4C;
}
.color-hilight {
    color:#FF4C4C;
}
.color-primary {
    color: var(--color-primary);
}