@charset "UTF-8";
/* layout */
html,
body {
    width: 100%;
    height: 100%;
}
body.fixed {
    overflow-y: hidden;
}
.main {
    width: 100%;
    height: 100%;
    padding-top: 160px;
}
#wrap {
    width: 100%;
    min-height: 100%;
    position: relative;
    padding-bottom: 346px;
}
.container {
    width: 100%;
    padding: 0 20px;
    max-width: 1460px;
    margin: 0 auto;
}
/* Header */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 160px;
    z-index: 101;
    background-color: #fff;
}
.header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 20px;
    max-width: 1460px;
    margin: 0 auto;
}
.header__top {
    width: 100%;
    height: 80px;
}
.logo {
    display: inline-block;
    width: 164px;
    height: auto;
}
.logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.form_header_search {
    width: 100%;
    max-width: 400px;
}
.form_header_search .input_search {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 800px;
    background-color: #fff;
    border: 1px solid #e5e5ec;
    padding: 0 20px;
    height: 52px;
}
.form_header_search .input_search input {
    padding: 0;
    border: none;
    flex: 1;
    font-weight: 500;
}
.form_header_search .input_search .btn_search {
    display: inline-block;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    background: url(../_img/icon/icon_search.svg) no-repeat center center /
    contain;
}
.header__top .mo_header_btns {
    display: none;
}
.header__top .mo_header_btns .btn_icon {
    display: inline-block;
    width: 28px;
    height: 28px;
}
.header__top .mo_header_btns .btn_search {
    background: url(../_img/icon/icon_search.svg) no-repeat center / contain;
}
.header__top .mo_header_btns .btn_mo_menu {
    background: url(../_img/icon/icon_mo_menu.svg) no-repeat center / contain;
}
.header__bottom {
    width: 100%;
    height: 80px;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    border-bottom: 1px solid #e5e5ec;
}
nav.gnb {
    height: 100%;
    position: relative;
}
nav.gnb .active_bar {
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 0px;
    height: 3px;
    transition: left 0.35s ease-in-out;
    pointer-events: none;
    background-color: var(--color-primary);
}
nav.gnb > ul {
    display: flex;
    align-items: center;
    height: 100%;
    position: relative;
}
nav.gnb .gnb_1depth--li {
    flex-shrink: 0;
    display: inline-block;
    height: 100%;
    padding-right: 40px;
    position: relative;
}
nav.gnb .gnb_1depth--li:last-child {
    padding-right: 0;
}
nav.gnb .gnb_1depth--li > a {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    font-size: 18px;
    font-weight: 500;
    color: #111111;
}
nav.gnb .gnb_1depth--li.active > a {
    font-weight: 700;
    color: var(--color-primary);
}
nav.gnb .gnb_2depth {
    display: none;
    position: absolute;
    left: 0;
    bottom: 0;
}
nav.gnb .gnb_1depth--li.active .gnb_2depth {
    display: block;
}
nav.gnb .gnb_2depth--ul {
    display: flex;
    align-items: center;
    height: 49px;
    gap: 20px;
    position: absolute;
}
nav.gnb .gnb_2depth--li {
    display: inline-block;
    height: 100%;
}
nav.gnb .gnb_2depth--li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: max-content;
    height: 100%;
    padding: 8px;
    font-size: 18px;
    font-weight: 500;
    color: #505050;
}
nav.gnb .gnb_2depth--li a:hover {
    color: #111;
    font-weight: 700;
}
.header__btns {
    display: flex;
    align-items: center;
    gap: 8px;
}
.header__btns .btn {
    height: 46px;
    line-height: 46px;
    font-weight: 700;
    padding: 0 24px;
}
.header__btns .member_nm,
.header--type2 .member_nm {
    font-weight: 700;
    color: #111;
    padding: 0 8px;
}
.header__btns span.member_badge,
.header--type2 span.member_badge {
    display: inline-block;
    width: auto;
    padding: 0 8px;
    height: 30px;
    line-height: 30px;
    border-radius: 6px;
    color: #fff;
    background-color: var(--color-primary);
    font-size: 16px;
    font-weight: 500;
}
.header__bottom .nav_bg {
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    height: 49px;
    background-color: #f7f8fa;
    z-index: -1;
    border-bottom: 1px solid #e5e5ec;
    transition: 0.35s;
}
.header__bottom.open {
    overflow: inherit;
}
.header__bottom.open .nav_bg {
    bottom: -49px;
}
aside.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100dvh;
    z-index: 100000;
    background-color: #000000b2;
    visibility: hidden;
}
aside.sidebar.open {
    visibility: visible;
}
aside.sidebar .sidebar__inner {
    width: 288px;
    height: 100%;
    position: absolute;
    right: -288px;
    transition: 0.35s;
    top: 0;
    background-color: #fff;
    border-radius: 24px 0 0 24px;
}
aside.sidebar.open .sidebar__inner {
    right: 0;
}
aside.sidebar .sidebar__close {
    width: 100%;
    height: 56px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0 20px;
}
aside.sidebar .sidebar__close .btn_close_sidebar {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(../_img/icon/icon_sidebar_close.svg) no-repeat center /
    contain;
}
aside.sidebar .sidebar__header {
    padding: 16px;
    border-bottom: 1px solid #f1f1f5;
}
.sidebar__header .header--type1 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.sidebar__header .header--type1 .btn_login,
.sidebar__header .header--type1 .btn_signup {
    width: calc(50% - 4px);
}
.sidebar__header .header--type2 .btn_signout {
    padding: 0 16px;
}
.sidebar__header .header--type1 .btn_reg_artist {
    width: 100%;
}
.sidebar__header .header--type2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}
.sidebar__header .btn {
    font-size: 14px;
    font-weight: 700;
}
.header--type2 .member_info {
    display: flex;
    align-items: center;
    gap: 8px;
}
.header--type2 .member_nm {
    padding: 0;
    font-size: 14px;
}
.header--type2 span.member_badge {
    height: 28px;
    line-height: 28px;
    font-size: 14px;
}
.sidebar__contents {
    padding: 16px;
}
.sidebar__contents .gnb__wrap {
    height: 100%;
    overflow-y: auto;
    padding-right: 8px;
}
.sidebar__gnb .gnb_1depth--li > a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 48px;
    position: relative;
    font-size: 14px;
    font-weight: 500;
}
.sidebar__gnb .gnb_1depth--li > a.active {
    font-weight: 700;
    color: var(--color-primary);
}
.sidebar__gnb .gnb_1depth--li > a::after {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    right: 0;
    transition: 0.35s;
    transform: translateY(-50%);
    background: url(../_img/icon/icon_gnb_arrow.svg) no-repeat center / contain;
}
.sidebar__gnb .gnb_1depth--li > a.active::after {
    transform: translateY(-50%) scaleY(-1);
}
.sidebar__gnb .gnb_2depth {
    display: none;
    padding: 8px 16px;
    background-color: #f1f1f5;
    border-radius: 16px;
}
.sidebar__gnb .gnb_2depth--ul .gnb_2depth--li > a {
    display: flex;
    align-items: center;
    width: 100%;
    height: 36px;
    font-size: 13px;
    color: #333333;
    font-weight: 500;
}
/* Footer */
.footer {
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -346px;
    height: 346px;
    transform: translateY(-100%);
    background-color: #1a1a1a;
    color: #fff;
}
.footer__inner {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 0 20px;
    max-width: 1460px;
    margin: 0 auto;
}
.footer__info {
    flex-shrink: 0;
    width: 390px;
    padding-top: 26px;
    padding-right: 80px;
    border-right: 1px solid #333333;
}
.footer__info .logo {
    width: 164px;
}
.footer__info .footer_info {
    margin-top: 48px;
}
.footer__info .footer_info li {
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 8px;
}
.footer__gnb {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 0 80px;
    flex: 1;
    padding-top: 40px;
}
.footer__gnb .footer_gnb--div {
    flex: 1;
}
.footer__gnb .footer_gnb--title {
    font-size: 15px;
    line-height: 22px;
    font-weight: 600;
    margin-bottom: 16px;
}
.footer_gnb--div ul li {
    margin-bottom: 12px;
}
.footer_gnb--div ul li a {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 20px;
    color: #999999;
}
.footer__contact {
    width: 367px;
    padding-left: 80px;
    padding-top: 40px;
    border-left: 1px solid #333333;
}
.footer__contact h2.contact_tel {
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    color: #fff;
    margin-bottom: 4px;
}
.footer__contact p.contact_time {
    font-size: 14px;
    line-height: 20px;
}
.footer-term__link {
    display: flex;
    align-items: center;
    margin: 16px 0 40px;
    gap: 16px;
}
.footer-term__link li a {
    text-decoration: underline;
    font-size: 14px;
}
.footer__contact p.copyright {
    font-size: 13px;
    line-height: 18px;
}
.scroll_top {
    transition: 0.35s;
    position: fixed;
    bottom: 64px;
    right: 64px;
    z-index: 1000;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background-color: #fff;
    border: 1px solid #e5e5ec;
    box-shadow: 0 4px 16px rgb(0, 0, 0, 0.08);
    display: none;
}
.scroll_top span {
    padding-top: 20px;
    font-size: 13px;
    font-weight: 600;
    color: #111;
    position: relative;
}
.scroll_top span:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    background: url(../_img/icon/icon_scrolltop.svg) no-repeat center / contain;
}
.space_flex{
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 36px;
}
.table_wrap .ico {
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    vertical-align: middle;
    overflow: hidden;
    text-indent: -9999px;
    overflow: hidden;
    text-align: left;
}
.table_wrap .ico-notice-md {
    width: 16px;
    height: 16px;
    background-image: url(../../neibis/images/ico-notice-md@2x.png);
}
.table_wrap .sr-only {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    margin: 0 !important;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}
.swiper-navigation-icon{
    display: none;
}
@media screen and (max-width: 1400px) {
    .footer__info {
        width: 300px;
        padding-right: 40px;
    }
    .footer__gnb {
        padding-left: 40px;
        padding-right: 40px;
    }
    .footer__contact {
        width: 300px;
        padding-left: 40px;
    }
}
@media screen and (max-width: 1100px) {
    .footer__gnb {
        display: none;
    }
}
@media screen and (max-width: 767px) {
    .main {
        padding-top: 56px;
    }
    #wrap {
        padding-bottom: 474px;
    }
    .header {
        height: 56px;
    }
    .header__top {
        height: 56px;
    }
    .logo {
        width: 133px;
        height: auto;
    }
    .form_header_search {
        display: none;
    }
    .header__bottom {
        display: none;
    }
    nav.gnb {
        overflow-y: hidden;
        overflow-x: auto;
    }
    nav.gnb::-webkit-scrollbar {
        display: none;
    }
    nav.gnb .gnb_1depth--li {
        padding-right: 24px;
    }
    nav.gnb .gnb_1depth--li > a {
        font-size: 16px;
    }
    nav.gnb .gnb_2depth--ul {
        display: none;
    }
    .header__btns {
        display: none;
    }
    .header__top .mo_header_btns {
        display: flex;
        align-items: center;
        gap: 12px;
    }
    .header__bottom .nav_bg {
        display: none;
    }
    .footer {
        bottom: -474px;
        height: 474px;
    }
    .footer__inner {
        flex-direction: column;
        align-items: flex-start;
        padding-top: 56px;
        row-gap: 32px;
    }
    .footer__info {
        width: 100%;
        padding-top: 0;
        padding-right: 0;
        border-right: none;
    }
    .footer__info .logo {
        width: 133px;
    }
    .footer__info .footer_info {
        margin-top: 20px;
    }
    .footer__contact {
        width: 100%;
        padding-left: 0;
        padding-top: 0;
        border-left: none;
    }
    .footer__contact h2.contact_tel {
        font-size: 20px;
        line-height: 24px;
    }
    .footer-term__link {
        margin-bottom: 33px;
    }
    .scroll_top {
        bottom: 30px;
        right: 30px;
    }
}
.scroll--pink::-webkit-scrollbar {
    width: 4px;
    height: 4px;
}
.scroll--pink::-webkit-scrollbar-thumb {
    height: 30%;
    background: #ee6575;
    border-radius: 10px;
}
.scroll--pink::-webkit-scrollbar-track {
    background: #f1f1f5;
    border-radius: 20px;
}
.scroll::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.scroll::-webkit-scrollbar-thumb {
    height: 30%;
    background: #f1f1f5;
    border-radius: 10px;
}
.scroll::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 20px;
}
.title_area {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.title_area h3 {
    font-size: 28px;
    font-weight: 700;
    color: #111;
}
/* Card CSS */
.art__card .art_thum {
    width: 100%;
    height: 320px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #f1f1f5;
}
.art__card .art_thum img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    cursor: pointer;
}
.art__card .art_desc {
    margin-top: 12px;
}
.art__card .art_desc h3 {
    width: 100%;
    font-size: 18px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.art__card .art_info {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #f1f1f5;
}
.art__card .art_info p {
    margin-bottom: 10px;
    font-weight: 500;
    color: #767676;
}
.art__card .art_info p:last-child {
    margin-bottom: 0;
}
.art__card .art_info .date,
.art__card .art_info .loc {
    position: relative;
    padding-left: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.art__card .art_info .date::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../_img/icon/icon_calendar.svg) no-repeat center / contain;
}
.art__card .art_info .loc::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../_img/icon/icon_loc.svg) no-repeat center / contain;
}
.artist__card {
    border-radius: 20px;
    overflow: hidden;
}
.artist__card .artist_thum {
    width: 100%;
    height: 240px;
    overflow: hidden;
}
.artist__card .artist_thum img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.artist__card .artist_desc {
    width: 100%;
    padding: 16px;
    height: 141px;
    background-color: #fff;
    position: relative;
}
.artist__card .artist_desc h3 {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    height: 44px;
    padding-right: 40px;
}
.artist_info {
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid #f1f1f5;
}
.artist_info a {
    font-size: 14px;
    font-weight: 500;
    color: #767676;
}
.artist_info a {
    padding-left: 24px;
    position: relative;
}
.artist_info a::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.artist__card .btn_like {
    position: absolute;
    top: 16px;
    right: 16px;
}

.portfolio__cont .artist_info {
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid #f1f1f5;
}
.portfolio__cont .artist_info p {
    font-size: 14px;
    font-weight: 500;
    color: #767676;
    padding-left: 24px;
    position: relative;
}
.portfolio__cont .artist_info p::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);

}

.artist_info a.home::before, .portfolio__cont .artist_info p.home::before {
    background: url(../_img/icon/icon_home.svg) no-repeat center / contain;
}
.artist_info a.insta::before, .portfolio__cont .artist_info p.insta::before {
    background: url(../_img/icon/icon_instagram.svg) no-repeat center / contain;
}
.artist_info a.kakao::before, .portfolio__cont .artist_info p.kakao::before {
    background: url(../_img/icon/icon_talk.svg) no-repeat center / contain;
}
.artist_info a.youtube::before, .portfolio__cont .artist_info p.youtube::before {
    background: url(../_img/icon/icon_youtube.svg) no-repeat center / contain;
}


@keyframes likeAnimation {
    0% {
        transform: scale(1);
    }
    40% {
        transform: scale(1.15);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}
/* Status Badge */
.status_badge {
    display: inline-block;
    width: auto;
    padding: 0 8px;
    min-width: 64px;
    font-size: 14px;
    font-weight: 700;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 6px;
}
.status_badge.plan {
    background-color: #fef3f4;
    color: var(--color-primary);
}
.status_badge.ing {
    background-color: #f3f3fe;
    color: #656cee;
}
.status_badge.end {
    background-color: #f1f1f5;
    color: #999999;
}
.status_badge.return, .status_badge.refuse{
    background-color: #fef3f3;
    color: #ff5a3d;
}
/* Form */
.input_combined {
    border-radius: 8px;
}
.input_combined .input_box:first-child .form-control {
    border-radius: 8px 8px 0 0;
    border-bottom-width: 0.5px;
}
.input_combined .input_box:last-child .form-control {
    border-radius: 0 0 8px 8px;
    border-top-width: 0.5px;
}
.input_combined.invalid {
    border: 1px solid #e80808;
}
.input_combined.invalid .input_box:first-child .form-control {
    border: none;
}
.input_combined.invalid .input_box:last-child .form-control {
    border: none;
    border-top: 1px solid #e5e5ec;
}
.input_box {
    width: 100%;
    position: relative;
}
.input_box .btns {
    display: flex;
    align-items: center;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}
.input_box .btn_delete {
    display: none;
    width: 20px;
    height: 20px;
    background: url(../_img/icon/icon_input_delete.svg) no-repeat center / contain;
}
.input--typeA {
    margin-bottom: 16px;
}
.input--typeA:last-of-type {
    margin-bottom: 0;
}
.input--typeA .input_label {
    font-size: 14px;
    font-weight: 500;
    color: #111;
    display: block;
    text-align: left;
    margin-bottom: 8px;
}
.input--typeA .input_label span.required {
    display: inline-block;
    margin-left: 2px;
    color: var(--color-primary);
    font-weight: 600;
}
.input--typeA .input_label .icon_info {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 8px;
    vertical-align: middle;
    background: url(../_img/icon/icon_info_gray.svg);
}
.input--typeA .form-control.disabled {
    color: #fff;
    background-color: #D7D4D4;
}
.input_tel {
    display: flex;
    align-items: center;
    gap: 8px;
}
.input_tel .select--typeA,
.input_tel .form-control {
    flex: 1;
}
.input_tel span {
    font-weight: 500;
    color: #111;
}
.input_email {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #767676;
}
.input_email .btn_duplicate {
    width: 80px;
    font-weight: 500;
    flex-shrink: 0;
}
.form_search .search_box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.form_search .search_box.flex {
    justify-content: space-between;
    margin-bottom: 32px;
}
.form_search .search_box .select--typeB {
    min-width: 160px;
}
.form_search .search_box .select_type {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.form_search .search_input {
    width: 100%;
    max-width: 400px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #e5e5ec;
    border-radius: 800px;
    padding: 0 20px;
}
.form_search .search_input.w560 {
    max-width: 560px;
}
.form_search .search_input .form-control {
    border: none;
    padding: 0;
    height: 52px;
}
.form_search .search_input .btn_search {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(../_img/icon/icon_search.svg) no-repeat center center /
    contain;
}
.search_period {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
}
.search_period span {
    font-size: 16px;
    font-weight: 500;
    color: #111;
}
/* 공통 등록 페이지 */
.common-reg__inner {
    padding: 0 20px;
    padding-top: 80px;
    padding-bottom: 156px;
    max-width: 640px;
    margin: 0 auto;
}
.common-reg__box {
    background-color: #fff;
    padding: 72px 56px;
    border-radius: 24px;
}
.common-reg__box .info_box {
    margin-top: 12px;
    margin-bottom: 40px;
}
.select-radio_box {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    padding: 14px 16px;
    border-radius: 8px;
    background-color: #f7f8fb;
}
.flex_box {
    display: flex;
    align-items: center;
    gap: 8px;
}
.relative_box {
    position: relative;
}
.relative_box .form-control {
    padding-right: 48px;
}
.relative_box .btn_search {
    display: inline-block;
    width: 24px;
    height: 24px;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    background: url(../_img/icon/icon_search.svg) no-repeat center / contain;
}
@media screen and (max-width: 768px) {
    .common-reg__inner {
        padding: 0;
    }
    .common-reg__box {
        border-radius: 0px;
        padding: 48px 20px 160px;
    }
    .common-reg__box .info_box {
        margin-bottom: 32px;
    }
    .common-reg__inner .btn_area.mt40 {
        margin-top: 32px;
    }
}
/* Page Header */
.page__header {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 280px;
    margin: 10px 0;
}
.page__header .page__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.page__header .page__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page__header .page__title {
    text-align: center;
    color: #fff;
}
.page__header .page__title h2 {
    font-size: 36px;
    font-weight: 600;
    color: #fff;
}
.page__header .page__title p {
    margin-top: 20px;
    font-weight: 500;
    line-height: 1.5;
}
/* Tab */
.common-tab__wrap {
    overflow-x: auto;
    margin-bottom: 80px;
    text-align: center;
}
ul.common-tab {
    display: inline-flex;
    flex-wrap: nowrap;
    padding: 8px;
    background-color: #f7f7fb;
    border-radius: 8px;
    border: 1px solid #e5e5ec;
    margin: 0 auto;
}
ul.common-tab li.tab__link {
    min-width: 184px;
    height: 49px;
    text-align: center;
    border-radius: 8px;
    background-color: transparent;
}
ul.common-tab li.tab__link > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: 18px;
    font-weight: 700;
    color: #111111;
}
ul.common-tab li.tab__link.active {
    background-color: #2b3748;
}
ul.common-tab li.tab__link.active > a {
    color: #fff;
}
/* #### List #### */
.list_sort {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 32px;
}
.list_sort .total_cnt {
    color: #111;
}
.list_sort_radios {
    display: flex;
    align-items: center;
    gap: 8px;
}
.list_sort_radios .radio--typeText {
    position: relative;
    padding-right: 8px;
}
.list_sort_radios .radio--typeText:last-child {
    padding-right: 0;
}
.list_sort_radios .radio--typeText::after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 14px;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    background-color: #e5e5ec;
}
.list_sort_radios .radio--typeText:last-child::after {
    content: none;
}
.table_wrap {
    width: 100%;
    overflow-x: auto;
}
.tbl_list table {
    width: 100%;
    table-layout: fixed;
}
.tbl_list thead th {
    height: 56px;
    font-size: 16px;
    font-weight: 500;
    color: #111;
    background-color: #f7f7fb;
}
.tbl_list thead th:first-child {
    border-radius: 16px 0 0 0;
}
.tbl_list thead th:last-child {
    border-radius: 0 16px 0 0;
}
.tbl_list tbody td {
    height: 72px;
    background-color: #fff;
    font-weight: 500;
    color: #111;
    text-align: center;
    padding: 0 16px;
    border-bottom: 1px solid #f1f1f5;
}
.tbl_list a.title {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    line-height: 22px;
    height: auto;
}
.mo-table__list .mo-item {
    display: block;
    padding: 16px;
    border-top: 1px solid #f1f1f5;
    /*border-bottom: 1px solid #f1f1f5;*/
}
.mo-item .flex_between {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
}
.mo-item .mo_title {
    font-size: 14px;
    font-weight: 500;
    color: #111111;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
    word-wrap: break-word;
    height: 20px;
    word-break: break-all;
}
.mo-item .item-info__list {
    display: flex;
    align-items: center;
    margin-top: 4px;
}
.mo-item .item-info__list li {
    font-size: 13px;
    font-weight: 400;
    color: #767676;
    /*padding: 0 8px;*/
    line-height: 16px;
    border-right: 1px solid #f1f1f5;
}
.mo-item .item-info__list li:first-child {
    padding-left: 0;
}
.pagination {
    margin-top: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
}
ul.pagination_btns {
    display: flex;
    align-items: center;
}
ul.pagination_btns li {
    display: inline-block;
    width: 40px;
    height: 40px;
}
ul.pagination_btns li > a {
    display: inline-block;
    width: 100%;
    height: 100%;
}
ul.pagination_btns .first {
    background: url(../_img/icon/pagination_first.svg) no-repeat center / contain;
}
ul.pagination_btns .prev {
    background: url(../_img/icon/pagination_prev.svg) no-repeat center / contain;
}
ul.pagination_btns .next {
    background: url(../_img/icon/pagination_next.svg) no-repeat center / contain;
}
ul.pagination_btns .last {
    background: url(../_img/icon/pagination_last.svg) no-repeat center / contain;
}
.pagination .pages {
    display: flex;
    align-items: center;
}
.pagination .page {
    display: inline-block;
    width: 40px;
    height: 40px;
}
.pagination .page > a {
    color: #767676;
    display: inline-block;
    width: 100%;
    height: 100%;
    line-height: 40px;
    text-align: center;
}
.pagination .page.active {
    background-color: var(--color-primary);
    border-radius: 50%;
    overflow: hidden;
}
.pagination .page.active > a {
    color: #fff;
}
/* #### Detail #### */
.detail__content {
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 20px;
}
.dtl__title {
    width: 100%;
    padding-bottom: 16px;
    border-bottom: 1px solid #111111;
}
.dtl__title .title_badges {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}
.dtl__title .title_badges .badge {
    display: inline-block;
    width: auto;
    padding: 0 16px;
    height: 33px;
    line-height: 33px;
    border-radius: 800px;
    font-size: 18px;
    font-weight: 700;
}
.dtl__title .title_badges .badge.badge--black {
    background-color: #111111;
    color: #fff;
}
.dtl__title .title_badges .badge.badge--pink {
    background-color: #fef3f4;
    color: var(--color-primary);
}
.dtl__title .title_badges .badge--text {
    font-size: 18px;
    font-weight: 500;
    color: #999999;
    padding: 0;
}
.dtl__title .title_badges .badge.badge--gray {
    background-color: #f1f1f5;
    color: #111111;
}
.dtl__title .title_badges .badge--text::before {
    content: "·";
    display: inline-block;
    margin-right: 8px;
}
.dtl__title h3.title {
    font-size: 32px;
    font-weight: 700;
    color: #111;
}
.dtl__title ul.dtl_info {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.dtl__title ul.dtl_info li {
    padding-right: 8px;
    border-right: 1px solid #e5e5ec;
    font-weight: 500;
    color: #767676;
    line-height: 20px;
}
.dtl__title ul.dtl_info li:last-child {
    padding-right: 0;
    border-right: none;
}
.dtl__title ul.dtl_info li.view_cnt,
.dtl__title ul.dtl_info li.loc {
    position: relative;
    padding-right: 22px;
}
.dtl__title ul.dtl_info li.view_cnt::after {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../_img/icon/icon_eye.svg) no-repeat center center / contain;
}
.dtl__title ul.dtl_info li.loc::after {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: url(../_img/icon/icon_loc2.svg) no-repeat center center / contain;
}
.dtl__title-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 16px;
    gap: 16px;
    border-bottom: 1px solid #111111;
}
.dtl__title-flex .dtl__title {
    padding-bottom: 0;
    border-bottom: none;
}
.dtl__content {
    margin-top: 40px;
    margin-bottom: 48px;
    font-weight: 500;
    color: #505050;
}
.dtl__files .file {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px;
    padding-left: 16px;
    border: 1px solid #e5e5ec;
    border-radius: 8px;
    margin-bottom: 8px;
    gap: 16px;
    min-height: 58px;
}
.dtl__files .file:last-child {
    margin-bottom: 0;
}
.dtl__files .file > span {
    font-weight: 500;
    color: #999;
}
.dtl__files .download_file {
    display: flex;
    align-items: center;
    gap: 24px;
    justify-content: space-between;
    width: 100%;
}
.dtl__files .download_file .file_name {
    font-weight: 500;
    color: #111;
}
.cmnty-info__list {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}
.cmnty-info__list .info-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.6;
    color: #111;
    margin-bottom: 16px;
}
.cmnty-info__list .info-item {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 12px;
}
.cmnty-info__list .info-item:last-child {
    margin-bottom: 0;
}
.cmnty-info__list .info-item .info-tit {
    display: inline-block;
    width: 102px;
    flex-shrink: 0;
    font-weight: 500;
    line-height: 1.6;
    color: #767676;
}
.cmnty-info__list .info-item .info-cnts {
    min-width: 206px;
    font-weight: 500;
    line-height: 1.6;
    color: #111;
}
.dtl-info__box {
    margin-top: 40px;
    padding-top: 40px;
    border-top: 1px solid #f1f1f5;
}
h3.dtl-sub_title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.5;
    color: #111;
    margin-bottom: 24px;
}
h6.dtl-sub_title {
    font-size: 18px;
    font-weight: 600;
    color: #111;
    margin-bottom: 16px;
}
.dtl-info_contents {
    font-weight: 500;
    line-height: 1.6;
    color: #505050;
}

@media screen and (max-width: 1100px) {
    .form_search .search_box.flex {
        flex-wrap: wrap;
    }
}
@media screen and (max-width: 767px) {
    .title_area h3 {
        font-size: 20px;
    }
    .form_search .search_box.flex {
        flex-direction: column;
        align-items: flex-start;
        row-gap: 20px;
    }
    .form_search .search_input {
        max-width: 100%;
    }
    .search_period {
        flex-direction: column;
        align-items: flex-start;
    }
    .search_period .datepicker,
    .search_period .select--typeC {
        max-width: 100%;
    }
    .search_period span {
        display: none;
    }
    .page__header {
        margin: 20px 0;
        height: 140px;
    }
    .page__header .page__title h2 {
        font-size: 24px;
    }
    .page__header .page__title p {
        margin-top: 16px;
        font-size: 14px;
    }
    .common-tab__wrap {
        width: 100%;
        margin-bottom: 32px;
    }
    ul.common-tab li.tab__link {
        min-width: 104px;
        height: 45px;
    }
    ul.common-tab li.tab__link > a {
        font-size: 15px;
    }
    .list_sort {
        margin-bottom: 20px;
    }
    .list_sort .total_cnt {
        font-size: 14px;
    }
    .pagination {
        margin-top: 32px;
        gap: 0px;
    }
    ul.pagination_btns .first,
    ul.pagination_btns .last {
        display: none;
    }
    .pagination .page {
        width: 48px;
        height: 48px;
    }
    .pagination .page > a {
        line-height: 48px;
    }
    .dtl__title {
        padding-bottom: 12px;
    }
    .dtl__title .title_badges {
        margin-bottom: 12px;
    }
    .dtl__title .title_badges .badge {
        height: 26px;
        line-height: 26px;
        font-size: 13px;
    }
    .dtl__title h3.title {
        font-size: 22px;
    }
    .dtl__title ul.dtl_info {
        margin-top: 12px;
    }
    .dtl__title ul.dtl_info li {
        font-size: 13px;
        line-height: 18px;
    }
    .dtl__title-flex {
        flex-direction: column;
        align-items: flex-start;
    }
    .dtl__title-flex .btn_area {
        width: 100%;
    }
    .dtl__title-flex .btn_area .btn {
        flex: 1;
    }
    .dtl__content {
        margin-top: 12px;
        margin-bottom: 12px;
    }
    .dtl__files.mb24 {
        margin-bottom: 20px;
    }
    .dtl__files .file {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
        gap: 8px;
    }
    .dtl__files .download_file {
        width: 100%;
    }
    .dtl__files .download_file .file_name {
        flex: 1;
    }
    .cmnty-info__list {
        flex-direction: column;
        align-items: flex-start;
    }
    .cmnty-info__list .info-title {
        margin-bottom: 12px;
    }
    .cmnty-info__list .info-item {
        margin-bottom: 8px;
    }
    .cmnty-info__list .info-item .info-tit {
        width: 120px;
    }
    .cmnty-info__list .info-item .info-cnts {
        min-width: auto;
    }
    h3.dtl-sub_title {
        font-size: 18px;
        margin-bottom: 20px;
    }
    h6.dtl-sub_title {
        font-size: 16px;
        margin-bottom: 8px;
    }
    .dtl-info_contents {
        font-size: 14px;
    }
}
@media screen and (max-width: 500px) {
    .form_search .search_box {
        flex-direction: column;
        align-items: center;
    }
    .form_search .search_box .select--typeB {
        min-width: auto;
        width: 100%;
    }
    .form_search .search_input {
        max-width: 100%;
    }
    .form_search .search_input .form-control {
        height: 48px;
    }
}

/* 모달 팝업 */
@media (min-width: 1025px) {
    .modal-open {
        overflow: hidden;
        padding-right: 16px;
    }
    .modal-open .btn-group-fixed {
        margin-right: 16px;
    }
}
@media (max-width: 1024.98px) {
    .modal-open {
        position: fixed;
        width: 100%;
    }
}
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    transition-duration: 0.2s;
    transition-property: background-color, box-shadow;
    will-change: background-color, box-shadow;
    max-width: 100%;
}
.btn-primary {
    color: #fff;
    background-color: #357fed;
}
.btn-outline-gray {
    color: #374151;
    border-color: #d1d5db;
    background-color: #fff;
}
.btn-lg {
    height: 48px;
    padding: 0 14px;
    min-width: 84px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: bold;
}

.popup-footer .btn-group-center {
    gap: 8px;
}
.btn-group-center {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
.modal-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1100;
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal-popup .dimed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
}
.modal-popup .popup-inner {
    position: relative;
    z-index: 1100;
    width: 600px;
    transition-duration: 0.3s;
    transition-property: transform;
    background-color: #fff;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 0px 2px 24px 0px rgba(0, 0, 0, 0.2);
}
.modal-popup.hide {
    opacity: 0;
    visibility: hidden;
}
.modal-popup.hide .popup-inner {
    transform: translateY(-50px);
}
.modal-popup.show {
    opacity: 1;
    visibility: visible;
    transition-duration: 0.3s;
}
.modal-popup.show .popup-inner {
    transform: translateY(0);
}
.modal-popup.modal-alert .popup-inner {
    width: 400px;
    border-radius: 16px;
}
.modal-popup.modal-alert .popup-header {
    padding-top: 32px;
    padding-bottom: 4px;
    justify-content: center;
}
.modal-popup.modal-alert .popup-header .popup-title {
    font-weight: 700 !important;
    text-align: center;
}
.modal-popup.modal-alert .popup-header i {
    display: block;
    margin: 0 auto 12px;
}
.modal-popup.modal-alert .popup-header ~ .popup-body {
    margin-top: 0;
    padding-top: 0;
    min-height: auto;
}
.modal-popup.modal-alert .popup-body {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 103px;
    padding: 32px 20px 20px;
    font-size: 16px;
    line-height: 21px;
    overflow: hidden;
}
.modal-popup.modal-alert .popup-body:first-child {
    margin-top: 0;
}
.modal-popup.modal-alert .popup-footer {
    padding-top: 0;
    padding-bottom: 24px;
    border-top: 0;
}
.modal-popup.modal-sm .popup-inner {
    width: 400px;
}
.modal-popup.modal-md .popup-inner {
    width: 600px;
}
.modal-popup.modal-lg .popup-inner {
    width: 1200px;
}
.modal-popup.modal-xl {
    padding: 20px;
}
.modal-popup.modal-xl .popup-inner {
    width: 1600px;
}
.modal-popup.modal-xl .popup-header {
    height: 100px;
    padding: 16px 40px;
    border-bottom: 1px solid #d1d5db;
}
.modal-popup.modal-xl .popup-title {
    font-size: 28px;
}
.modal-popup.modal-xl .popup-body {
    padding: 20px 40px 40px;
    overflow: auto;
    max-height: calc(100vh - 160px);
}
.modal-popup.modal-xl .popup-header ~ .btn-close-popup {
    top: 30px;
}
@media (min-width: 1025px) {
    .modal-popup .popup-inner {
        border: 1px solid #fff;
    }
    .modal-popup .popup-header {
        margin: -2px -2px 0;
    }
    .modal-popup .popup-body {
        max-height: calc(100vh - 200px);
    }
    .modal-popup.modal-lg {
        padding: 20px;
    }
}
@media (max-width: 1024.98px) {
    .modal-popup {
        padding: 20px;
    }
    .modal-popup .popup-inner.bg-gray {
        background: #fff !important;
    }
    .modal-popup .popup-inner .popup-body {
        padding: 24px;
    }
    .modal-popup .popup-inner .popup-body .card {
        padding: 0 0 24px;
    }
    .modal-popup .popup-inner .popup-body .card + .card {
        position: relative;
        padding-top: 20px;
    }
    .modal-popup .popup-inner .popup-body .card + .card::before {
        position: absolute;
        top: -12px;
        left: -20px;
        content: "";
        display: block;
        width: calc(100% + 40px);
        height: 12px;
        background: #f3f4f6;
    }
    .modal-popup.modal-sm .popup-inner {
        height: auto !important;
        max-height: 100%;
    }
    .modal-popup.modal-sm .popup-header {
        padding: 16px 60px 16px 19px;
        height: 64px;
    }
    .modal-popup.modal-sm .popup-header .popup-title {
        font-weight: 700;
        font-size: 18px;
        letter-spacing: -0.02em;
        max-width: 100%;
        white-space: nowrap;
        max-height: 1.4em;
        line-height: 1.4em;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .modal-popup.modal-sm .popup-header ~ .btn-close-popup {
        top: 20px;
    }
    .modal-popup.modal-alert .popup-inner {
        border: 1px solid #fff;
    }
    .modal-popup:not(.modal-alert) .popup-inner {
        width: 100%;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        height: 100%;
    }
    .modal-popup:not(.modal-alert) .popup-header,
    .modal-popup:not(.modal-alert) .popup-footer {
        flex: 0 0 auto;
    }
    .modal-popup:not(.modal-alert) .popup-body {
        flex: 1 1 auto;
        max-height: 100%;
    }
    .modal-popup.modal-md, .modal-popup.modal-lg, .modal-popup.modal-xl {
        padding: 0;
    }
    .modal-popup.modal-md .popup-inner, .modal-popup.modal-lg .popup-inner, .modal-popup.modal-xl .popup-inner {
        border-radius: 0;
    }
    .modal-popup.modal-md .popup-inner .popup-body, .modal-popup.modal-lg .popup-inner .popup-body, .modal-popup.modal-xl .popup-inner .popup-body {
        max-height: none;
    }
    .modal-popup.modal-md .popup-header, .modal-popup.modal-lg .popup-header, .modal-popup.modal-xl .popup-header {
        padding: 16px 60px 16px 19px;
        height: 64px;
        border-bottom: 1px solid #d1d5db;
    }
    .modal-popup.modal-md .popup-header .popup-title, .modal-popup.modal-lg .popup-header .popup-title, .modal-popup.modal-xl .popup-header .popup-title {
        font-weight: 700;
        font-size: 18px;
        letter-spacing: -0.02em;
        max-width: 100%;
        white-space: nowrap;
        max-height: 1.4em;
        line-height: 1.4em;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .modal-popup.modal-md .popup-header ~ .btn-close-popup, .modal-popup.modal-lg .popup-header ~ .btn-close-popup, .modal-popup.modal-xl .popup-header ~ .btn-close-popup {
        top: 20px;
    }
}