@charset "UTF-8";
@import url("/resources/css/common/print.css");
/*-------------------------------------------------
title       : 서브
Author      : PLAN I
Create date : 2025-01-31
-------------------------------------------------*/
html.sub-area #header {
    transition: transform 0.35s;
    opacity: 1;
    visibility: visible;
}
html.sub-area .quick-menu {
    display: none;
}

.mt-10 {
    margin-top: 1rem !important;
}
.mt-20 {
    margin-top: 2rem !important;
}
.mt-40 {
    margin-top: 4rem !important;
}
.mt-80 {
    margin-top: 8rem !important;
}

.w100 {
    width: 100% !important;
}

.krds-breadcrumb-wrap {
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.krds-breadcrumb-wrap .breadcrumb {
    gap: 0 !important;
}
.krds-breadcrumb-wrap .breadcrumb > li {
    position: relative;
}
.krds-breadcrumb-wrap .breadcrumb > li:before {
    display: none;
}
.krds-breadcrumb-wrap .breadcrumb > li:not(:last-child):after {
    width: 1.6rem;
    height: 1.7rem;
    background: #999;
    -webkit-mask-image: url(/template/templateB/img/layout/ico_arrow-location.svg) !important;
    mask-image: url(/template/templateB/img/layout/ico_arrow-location.svg) !important;
    margin-left: 0 !important;
    transform: rotate(0) !important;
}
.krds-breadcrumb-wrap .breadcrumb > li:not(:last-child) .txt .icon {
    display: none;
}
.krds-breadcrumb-wrap .breadcrumb > li:last-child .txt {
    color: #333;
    font-weight: 600;
}
.krds-breadcrumb-wrap .breadcrumb > li .txt {
    color: #767676;
    font-size: 1.6rem;
    font-weight: 500;
    letter-spacing: -0.016rem;
    text-decoration: none !important;
    padding: 0 !important;
}
.krds-breadcrumb-wrap .breadcrumb .home .txt::before {
    background: #555;
    -webkit-mask-image: url(/template/templateB/img/layout/ico_home.svg);
    mask-image: url(/template/templateB/img/layout/ico_home.svg);
}
.krds-pagination {
    margin-top: 3rem;
}
.krds-pagination .page-links {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: var(--ff);
    gap: 0.6rem;
    font-size: 1.5rem;
}
.krds-pagination .page-links .page-link {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
}
.krds-pagination .page-links .page-link.active {
    background-color: #333;
    color: #fff;
}
.krds-pagination .page-links .page-link.link-dot {
    display: none;
}
.krds-pagination .page-links .first,
.krds-pagination .page-links .prev,
.krds-pagination .page-links .next,
.krds-pagination .page-links .last {
    border: 1px solid #ddd;
    font-size: 0;
    color: #777;
    transition: 0.24s;
}
.krds-pagination .page-links .first:hover,
.krds-pagination .page-links .prev:hover,
.krds-pagination .page-links .next:hover,
.krds-pagination .page-links .last:hover {
    background-color: #f8f8f8 !important;
}
.krds-pagination .page-links .first {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    border: 1px solid #ddd;
    border-radius: 50%;
    font-size: 0;
}
.krds-pagination .page-links .first:hover {
    background-color: #eef2f7;
}
.krds-pagination .page-links .first::before {
    font-family: "remixicon";
    font-size: 2rem;
    content: "\f2e2";
}
.krds-pagination .page-links .prev {
    margin-right: 1rem;
    border: 1px solid #ddd;
    border-radius: 50%;
}
.krds-pagination .page-links .prev::before {
    font-family: "remixicon";
    font-size: 2rem;
    font-weight: 400;
    content: "\ea64";
}
.krds-pagination .page-links .prev img {
    display: none;
}
.krds-pagination .page-links .last {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    border: 1px solid #ddd;
    border-radius: 50%;
    font-size: 0;
}
.krds-pagination .page-links .last:hover {
    background-color: #eef2f7;
}
.krds-pagination .page-links .last::before {
    font-family: "remixicon";
    font-size: 2rem;
    content: "\f2e4";
}
.krds-pagination .page-links .next {
    margin-left: 1rem;
    border: 1px solid #ddd;
    border-radius: 50%;
}
.krds-pagination .page-links .next::before {
    font-family: "remixicon";
    font-size: 2rem;
    font-weight: 400;
    content: "\ea6e";
}
.krds-pagination .page-links .next img {
    display: none;
}
@media (max-width: 587px) {
    .krds .krds-pagination .page-links .page-link.prev,
    .krds .krds-pagination .page-links .page-link.next {
        margin: 0;
    }
    .krds .krds-pagination .page-links {
        gap: 0.4rem;
    }
}

.h2 {
    font-family: var(--nanum);
    color: #111;
    font-size: 6rem;
    font-weight: 800;
    line-height: 130%;
    letter-spacing: -0.12rem;
}
@media (max-width: 1279px) {
    .h2 {
        font-size: 5.6rem;
    }
}
@media (max-width: 1023px) {
    .h2 {
        font-size: 5.2rem;
    }
}
@media (max-width: 767px) {
    .h2 {
        font-size: 4.8rem;
    }
}

.h3 {
    font-family: var(--nanum);
    color: var(--white);
    font-size: 3.6rem;
    font-weight: 800;
    line-height: 130%;
    letter-spacing: -0.072rem;
}
@media (max-width: 1279px) {
    .h3 {
        font-size: 3.4rem;
    }
}
@media (max-width: 1023px) {
    .h3 {
        font-size: 3.2rem;
    }
}
@media (max-width: 767px) {
    .h3 {
        font-size: 3rem;
    }
}

.h4 {
    display: block;
    color: #111;
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 130%; /* 3.64rem */
    letter-spacing: -0.056rem;
    margin: 8rem 0 2rem;
}
@media (max-width: 1023px) {
    .h4 {
        margin: 6rem 0 1.6rem;
    }
}
@media (max-width: 767px) {
    .h4 {
        margin: 4rem 0 1.6rem;
    }
}

.h5 {
    display: block;
    color: #111;
    font-size: 4rem;
    font-weight: 800;
    line-height: 140%;
    letter-spacing: -0.08rem;
}
.h5.navy {
    font-family: var(--nanum);
    color: var(--bg-navy);
    font-weight: 700;
    line-height: 150%;
}
@media (max-width: 1023px) {
    .h5 {
        font-size: 3.8rem;
    }
}
@media (max-width: 767px) {
    .h5 {
        font-size: 3.6rem;
    }
}

.p {
    color: #767676;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 150%; /* 2.7rem */
    letter-spacing: -0.054rem;
}
.p.reg {
    font-weight: 400;
    line-height: 140%;
    letter-spacing: -0.018rem;
}
.p.md {
    font-size: 2.2rem;
    font-weight: 400;
    letter-spacing: -0.04rem;
}
.p.md.semi {
    font-weight: 500;
    letter-spacing: -0.066rem;
}
.p.sm {
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: -0.04rem;
}
.p.sm.semi {
    font-weight: 500;
    letter-spacing: -0.06rem;
}
.p.black {
    color: #111;
    line-height: 140%;
    letter-spacing: -0.044rem;
}
.p.gray550 {
    color: #555;
    line-height: 3.4rem;
    letter-spacing: -0.06rem;
}
.p.navy {
    color: var(--bg-navy) !important;
    letter-spacing: -0.016rem;
}
@media (max-width: 1279px) {
    .p.sm {
        font-size: 1.8rem;
    }
    .p.md {
        font-size: 2rem;
    }
}
@media (max-width: 767px) {
    .p.sm {
        font-size: 15px;
    }
    .p.md {
        font-size: 17px;
    }
}

.semibold {
    font-weight: 600 !important;
}

.bold {
    font-weight: 700 !important;
}

.beige {
    color: #ddb06d !important;
}

.bul.info > li {
    color: #555;
    font-size: 1.6rem;
    line-height: 140%;
    letter-spacing: -0.016rem;
    position: relative;
    padding-left: 2.1rem;
}
.bul.info > li:before {
    content: "\ee59";
    position: absolute;
    left: 0;
    font-family: "remixicon";
    top: -0.2rem;
    font-size: 1.6rem;
    color: #555;
}
.bul.info > li + li {
    margin-top: 0.8rem;
}
.bul.info > li.red {
    color: #df2b2b;
    font-weight: 500;
}
.bul.info > li.red:before {
    color: #df2b2b;
}
.bul1 > li {
    position: relative;
    padding-left: 1.2rem;
}
.bul1 > li:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 1rem;
    width: 0.4rem;
    height: 0.4rem;
    background: #d9d9d9;
    border-radius: 50%;
}
.bul1 > li + li {
    margin-top: 1.1rem;
}
.bul2 > li {
    position: relative;
    color: #555;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: -0.016rem;
    padding-left: 3.2rem;
    counter-increment: number;
}
.bul2 > li:before {
    content: counter(number);
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2.2rem;
    height: 2.2rem;
    border-radius: 0.4rem;
    background: #ededed;
    color: var(--bg-navy);
    font-size: 1.4rem;
    font-weight: 500;
    letter-spacing: -0.014rem;
}
.bul2 > li + li {
    margin-top: 1.2rem;
}
@media (max-width: 1023px) {
    .bul.info > li {
        font-size: 15px;
    }
    .bul.info > li:before {
        top: 0;
        font-size: 15px;
    }
}

.sub-visual {
    margin-top: var(--header-height-lg);
    padding-top: 8rem;
}
.sub-visual-container {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: space-between;
    gap: 2.4rem;
}
@media (max-width: 1023px) {
    .sub-visual {
        padding-top: 6rem;
    }
}
@media (max-width: 767px) {
    .sub-visual {
        padding-top: 5rem;
    }
}

.depth3 {
    display: none;
    position: absolute;
    top: calc(100% + 1rem);
    left: 50%;
    min-width: 14.8rem;
    transform: translateX(-50%);
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
    z-index: 1;
}
.depth3-btn:after {
    content: "";
    display: block;
    width: 2rem;
    height: 2rem;
    background: url("/template/templateB/img/layout/ico_arrow-down-circle.svg")
        no-repeat center center/contain;
    transition: transform 0.24s;
}
.depth3-btn.is-open:after {
    transform: rotate(180deg);
}
.depth3-list {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
    background: var(--white);
    padding: 1.6rem;
}
.depth3-item {
    display: block;
    text-align: center;
}
.depth3-item:after {
    display: none !important;
}
.depth3-link {
    display: block;
    width: 100%;
    text-align: center;
    color: #767676;
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 140%;
}
.depth3-link.on {
    font-weight: 600;
    color: var(--bg-navy);
}
.depth3-link:not(.on):hover {
    color: var(--gray900);
}

.contents {
    margin-top: 8rem;
}
.contents-tab {
    margin-bottom: 8rem;
}
.contents-box {
    padding: 0 0 18rem;
}
@media (max-width: 1023px) {
    .contents {
        margin-top: 6rem;
    }
    .contents-tab {
        margin-bottom: 6rem;
    }
    .contents-tab > ul > li > a {
        min-height: 6.4rem;
    }
    .contents .mt-80 {
        margin-top: 6rem !important;
    }
}
@media (max-width: 767px) {
    .contents {
        margin-top: 4rem;
    }
    .contents-tab {
        margin-bottom: 4rem;
    }
    .contents .mt-80 {
        margin-top: 4rem !important;
    }
}
@media (max-width: 767px) {
    .contents-tab > ul > li {
        flex: none;
        width: -moz-fit-content;
        width: fit-content;
    }
    .contents-tab > ul > li > a {
        font-size: 17px;
        min-height: 54px;
        padding: 1rem 1.6rem;
    }
}

.mxds-tab {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    overflow: auto;
    text-align: center;
}
.mxds-tab > ul {
    display: flex;
    gap: 0.8rem;
    width: 100%;
}
.mxds-tab > ul > li {
    flex: 1;
}
.mxds-tab > ul > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 6.8rem;
    height: 100%;
    padding: 1rem;
    font-size: 2rem;
    color: #333;
    font-weight: 500;
    text-align: center;
    background: #f4f4f8;
}
.mxds-tab > ul > li.active > a {
    background: var(--bg-navy);
    color: #fff;
}
.mxds-tab-responsive-default {
    position: relative;
    overflow: visible;
}
.mxds-tab-responsive-default.active > a:after {
    transform: rotate(180deg);
}
.mxds-tab-responsive-default.active ul {
    display: block;
}
.mxds-tab-responsive-default > a {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
    width: 100%;
    height: 50px;
    color: var(--gray900);
    font-size: 16px;
    font-weight: 500;
    background: #fff !important;
    border: 1px solid #eeeeee;
    border-radius: 0;
    overflow: hidden;
    padding: 12px 16px;
    white-space: normal;
}
.mxds-tab-responsive-default > a:after {
    content: "\ea4e";
    color: #424242;
    font-family: "remixicon";
    font-size: 18px;
    transition: transform 0.24s;
}
.mxds-tab-responsive-default ul {
    display: none;
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    width: calc(100% + 1px);
    max-height: 33rem;
    overflow-y: auto;
    border-radius: 0;
    border: 1px solid #eeeeee;
    border-top: none;
    z-index: 3;
}
.mxds-tab-responsive-default ul > li {
    flex: none;
    position: relative;
    width: 100%;
}
.mxds-tab-responsive-default ul > li > a {
    justify-content: flex-start;
    height: 44px !important;
    min-height: auto;
    color: #767676;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 160%;
    background: #fff;
    padding: 12px 16px;
    border: none !important;
    border-radius: 0 !important;
}
.mxds-tab-responsive-default ul > li > a:hover {
    background: #eef2f7;
}
.mxds-tab-responsive-default ul > li.active > a:hover {
    background: var(--bg-navy);
}
.mxds-table {
    position: relative;
    overflow: hidden;
    width: 100%;
    border-collapse: collapse;
}
.mxds-table.mxds-table-responsive-scroll::before {
    width: 50px;
    height: calc(100% - 6px);
    background: linear-gradient(to right, #fff, transparent);
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    content: "\ea64";
    font-family: "remixicon";
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 3rem;
}
.mxds-table.mxds-table-responsive-scroll::after {
    width: 48px;
    height: calc(100% - 0.5rem);
    background: linear-gradient(to left, #fff, transparent);
    position: absolute;
    right: -1px;
    top: 0;
    z-index: 1;
    content: "\ea6e";
    font-family: "remixicon";
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 3rem;
}
.mxds-table.mxds-table-responsive-scroll.scrolled-left::before {
    display: none;
}
.mxds-table.mxds-table-responsive-scroll.scrolled-right::after {
    content: "";
    width: 1px;
    height: 100%;
    background: #fff;
    right: 0;
}
.mxds-table.mxds-table-responsive-scroll .mxds-table-info {
    border-top: 1px solid #757575;
    border-bottom: 0;
    position: relative;
}
.mxds-table.mxds-table-responsive-scroll table {
    min-width: 500px;
}
.mxds-table-info {
    overflow: auto;
    position: relative;
    width: 100%;
}
.mxds-table-info table thead th {
    padding: 1rem;
    border-left: 1px solid #c8cbcf;
    background-color: #738198;
    font-size: 1.7rem;
    font-weight: 600;
    color: #fff;
    line-height: 1.4;
}
.mxds-table-info table tbody th,
.mxds-table-info table tbody td {
    padding: 1rem;
    font-size: 1.6rem;
    line-height: 1.4;
}
.mxds-table-info table tbody th[rowspan],
.mxds-table-info table tbody th[scope="row"] {
    border-bottom: 1px solid #dbdbdb;
    background: #eff1f4;
    font-weight: 500;
}
.mxds-table-info table tbody th[rowspan]:has(+ th[scope="row"]) {
    border-right: 1px solid rgba(221, 221, 221, 0.6);
}
.mxds-table-info table tbody td {
    border-bottom: 1px solid rgba(221, 221, 221, 0.6);
    border-right: 1px solid rgba(221, 221, 221, 0.6);
    color: #555;
    word-break: break-all;
}
.mxds-table-info table tbody td:last-child {
    border-right: none;
}
.mxds-table-info table tbody td.center {
    text-align: center;
}
.mxds-table-info table tbody td.bd-right {
    border-right: 1px solid rgba(221, 221, 221, 0.6);
}
.mxds-table-info table tbody td > strong {
    font-weight: 500;
    color: #111;
}

.num {
    display: block;
    text-align: center;
    color: var(--bg-brown);
    font-family: var(--nanum);
    font-size: 3.8rem;
    font-weight: 800;
    line-height: 140%;
    letter-spacing: -0.114rem;
}
.num-box {
    border-top: 1.5px solid #111;
}
.num-area {
    flex-shrink: 0;
    min-width: 8.8rem;
}
.num-list {
    display: flex;
    flex-wrap: wrap;
}
.num-item {
    display: flex;
    gap: 2.8rem;
    width: 50%;
    padding: 4rem 2.8rem;
    border-bottom: 1px solid #ddd;
}
.num-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}
.num-info .title {
    color: #111;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 140%;
    letter-spacing: -0.066rem;
}
.num-mark {
    flex-shrink: 0;
    display: inline-block;
    height: -moz-fit-content;
    height: fit-content;
    min-width: 2.1rem;
    padding: 0.3rem 0.6rem 0.1rem;
    border-radius: 0.4rem;
    font-size: 1.5rem;
    font-weight: 600;
    color: #fff;
    line-height: 1.7rem;
    text-align: center;
}
.num-mark.color01 {
    background-color: #767756;
}
.num-mark.color02 {
    background-color: #205b9d;
}
.num-mark.color03 {
    background-color: #8e5ba6;
}
.num-mark.color04 {
    background-color: #cb614d;
}
.num-mark.color05 {
    background-color: #b28c62;
}
.num-mark.color06 {
    background-color: #559143;
}
.num-mark.color07 {
    background-color: #4996bd;
}
.num-mark.color08 {
    background-color: #847c85;
}
.num-mark.color09 {
    background-color: #d99490;
}
.num-mark.v-auto {
    margin: auto 0;
}
.num-flex {
    display: inline-flex;
    gap: 0.6rem 0.4rem;
}
@media (max-width: 1279px) {
    .num {
        font-size: 3.4rem;
    }
    .num-item {
        gap: 1.6rem;
        padding: 2.4rem 2rem;
    }
    .num-area {
        min-width: 6.4rem;
    }
}
@media (max-width: 1023px) {
    .num-item {
        flex-direction: column;
        gap: 1rem;
    }
    .num-info {
        text-align: center;
    }
}
@media (max-width: 587px) {
    .num-item {
        width: 100%;
    }
}

.btn-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 5.2rem;
    border: 1px solid var(--bg-navy);
    padding: 0.5rem 2rem;
}
.btn-link.center {
    justify-content: center;
    gap: 0.4rem;
}
.btn-link span,
.btn-link [class^="ri-"] {
    color: var(--bg-navy);
}
.btn-link span {
    font-size: 1.8rem;
    font-weight: 500;
}
.btn-link [class^="ri-"] {
    font-size: 2rem;
    line-height: 1;
    font-weight: 400;
}
.btn-link.white {
    border-color: rgba(255, 255, 255, 0.5);
}
.btn-link.white span,
.btn-link.white [class^="ri-"] {
    color: var(--white);
}
.btn-link.white:hover {
    border-color: var(--bg-navy);
    background: var(--white);
}
.btn-link.white:hover span,
.btn-link.white:hover [class^="ri-"] {
    color: var(--bg-navy);
}
.btn-link.gray {
    border-color: #333;
    background: #333;
}
.btn-link.gray span,
.btn-link.gray [class^="ri-"] {
    color: var(--white);
}
.btn-link.navy {
    background: var(--bg-navy);
}
.btn-link.navy span,
.btn-link.navy [class^="ri-"] {
    color: var(--white);
}

.bg-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    aspect-ratio: 1400/320;
    padding: 8rem 2rem;
}
.bg-box.bg1 {
    background: url(/template/templateB/img/sub/sub01-1_bg.jpg) no-repeat center
        center/cover;
}
.bg-box.bg2 {
    background: url(/template/templateB/img/sub/sub01-2_bg.jpg) no-repeat center
        center/cover;
}
.bg-box.bg3 {
    background: url(/template/templateB/img/sub/sub01-3_bg.jpg) no-repeat center
        center/cover;
}
.bg-box .h3,
.bg-box .p {
    display: block;
    text-align: center;
}
.bg-box .p {
    color: rgba(255, 255, 255, 0.8);
}
.bg-cont {
    padding: 4rem;
    background: #f4f4f8;
}
.bg-cont .auto {
    display: block;
    margin: auto;
}
@media (max-width: 1279px) {
    .bg-cont {
        padding: 3rem;
    }
}
@media (max-width: 1023px) {
    .bg-box {
        padding: 6rem 2rem;
    }
}
@media (max-width: 767px) {
    .bg-box {
        aspect-ratio: auto;
    }
    .bg-cont {
        padding: 2.4rem;
    }
}

.top-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 3.2rem 2.4rem;
}
.top-box-txt {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding-top: 4.4rem;
}
.top-box-txt:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4.8rem;
    height: 4px;
    border-top: 4px solid var(--bg-brown);
}
.top-box-txt .title {
    font-family: var(--nanum);
    color: var(--bg-navy);
    font-size: 4rem;
    font-weight: 800;
    letter-spacing: -0.08rem;
    line-height: 150%;
}
.top-box-txt .desc {
    font-size: 2.2rem;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -0.066rem;
}
.top-box-img img {
    display: block;
    width: 47.4rem;
}
@media (max-width: 1023px) {
    .top-box-txt .title {
        font-size: 3.6rem;
    }
    .top-box-txt .desc {
        font-size: 2rem;
    }
}
@media (max-width: 767px) {
    .top-box-txt .title {
        font-size: 3.4rem;
    }
}

.img-box {
    position: relative;
}
.img-box.border {
    border: 1px solid #ddd;
    padding: 6.8rem 3rem;
}
.img-box .auto {
    display: block;
    margin: auto;
}
.img-box-title {
    position: absolute;
    left: 0;
    top: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: -moz-fit-content;
    width: fit-content;
    height: 5.3rem;
    padding: 1.2rem 3rem;
    background: var(--bg-brown);
}
.img-box-title .title {
    color: #fff;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: -0.044rem;
    text-align: center;
}
.img-box-title.black {
    background: rgba(0, 0, 0, 0.7);
    padding: 0.8rem 2rem;
    bottom: 0;
    top: auto;
}
.img-box-title.black .title {
    font-size: 1.8rem;
    letter-spacing: -0.036rem;
}
.img-box-banner {
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 1rem;
    max-width: -moz-fit-content;
    max-width: fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding: 3.2rem 4.8rem;
    background: var(--white);
}
.img-box-banner .title {
    display: block;
    color: var(--bg-navy);
    font-family: var(--nanum);
    font-size: 4rem;
    font-weight: 800;
    line-height: 150%;
    letter-spacing: -0.08rem;
    text-align: right;
}
.img-box-banner .p {
    text-align: right;
}
.img-box-pd {
    display: block;
    border: 1px solid #ddd;
    border-top: none;
    padding: 2.5rem 1rem;
}
.img-box-pd img {
    display: block;
    margin: auto;
    text-align: center;
}
@media (max-width: 1279px) {
    .img-box-banner .title {
        font-size: 3.6rem;
    }
}
@media (max-width: 1023px) {
    .img-box-banner .title {
        font-size: 3.2rem;
    }
}
@media (max-width: 767px) {
    .img-box-banner {
        position: static;
        width: 100%;
        max-width: 100%;
        padding: 2.4rem 1.6rem;
    }
}

.house-box {
    position: relative;
    display: flex;
    align-items: center;
    gap: 3.2rem 27.3rem;
    aspect-ratio: 1400/220;
    padding: 4rem 8rem;
    background: url(/template/templateB/img/sub/house-box_bg.jpg) no-repeat
        center/cover;
}
.house-info {
    flex: none;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.house-info-title {
    color: var(--white);
    font-family: var(--nanum);
    font-size: 3.6rem;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: -0.072rem;
}
.house-info-desc {
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem 2.4rem;
}
.house-info-desc .p {
    position: relative;
    color: rgba(255, 255, 255, 0.8);
}
.house-info-desc .p:not(:last-of-type):after {
    content: "";
    position: absolute;
    left: calc(100% + 1.2rem);
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 1.4rem;
    border-right: 1px solid rgba(255, 255, 255, 0.5);
}
.house-count-list {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.house-count-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.3rem;
    width: calc(16.6666666667% - 1.6666666667rem);
}
.house-count-item .p {
    color: rgba(255, 255, 255, 0.8);
}
.house-count-cate {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 10rem;
    width: 100%;
    height: 5.2rem;
    color: white;
    font-weight: 500;
    font-size: 2.4rem;
    line-height: 150%;
    letter-spacing: -0.072rem;
    padding: 0.8rem 0;
}
.house-count-cate.color01 {
    background: #16507b;
}
.house-count-cate.color02 {
    background: #ed667b;
}
.house-count-cate.color03 {
    background: #f4894f;
}
.house-count-cate.color04 {
    background: #2bb293;
}
.house-count-cate.color05 {
    background: #65a1d4;
}
.house-count-cate.color06 {
    background: #7d79b4;
}
.house-count-cate.color07 {
    background: #3e9d38;
}
.house-count-cate.color08 {
    background: #e9546b;
}
.house-count-cate.color09 {
    background: #8b4208;
}
.house-count-cate.color10 {
    background: #028ed0;
}
.house-count-cate.color11 {
    background: #6f3791;
}
.house-count-cate.color12 {
    background: #144c6e;
}
@media (max-width: 1440px) {
    .house-box {
        -moz-column-gap: 4.8rem;
        column-gap: 4.8rem;
        padding: 4rem;
    }
}
@media (max-width: 1279px) {
    .house-box {
        flex-wrap: wrap;
        flex-direction: row;
    }
    .house-info {
        width: 100%;
    }
}
@media (max-width: 767px) {
    .house-box {
        padding: 4rem 3rem;
        aspect-ratio: auto;
    }
    .house-count-list {
        width: 100%;
        gap: 1.2rem;
    }
    .house-count-item {
        width: calc(33.3333333333% - 0.8rem);
    }
    .house-count-cate {
        min-width: auto;
    }
}
@media (max-width: 390px) {
    .house-count-item {
        width: calc(50% - 0.6rem);
    }
}

.check-list {
    border-top: 1px solid #ddd;
}
.check-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6.4rem;
    padding: 2.8rem 4rem;
    border-bottom: 1px solid #eee;
}
.check-item.md {
    gap: 10.4rem;
}
.check-item.md .check-item-txt {
    max-width: 47.43%;
}
.check-item.sm {
    gap: 4rem;
}
.check-item-txt {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding-left: 4.8rem;
}
.check-item-txt:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 3.2rem;
    height: 3.2rem;
    background: url(/template/templateB/img/layout/ico_check.svg) no-repeat
        center center/contain;
}
.check-item-txt .title {
    color: #111;
    font-size: 2rem;
    font-weight: 600;
    line-height: 140%;
    letter-spacing: -0.02rem;
}
.check-item-img {
    display: flex;
    gap: 1rem;
}
.check-item-img.full img {
    max-width: 100%;
}
.check-item-img img {
    flex: 1;
    max-width: calc(50% - 0.5rem);
    display: block;
}
@media (max-width: 1279px) {
    .check-item {
        padding: 2rem;
    }
    .check-item.sm,
    .check-item.md {
        gap: 2.4rem 4rem;
    }
}
@media (max-width: 1023px) {
    .check-item {
        flex-direction: column;
        align-items: start;
    }
    .check-item.sm .check-item-txt,
    .check-item.md .check-item-txt {
        max-width: 100%;
    }
    .check-item .check-item-txt .bul1 {
        margin-left: -4.5rem;
    }
}
@media (max-width: 767px) {
    .check-item {
        padding: 2rem 0;
    }
}
@media (max-width: 459px) {
    .check-item-img {
        flex-wrap: wrap;
    }
    .check-item-img img {
        flex: none;
        max-width: 100%;
    }
}

.border-box {
    border: 1px solid #ddd;
    padding: 4rem;
}
.border-box.md {
    padding: 6.7rem 4rem;
}
.border-box.bold {
    border: 1rem solid #f4f0eb;
    padding: 6rem;
}
.border-box .auto {
    display: block;
    margin: auto;
}
@media (max-width: 1640px) {
    .border-box {
        padding: 3rem;
    }
    .border-box.md {
        padding: 4rem 3rem;
    }
    .border-box.bold {
        padding: 4rem;
    }
}

.type-container {
    display: flex;
    align-items: center;
}
.type-view-detail {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    width: -moz-fit-content;
    width: fit-content;
    padding-bottom: 2rem;
}
.type-view-detail:after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 5.4rem;
    height: 3.1rem;
    background: url(/template/templateB/img/sub/ico_triangle.svg) no-repeat
        center center/contain;
}
.type-view-detail .p {
    color: var(--white);
    padding: 2rem 4.4rem;
    background: #2f2f2f;
}
.type-info {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    width: 40rem;
    aspect-ratio: 400/878;
}
.type-info-title {
    color: #111;
    font-size: 2.2rem;
    font-weight: 800;
    letter-spacing: -0.044rem;
}
.type-info-list {
    border-top: 1px solid #333;
}
.type-info-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 4rem;
    border-bottom: 1px solid #e6e6e6;
    padding: 0.5rem 0;
}
.type-info-item > strong,
.type-info-item > p {
    letter-spacing: -0.032rem;
    font-weight: 400;
}
.type-info-item > strong {
    flex-shrink: 0;
    color: #111;
    font-size: 1.6rem;
}
.type-info-item > p {
    color: #333;
    text-align: right;
    font-size: 1.6rem;
}
.type-info-tab {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.type-info-tab-cont {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    padding: 4rem;
    background: #f7f4ee;
}
.type-title {
    display: flex;
    flex-direction: column;
    gap: 2.2rem;
    color: var(--white);
    padding: 3rem 3rem 1.6rem;
    background: var(--bg-brown);
}
.type-title .p {
    color: var(--white);
}
.type-title .title {
    color: var(--white);
    font-family: var(--nanum);
    font-size: 4.8rem;
    font-weight: 800;
    letter-spacing: -0.096rem;
    line-height: 130%;
}
.type-view {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.6rem;
}
@media (max-width: 1640px) {
    .type-container {
        gap: 3.2rem;
    }
    .type-info {
        width: 36rem;
    }
    .type-info-tab-cont {
        padding: 3rem;
    }
}
@media (max-width: 1023px) {
    .type-container {
        flex-direction: column;
    }
    .type-info {
        width: 100%;
        aspect-ratio: auto;
    }
}

.option-container {
    display: flex;
    flex-wrap: wrap;
    padding: 6.8rem 8rem;
    border-radius: 2rem;
    background: #f4f4f4;
}
.option-top {
    display: flex;
    gap: 4.6rem;
}
.option-top .option-box {
    width: calc(50% - 2.3rem);
}
.option-box {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.option-box-wrap {
    display: flex;
    gap: 6rem 1rem;
}
.option-box-wrap + .option-box-wrap {
    margin-top: 6rem;
}
.option-box-wrap.two {
    width: 100%;
}
.option-box-wrap.two .option-box {
    width: calc(50% - 0.5rem);
}
.option-box-wrap.three {
    width: 100%;
}
.option-box-wrap.three .option-box {
    width: calc(33.3333333333% - 0.6666666667rem);
}
.option-box-wrap.type23 {
    width: 100%;
}
.option-box-wrap.type23 .option-box.two {
    flex-shrink: 0;
    width: calc((100% - 4rem) * 2 / 5 + 1rem);
}
.option-box-wrap.type23 .option-box.three {
    flex: none;
    width: calc((100% - 4rem) * 3 / 5 + 2rem);
}
.option-cate {
    flex-shrink: 0;
    height: 4.4rem;
    padding: 0.2rem 2rem;
    font-size: 1.6rem;
    font-weight: 400;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #555;
    text-align: left;
    line-height: 120%;
    letter-spacing: -0.048rem;
}
.option-cate-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    letter-spacing: -0.048rem;
}
.option-cate-item.sm {
    font-size: 1.4rem;
}
.option-cate-item-box {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.option-cate.md {
    height: 5.6rem;
    font-size: 1.5rem;
}
.option-cate em {
    font-weight: 700;
    letter-spacing: -0.051rem;
    line-height: 110%;
}
.option-cate.color02 {
    border: 1px solid #df5911;
    background: rgba(223, 89, 17, 0.1);
    color: #df5911;
}
.option-cate.color03 {
    border: 1px solid #0fa3de;
    background: rgba(15, 163, 222, 0.1);
    color: #0fa3de;
}
.option-cate.color04 {
    border: 1px solid #5742b5;
    background: rgba(87, 66, 181, 0.1);
    color: #5742b5;
}
.option-cate.color05 {
    border: 1px solid #082d8c;
    background: rgba(8, 45, 140, 0.1);
    color: #082d8c;
}
.option-cate.color06 {
    border: 1px solid #1e5b9c;
    background: rgba(30, 91, 156, 0.1);
}
.option-cate.color06 em {
    color: #1e5b9c;
}
.option-cate.color06 .option-num {
    background: #1e5b9c;
}
.option-cate.color07 {
    border: 1px solid #8d5ba6;
    background: rgba(141, 91, 166, 0.1);
}
.option-cate.color07 em {
    color: #8d5ba6;
}
.option-cate.color07 .option-num {
    background: #8d5ba6;
}
.option-cate.color08 {
    border: 1px solid #cb614d;
    background: rgba(203, 97, 77, 0.1);
}
.option-cate.color08 em {
    color: #cb614d;
}
.option-cate.color08 .option-num {
    background: #cb614d;
}
.option-cate.color09 {
    border: 1px solid #b08b61;
    background: rgba(176, 139, 97, 0.1);
}
.option-cate.color09 em {
    color: #b08b61;
}
.option-cate.color09 .option-num {
    background: #b08b61;
}
.option-cate.color10 {
    border: 1px solid #559243;
    background: rgba(85, 146, 67, 0.1);
}
.option-cate.color10 em {
    color: #559243;
}
.option-cate.color10 .option-num {
    background: #559243;
}
.option-title {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.6rem;
    height: 4.4rem;
    padding: 0.35rem 1.1rem;
    background-color: #6e7e8e;
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 120%;
    color: #fff;
    text-align: center;
    word-break: break-all;
    letter-spacing: -0.048rem;
}
.option-title.sm {
    font-size: 1.5rem;
}
.option-title.lg {
    height: 6.4rem;
}
.option-title.color01 {
    background-color: #60aa00;
}
.option-title.color02 {
    background-color: #df5911;
}
.option-title.color03 {
    background-color: #0fa3de;
}
.option-title.color04 {
    background-color: #5742b5;
}
.option-title.color05 {
    background-color: #082d8c;
}
.option-title.color06 {
    background-color: #1e5b9c;
}
.option-title.color07 {
    background-color: #8d5ba6;
}
.option-title.color08 {
    background: #cb614d;
}
.option-title.color09 {
    background: #b08b61;
}
.option-title.color10 {
    background: #559243;
}
.option-list {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    gap: 1.2rem 1rem;
    width: 100%;
}
.option-list.four {
    flex-wrap: wrap;
}
.option-list.four .option-item {
    width: calc(50% - 0.5rem);
}
.option-item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}
.option-img {
    flex-grow: 1;
}
.option-img img {
    width: 100%;
    height: 100%;
}
.option-num {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    height: 2.1rem;
    padding: 0.4rem 0.6rem;
    border-radius: 0.4rem;
    background: rgba(0, 0, 0, 0.25);
    font-size: 1.4rem;
    font-weight: 600;
    line-height: 1.7rem;
    color: #fff;
}
@media (max-width: 1640px) {
    .option-cate.md,
    .option-title.md {
        min-height: 5.6rem;
        height: auto;
    }
    .option-cate.lg,
    .option-title.lg {
        min-height: 6.4rem;
        height: auto;
    }
}
@media (max-width: 1440px) {
    .option-cate,
    .option-title {
        min-height: 4.4rem;
        height: auto;
    }
}
@media (max-width: 1279px) {
    .option-container {
        padding: 5rem 4rem;
    }
    .option-list.four {
        flex-wrap: wrap;
    }
    .option-list.four .option-item {
        width: calc(50% - 0.6rem);
    }
    .option-top {
        flex-direction: column;
    }
    .option-top .option-box,
    .option-top .option-item {
        width: 100%;
    }
    .option-box-wrap {
        flex-direction: column;
        width: 100%;
    }
    .option-box-wrap.two .option-box,
    .option-box-wrap.three .option-box,
    .option-box-wrap.type23 .option-box {
        width: 100% !important;
    }
    .option-list {
        flex-wrap: wrap;
    }
    .option-item:not(.option-top .option-item) {
        flex-grow: 1;
        min-width: 19.2rem;
        width: 100%;
    }
}
@media (max-width: 767px) {
    .option-container {
        padding: 4rem 3rem;
    }
    .option-top,
    .option-box {
        width: 100%;
        max-width: 100%;
    }
}
@media (max-width: 587px) {
    .option-box-wrap.full .option-item {
        flex: auto;
        width: 100%;
    }
}
@media (max-width: 420px) {
    .option-container {
        padding: 3rem;
    }
    .option-item {
        flex: auto;
        max-width: 100% !important;
        min-width: auto !important;
        width: 100% !important;
    }
    .option-cate {
        gap: 0.4rem;
        flex-wrap: wrap;
        padding: 0.8rem 2rem;
    }
    .option-cate-item {
        flex-direction: column;
        align-items: start;
    }
    .option-cate-item-box {
        width: 100%;
    }
}

.alarm-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6rem;
    background: #f7f7f7;
}
.alarm-text {
    position: relative;
    padding-left: 2.3rem;
}
.alarm-text:before {
    content: "\ee59";
    position: absolute;
    left: 0;
    font-family: "remixicon";
    top: 0;
    font-size: 1.6rem;
    color: #555;
}
.alarm-btns {
    display: flex;
    gap: 0.8rem;
}
.alarm-btns > a {
    flex: 1;
    min-width: 26rem;
}
@media (max-width: 1440px) {
    .alarm-box {
        padding: 4rem;
    }
}
@media (max-width: 1279px) {
    .alarm-box {
        flex-direction: column;
        align-items: start;
        gap: 3.2rem;
        padding: 4rem 3rem;
    }
}
@media (max-width: 587px) {
    .alarm-btns {
        flex-wrap: wrap;
    }
}

.download-box {
    display: flex;
    flex-wrap: wrap;
    gap: 2.4rem;
    align-items: center;
    justify-content: space-between;
}
.download-btns > a {
    gap: 0.4rem;
    padding: 1.2rem 2.4rem;
}

.model-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4rem;
}
.model-container:has(.model-item:nth-child(2)) .model-item {
    width: calc(50% - 2rem);
}
.model-item {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.model-item:hover:before {
    background: rgba(0, 14, 72, 0.9);
}
.model-item:hover .model-item-hover {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}
.model-item:before {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: transparent;
    transition: background 0.4s cubic-bezier(0.44, 0, 0.56, 1);
}
.model-item-hover {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4rem;
    width: 100%;
    height: 100%;
    padding: 3rem;
    transform: translateY(5%);
    will-change: transform;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s cubic-bezier(0.44, 0, 0.56, 1),
        visibility 0.4s cubic-bezier(0.44, 0, 0.56, 1),
        transform 0.8s cubic-bezier(0.44, 0, 0.56, 1);
    z-index: 2;
}
.model-item-hover .title {
    display: block;
    color: var(--white);
    font-size: 4.4rem;
    font-weight: 700;
    text-align: center;
}
.model-btns {
    display: flex;
    gap: 0.8rem;
    width: 44.4rem;
    max-width: 100%;
}
.model-btns > a {
    flex: 1;
}
@media (max-width: 1023px) {
    .model-container {
        gap: 2.4rem;
    }
    .model-container:has(.model-item:nth-child(2)) .model-item {
        width: calc(50% - 1.2rem);
    }
}
@media (max-width: 767px) {
    .model-container {
        gap: 1.6rem;
    }
    .model-container:has(.model-item:nth-child(2)) .model-item {
        width: calc(50% - 0.8rem);
    }
    .model-item-hover {
        gap: 2.4rem;
    }
    .model-item-hover .title {
        font-size: 3.6rem;
    }
    .model-btns {
        flex-wrap: wrap;
    }
    .model-btns > a {
        flex: none;
        width: 100%;
        padding: 1rem 1.6rem;
    }
}
@media (max-width: 587px) {
    .model-container:has(.model-item:nth-child(2)) .model-item {
        width: 100%;
    }
}

.topic-box {
    display: flex;
    align-items: center;
    gap: 4rem;
}
.topic-content {
    flex: 1;
}
.topic-content-title {
    font-family: var(--nanum);
    color: var(--bg-navy);
    font-size: 4.4rem;
}
.topic-circle {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 12rem;
    height: 12rem;
    border-radius: 50%;
    background: var(--bg-brown);
}
.topic-circle-title {
    color: var(--white);
    font-family: var(--nanum);
    font-size: 3.4rem;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.068rem;
}

.interior-container {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.interior-container .double-box {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.interior-item {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.interior-item[data-num="2"] .img-box {
    width: calc(50% - 1rem);
}
.interior-item[data-num="3"] > .img-box {
    width: 65%;
}
.interior-item[data-num="3"] .double-box {
    flex: 1;
}
.interior-item[data-num="3"] .double-box .img-box:last-child {
    flex: 1;
}
.interior-item[data-num="3"] .double-box .img-box:last-child img {
    display: block;
    height: 100%;
}
@media (max-width: 767px) {
    .interior-item[data-num="2"] .img-box {
        width: 100%;
    }
    .interior-item[data-num="3"] > .img-box {
        width: 100%;
    }
    .interior-item[data-num="3"] img {
        width: 100%;
    }
}

.notice-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: end;
    gap: 2.4rem;
    padding: 6rem 0;
    border-top: 3px solid var(--bg-brown);
}
.notice-btns > a {
    justify-content: center;
    gap: 1.2rem;
    min-width: 37rem;
}
@media (max-width: 1023px) {
    .notice-container {
        padding: 4rem 0;
    }
}
@media (max-width: 767px) {
    .notice-container {
        padding: 3rem 0;
    }
}
@media (max-width: 390px) {
    .notice-btns {
        width: 100%;
    }
}

.location-map {
    height: 48.4rem;
}
.location-map .root_daum_roughmap {
    width: 100%;
    height: 100%;
}
.location-map .root_daum_roughmap .map_border,
.location-map .root_daum_roughmap .cont {
    display: none;
}
.location-map .root_daum_roughmap .wrap_map {
    height: 100%;
}
.location-info-box {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-top: 4.5rem;
}
.location-info-item {
    display: flex;
    flex-direction: column;
    padding: 4rem;
    background: #f7f4ee;
}
.location-info-item .location-item > strong {
    display: inline-block;
    min-width: 11rem;
}
.location-info-detail-list {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
}
.location-info-detail-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 2rem;
}
.location-info-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 11.2rem;
    color: var(--white);
    font-size: 2rem;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -0.06rem;
    padding: 0.6rem 1.6rem;
    background: var(--bg-brown);
    border-radius: 6.4rem;
}
.location-list {
    display: flex;
    flex-wrap: wrap;
    gap: 2.4rem 4rem;
}
.location-item {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem 2rem;
}
.location-item > strong {
    line-height: 150%;
}
.location-contact {
    display: flex;
    gap: 6rem;
}
.location-contact > div {
    flex: 1;
}
.location-contact > div:not(:first-child) {
    padding-left: 6rem;
    border-left: 1px dashed #ccc;
}
.location-cs {
    flex: 1;
    display: flex;
}
.location-cs-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}
.location-cs-item .tel {
    display: block;
    width: -moz-fit-content;
    width: fit-content;
    color: var(--bg-navy);
    font-size: 5.2rem;
    font-weight: 700;
    line-height: 120%;
    letter-spacing: -0.156rem;
}
.location-btns {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}
.location-btn {
    display: flex;
    align-items: center;
    gap: 2.4rem;
    padding: 1.2rem 1rem;
    border-bottom: 1px solid #ddd;
}
.location-btn > strong {
    flex-shrink: 0;
    min-width: 12.6rem;
}
.location-btn > p {
    flex: 1;
}
.location-btn > .icon {
    color: #111;
    font-size: 2rem;
    display: block;
    margin-left: auto;
}
@media (max-width: 1279px) {
    .location-contact {
        gap: 4rem;
    }
    .location-contact > div:not(:first-child) {
        padding-left: 4rem;
    }
    .location-cs-item .tel {
        font-size: 4.8rem;
    }
}
@media (max-width: 1023px) {
    .location-contact {
        flex-wrap: wrap;
    }
    .location-btns {
        flex: none !important;
        width: 100%;
        padding-left: 0 !important;
        border-left: none !important;
    }
    .location-info-item {
        padding: 3rem;
    }
}
@media (max-width: 767px) {
    .location-map {
        height: 40rem;
    }
    .location-info-item {
        padding: 3rem 2rem;
    }
    .location-info-detail-item {
        flex-direction: column;
        align-items: start;
    }
    .location-info-badge {
        font-size: 16px;
        min-width: auto;
    }
    .location-contact {
        gap: 2rem;
    }
    .location-contact > div:not(:first-child) {
        padding-left: 2rem;
    }
}
@media (max-width: 587px) {
    .location-contact > div {
        flex: none;
        padding-left: 0 !important;
        border-left: none !important;
    }
    .location-cs-item {
        width: 100%;
    }
}
@media (max-width: 390px) {
    .location-map {
        height: 36rem;
    }
}

.g-search-area {
    font-family: "Pretendard";
}
.g-search-area input,
.g-search-area select,
.g-search-area button {
    font-family: "Pretendard";
}

.search-top-box {
    padding: 2.8rem;
    margin-bottom: 4rem;
    border: 1px solid #e7e6ed;
    border-radius: 1rem;
    background: #f8f8f8;
}
.search-top-box .form-col-group {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.8rem;
}
.search-top-box .form-tit {
    display: none;
}

.g-search-area {
    display: flex;
    flex-direction: column-reverse;
}

.search-list-top {
    margin-bottom: 1.8rem;
    margin-top: 0;
}
.search-list-top .sch-info li {
    display: inline-block;
    font-size: 1.6rem;
}
.search-list-top .sch-info li:not(:last-child) {
    padding-right: 0;
}
.search-list-top .sch-info li:not(:last-child)::after {
    display: none;
}

.sch-input {
    display: flex;
    gap: 0.8rem;
}
.sch-input input {
    width: 40rem !important;
    height: 4.4rem;
    padding: 1rem 1.6rem;
    border: 1px solid #d5d4da;
    border-radius: 0.4rem;
    background: #fff;
    font-size: 1.6rem;
    font-weight: 500;
    color: #333;
}
.sch-input input::-moz-placeholder {
    color: #999;
}
.sch-input input::placeholder {
    color: #999;
}
.sch-input button {
    position: static !important;
    min-width: 8.2rem;
    height: 4.4rem !important;
    padding: 1rem 1.6rem !important;
    border-radius: 0.4rem !important;
    background: #333 !important;
    font-size: 1.6rem !important;
    font-weight: 600 !important;
    color: #fff !important;
}
.sch-input button .sr-only {
    position: relative !important;
    width: auto !important;
    height: auto !important;
    overflow: auto !important;
    margin: 0 !important;
    -webkit-clip-path: none !important;
    clip-path: none !important;
}
.sch-input button .ico-sch {
    display: none !important;
}
.sch-input .ico-search {
    transform: translateY(0) !important;
}
.sch-info {
    display: flex !important;
    align-items: center !important;
    font-size: 1.6rem !important;
    font-weight: 500 !important;
    color: #333 !important;
    line-height: 1.25 !important;
    gap: 1.2rem;
}
.sch-info .total {
    color: #333 !important;
    font-weight: 700;
}
.sch-select {
    display: inline-block;
    position: relative;
}
.sch-select::after {
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    font-family: "remixicon";
    color: #000;
    content: "\ea4d";
}
.sch-select select {
    min-width: 13rem;
    width: 100%;
    height: 4.4rem;
    padding: 0.8rem 1.6rem;
    padding-right: 3.4rem;
    border: 1px solid #d5d4da;
    border-radius: 0.4rem;
    background-color: #fff;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.6rem;
    font-weight: 500;
    color: #444;
    -o-appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: none !important;
}

.community-page-title {
    padding: 4rem 3rem;
    border-top: 1px solid #222;
    border-bottom: 1px solid #e0e0e0;
    background: #f8f8f8;
    font-family: "Pretendard";
    text-align: center;
}
.community-page-title .tit {
    color: #111;
    font-size: 2.6rem;
    font-weight: 600;
    line-height: 1.4;
}
.community-page-title .info {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 1.6rem;
    font-size: 1.7rem;
    color: #757575;
    line-height: 1.25;
    gap: 0.8rem 2.4rem;
}
.community-page-title .info span {
    display: inline-block;
    position: relative;
}
.community-page-title .info span::after {
    position: absolute;
    top: 0.2rem;
    right: -1.2rem;
    width: 1px;
    height: 1.5rem;
    background-color: #e0e0e0;
    content: "";
}
.community-page-title .info span:last-child::after {
    display: none;
}

.board-util {
    border-top: 1px solid #e0e0e0;
    font-family: "Pretendard";
}
.board-util-item {
    display: flex;
    border-bottom: 1px solid #e0e0e0;
}
.board-util-title {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 18rem;
    color: #222;
    padding: 2rem 2.4rem;
    background: #f8f8f8;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    gap: 0.6rem;
}
.board-util-title i {
    font-size: 2.2rem;
    font-weight: 400;
}
.board-util-con {
    display: flex;
    align-items: center;
    flex-grow: 1;
    padding: 2rem 2.4rem;
    font-size: 1.8rem;
    color: #616161;
    line-height: 1.4;
}
.board-util-con a {
    color: #222;
}
.board-file {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}
.board-file-item {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 1.6rem;
    color: #222;
    gap: 0.2rem 0.6rem;
}
.board-file-item img {
    flex-shrink: 0;
    width: 2rem;
}
.board-file-item span {
    color: #9e9e9e;
}
.board-file-item:hover p {
    text-decoration: underline;
    text-underline-offset: 3px;
}
.board-file-down {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 4rem;
    padding: 1rem 2.2rem;
    margin-top: 1.6rem;
    border-radius: 0.3rem;
    background-color: #222;
    font-size: 1.6rem;
    font-weight: 500;
    color: #fff !important;
    gap: 0.6rem;
}
.board_list {
    font-family: var(--ff);
}
.board_list table {
    border-top: 2px solid #333;
    text-align: center;
    table-layout: fixed;
}
.board_list table thead tr {
    border-bottom: 1px solid #aaa;
}
.board_list table thead th {
    padding: 2rem 1.6rem;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.4;
}
.board_list table tbody tr {
    border-bottom: 1px solid #e6e6e6;
    transition: 0.24s;
}
.board_list table tbody tr:hover {
    background-color: #f8f8f8;
}
.board_list table tbody td {
    padding: 2rem 1.6rem;
    font-size: 1.8rem;
    color: #767676;
    line-height: 1.25;
}
.board_list table tbody td a {
    display: block;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    color: #333;
}
.board_list table tbody td a .icon_new {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 50%;
    background-color: #e60012;
}
.board_list table tbody td a .icon_new::before {
    font-size: 1.2rem;
    font-weight: 700;
    text-indent: 0;
}
.board_list table tbody td a.viewFiles i {
    font-size: 2rem;
}
.board_list table tbody td .attach_file {
    left: auto;
    right: 0;
    transform: translateX(0);
}

.page-btn-wrap {
    justify-content: center !important;
    margin-top: 6rem;
    text-align: center;
}
.page-btn-wrap button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 10rem;
    height: 5.6rem !important;
    padding: 1rem 2.4rem !important;
    border-radius: 1.2rem !important;
    background: #333 !important;
    font-family: var(--ff) !important;
    font-size: 1.8rem !important;
    font-weight: 500 !important;
    color: #fff !important;
    line-height: 1.4 !important;
}

@media (max-width: 767px) {
    .board_list table thead,
    .board_list table colgroup {
        display: none;
    }
    .board_list table tr {
        display: block;
        position: relative;
        padding: 2rem 0 2rem 6rem;
        text-align: left;
    }
    .board_list table td {
        position: relative;
        display: block;
        padding: 2px 0 !important;
        border-bottom: 0 none;
        text-align: left;
    }
    .board_list table td.txt_left::before,
    .board_list table td[aria-label="번호"]::before,
    .board_list table td[aria-label="첨부파일"]::before,
    .board_list table td[aria-label="처리상태"]::before,
    .board_list table td[aria-label="링크"]::before {
        display: none;
    }
    .board_list table td[aria-label="첨부파일"]:has(.viewFiles)::before {
        display: inline-block;
    }
    .board_list table td.txt_left {
        display: block;
        margin-bottom: 1rem;
        font-size: 1.8rem;
        max-width: 95%;
    }
    .board_list table td[aria-label="번호"]:first-child {
        display: inline-block;
        position: absolute;
        top: 1.6rem;
        left: 1rem;
        width: 3.6rem;
        height: 3.6rem;
        overflow: hidden;
        padding: 0 !important;
        border-radius: 100%;
        background-color: var(--bg-navy);
        font-size: 1.5rem;
        color: #fff;
        line-height: 3.6rem;
        text-align: center;
        vertical-align: middle;
    }
    .board_list table td[aria-label="조회수"] {
        display: none;
    }
    .board_list table td[aria-label="처리상태"],
    .board_list table td[aria-label="링크"] {
        display: inline;
    }
    .board_list table td .icon1,
    .board_list table td .btn_s {
        margin: 1rem 0 0;
    }
    .board_list table td::before {
        display: inline-block;
        margin-right: 1rem;
        font-weight: 600;
        color: #333;
        vertical-align: middle;
        content: attr(aria-label);
    }
    .board_list table tbody td > a {
        font-size: 2rem;
        font-weight: 600;
    }
    .board_list table tbody td a.viewFiles {
        display: inline-block;
        position: relative;
        width: -moz-fit-content;
        width: fit-content;
        font-weight: 400;
    }
    .board_list table tbody td .attach_file {
        position: relative;
        width: 100%;
        left: 0;
        top: 0;
        width: calc(100% - 1rem);
        transform: translateX(0);
    }
    .search-list-top .sch-info li {
        font-size: 15px;
    }
    .sch-input input {
        width: 26rem !important;
    }
    .board-util-title {
        width: 16rem;
    }
}
@media (max-width: 587px) {
    .search-top-box .form-col-group {
        flex-direction: column;
    }
    .search-top-box .form-col-group .form-group {
        width: 100%;
    }
    .sch-input input {
        flex-grow: 1;
    }
    .search-top-box .sch-form-wrap,
    .search-top-box .sch-select,
    .search-top-box .sch-input {
        width: 100%;
    }
    .sch-input input {
        width: inherit !important;
    }
    .board-util-item {
        flex-direction: column;
    }
    .board-util-title {
        width: 100%;
        padding: 1.4rem 2.4rem;
    }
    .board-file {
        width: 100%;
    }
    .board-file-down {
        margin: 1.6rem auto 0;
    }
}
@media (max-width: 459px) {
    .board_list table tr {
        padding: 1.6rem 0;
    }
    .board_list table td[aria-label="번호"]:first-child {
        position: static;
        margin-bottom: 1rem;
    }
}
@media (max-width: 390px) {
    .search-top-box .sch-input {
        flex-wrap: wrap;
    }
    .sch-input .ico-search {
        width: 100% !important;
    }
}