@charset "utf-8";
/* CSS Document */

body[style*="overflow"] {
    overflow: auto !important;
    padding-right: 0 !important;
}

.wrap {
    position: relative;
}
.wrap::before {
    /* content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1;
    width: 100%;
    max-width: 1216px;
    height: 100%;
    margin: auto;
    background: rgba(255, 0, 0, 0.05); */
}

@media (min-width: 1200px) and (max-width: 1299px) {
    .wrap::before {
        /* max-width: 100%; */
    }
}
@media (min-width: 1300px) and (max-width: 1599px) {
    .wrap::before {
        max-width: 100%;
        margin: auto 32px auto 32px;
    }
}


.pc .header,
.pc .footer {
    display: none;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .pc .header,
    .pc .footer {
        display: block;
    }
}

/* 1921px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1921px) {
    .inner {
        margin: auto;
    }
}





/* ------------------------- Header : Start ------------------------- */
.header {
    position: fixed;
    z-index: 10;
    width: 100%;
}
.header.scroll-bg {
    background: var(--white);
}
.header > .inner > .container-xxl {
    --bs-gutter-x: 0;
    display: flex;
    flex-direction: column;
    position: relative;
    border-bottom: var(--sz-2) solid var(--gray-100);
}
body[style*="overflow"] .header .inner {
    /* padding-right: var(--sz-15); */
}





/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .inner {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .modal-open .header .inner {
        /* padding-right: calc(2rem + 0.94rem); */
        padding-right: 2rem;
    }

    .header > .inner > .container-xxl {
        flex-direction: row;
        margin-right: 0;
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .header .inner {
        margin-left: auto;
    }
}

/* 1600px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1600px) {
    .header > .inner > .container-xxl {
        margin-right: auto;
    }
}


/********** Logo : Start **********/
.header .navbar-brand {
    position: absolute;
    top: var(--sz-16);
    left: var(--sz-20);
    z-index: 1;
    width: 6.75rem;
    height: var(--sz-24);
    background: url(/openads3/images/openads-logo-web.svg) no-repeat center / 100%;
    text-indent: -9999px;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .navbar-brand {
        /* top: 1.56rem; */
        top: 1.69rem;
        left: var(--sz-32);
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .header .navbar-brand {
        top: var(--sz-24);
        left: var(--sz-32);
        width: 7rem;
        height: var(--sz-32);
        background: url(/openads3/images/openads-logo-web.svg) no-repeat center / 100%;
    }
}
/********** Logo : End **********/





/********** GNB, Util - Common : Start **********/
.header .gnb,
.header .util {
    flex-direction: row;
    padding-left: var(--sz-20);
    padding-right: var(--sz-20);
}
.header .gnb .nav-item,
.header .util .nav-item {
    display: flex;
    align-items: center;
    white-space: nowrap;
}
.header .gnb .nav-link,
.header .util .nav-link {
    padding: 0;
    font-size: var(--sz-13);
}
.nav-link:focus-visible {
    box-shadow: none;
}
/********** GNB, Util - Common : End **********/



/********** GNB : Start **********/
.header .gnb .nav-item {
    padding-top: 1.06rem;
    padding-bottom: 1.13rem;
}
.header .gnb .nav-item::after {
    content: '';
    display: inline-block;
    width: 2px;
    height: 2px;
    margin-left: var(--sz-12);
    margin-right: var(--sz-12);
    background-color: var(--gray-100);
    border-radius: 50%;
    vertical-align: middle;
}
.header .gnb .nav-item:first-child::after {
    width: 1px;
    height: var(--sz-12);
    margin-left: var(--sz-20);
    margin-right: var(--sz-20);
    border-radius: 0;
}
.header .gnb .nav-item:last-child::after {
    display: none;
}
.header .gnb .nav-link {
    position: relative;
    font-size: var(--sz-14);
}
.header .gnb .nav-link.active {
    font-weight: 700;
}
.header .gnb .nav-link.active::before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(var(--sz-18) * -1);
    height: var(--sz-2);
    background: var(--gray-100);
}
.header .gnb .dropdown .nav-link.active {
    font-weight: 400;
}
.header .gnb .dropdown .nav-link.active::before {
    display: none;
}

/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .gnb {
        padding-left: 0;
        padding-right: 0;
        margin-left: 11%;
    }
    .header .gnb .nav-item {
        padding-top: var(--sz-24);
        padding-bottom: var(--sz-24);
    }
    .header .gnb .nav-link {
        font-size: var(--sz-20);
    }
    .header .gnb .nav-item::after {
        width: 3px;
        height: 3px;
        margin-left: var(--sz-16);
        margin-right: var(--sz-16);
    }
    .header .gnb .nav-item:first-child::after {
        height: 1.13rem;
        margin-left: var(--sz-20);
        margin-right: var(--sz-20);
    }
    .header .gnb .nav-link.active::before {
        bottom: calc(var(--sz-24) * -1);
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .header .gnb {
        margin-left: 0;
    }
}



/* Dropdown (Category) : Start */
.header .dropdown.category {
    position: static;
}
.header .dropdown.category::after {
    width: var(--sz-1);
    height: var(--sz-12);
    margin-left: var(--sz-20);
    margin-right: var(--sz-20);
    border-radius: 0;
    vertical-align: middle;
}
.header .dropdown.category .dropdown-toggle {
    font-weight: bold;
}
.header .dropdown.category .dropdown-toggle .ico {
    margin-right: var(--sz-4);
}
.header .dropdown.category .dropdown-toggle::after {
    display: none;
}
.header .dropdown.category .dropdown-menu {
    --bs-dropdown-padding-x: 0;
    --bs-dropdown-padding-y: 0;
    flex-wrap: wrap;
    top: 1rem !important;
    left: 0;
    z-index: 10000;
    border: 0;
    border-top: 1px solid var(--gray-100) !important;
    border-bottom: 1px solid var(--gray-100) !important;
    border-radius: 0;
}
.header .dropdown.category .dropdown-menu.show {
    display: flex;
}
.header .dropdown.category .dropdown-menu li {
    flex-basis: 25%;
}
.header .dropdown.category .dropdown-menu .divider {
    display: none;
    width: var(--sz-20);
    height: var(--sz-1);
    margin: 0 var(--sz-14);
    background-color: var(--gray-100);
    align-self: center;
    flex-shrink: 0;
}
.header .dropdown.category .dropdown-menu li .dropdown-item {
    --bs-dropdown-item-padding-y: var(--sz-10);
    --bs-dropdown-item-padding-x: var(--sz-16);
    justify-content: center;
    font-size: var(--sz-14);
    color: var(--gray-100);
    text-align: center;
}
.header .dropdown.category .dropdown-menu li .dropdown-item.active,
.header .dropdown.category .dropdown-menu li .dropdown-item:hover,
.header .dropdown.category .dropdown-menu li .dropdown-item:focus {
    --bs-dropdown-link-hover-bg: var(--gray-100);
    --bs-dropdown-link-hover-color: var(--white);
    font-weight: 700;
    background-color: var(--bs-dropdown-link-hover-bg);
    color: var(--white) !important;
}
.header .dropdown.category .dropdown-menu .d-xl-block {
    flex-basis: 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .dropdown.category::after {
        width: var(--sz-1);
        height: 1.13rem;
        margin-left: var(--sz-20);
        margin-right: var(--sz-20);
    }
    .header .dropdown.category .dropdown-menu {
        --bs-dropdown-padding-y: 0;
        flex-direction: row;
        top: var(--sz-24) !important;
        left: calc(var(--sz-32) * -1) !important;
        right: 0 !important;
        max-width: 100%;
        border: none;
        border-bottom: 1px solid var(--gray-100);
        background-color: rgba(255, 255, 255, 0.9);
        border-radius: 0;
    }
    .header .dropdown.category .dropdown-menu li {
        flex-basis: auto;
    }
    .header .dropdown.category .dropdown-menu .divider {
        display: block;
    }
    .header .dropdown.category .dropdown-menu li .dropdown-item {
        --bs-dropdown-item-padding-y: var(--sz-13);
        --bs-dropdown-item-padding-x: var(--sz-14);
        font-size: var(--sz-16);
        color: var(--gray-100);
    }
    .header .dropdown.category .dropdown-menu .d-xl-block {
        flex-basis: 100%;
    }
    .header .dropdown.category .dropdown-menu .d-xl-block + li {
        margin-left: 5.19rem;
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .header .dropdown.category .dropdown-menu {
        left: 0 !important;
    }
}
/* Dropdown (Category) : End */


/* Dropdown (Ad-Prd-Info) : Start */
.header .gnb .nav-item:nth-child(4)::after {
    width: 0;
    height: 0;
    margin-left: 0;
}
.header .dropdown.ad-prd-info::after {
    display: none;
}
.header .dropdown.ad-prd-info .dropdown-toggle::after {
    width: var(--sz-16);
    height: var(--sz-16);
    margin-left: 0;
    border: 0;
    background: url(/openads3/images/ico-chevron-bottom-gray-default-24px.svg) no-repeat center / 100%;
    vertical-align: middle;
}
.header .dropdown.ad-prd-info .dropdown-menu {
    position: absolute;
    top: var(--sz-16) !important;
    left: -25% !important;
    z-index: 10000;
    min-width: var(--sz-120);
    border: var(--sz-1) solid var(--gray-100);
    background: rgba(255, 255, 255, 0.9);
    border-radius: 0;
}
.header .dropdown.ad-prd-info .dropdown-menu::before,
.header .dropdown.ad-prd-info .dropdown-menu::after {
    content: '';
    position: absolute;
    left: calc(50% - var(--sz-10));
    width: 0;
    height: 0;
    border-left: var(--sz-10) solid transparent;
    border-right: var(--sz-10) solid transparent;
}
.header .dropdown.ad-prd-info .dropdown-menu::before {
    top: calc(var(--sz-10) * -1);
    border-bottom: var(--sz-10) solid var(--gray-100);
}
.header .dropdown.ad-prd-info .dropdown-menu::after {
    top: calc(var(--sz-9) * -1);
    border-bottom: var(--sz-10) solid rgba(255, 255, 255, 0.9);
}
.header .dropdown.ad-prd-info .dropdown-item {
    font-size: var(--sz-14);
    color: var(--gray-100);
}
.header .dropdown.ad-prd-info .dropdown-item:hover,
.header .dropdown.ad-prd-info .dropdown-item:focus {
    --bs-dropdown-link-hover-bg: transparent;
    font-weight: 700;
    text-decoration: underline;
    background-color: var(--bs-dropdown-link-hover-bg);
    color: var(--bs-dropdown-link-hover-color);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .dropdown.ad-prd-info .dropdown-toggle::after {
        width: var(--sz-24);
        height: var(--sz-24);
    }
    .header .dropdown.ad-prd-info .dropdown-menu {
        left: auto !important;
        min-width: 8.5rem;
    }
}
/* Dropdown (Ad-Prd-Info) : End */


/* Dropdown (AI-Tool) : Start */
.header .dropdown.ai-tool {
    position: relative;
}
.header .dropdown.ai-tool .dropdown-toggle::after {
    width: var(--sz-16);
    height: var(--sz-16);
    margin-left: 0;
    border: 0;
    background: url(/openads3/images/ico-chevron-bottom-gray-default-24px.svg) no-repeat center / 100%;
    vertical-align: middle;
}
.header .dropdown.ai-tool .dropdown-menu {
    position: absolute;
    top: var(--sz-16) !important;
    /* left: -100% !important; */
    left: -112% !important;
    right: auto !important;
    z-index: 10000;
    min-width: var(--sz-120);
    border: var(--sz-1) solid var(--gray-100);
    background: rgba(255, 255, 255, 0.9);
    border-radius: 0;
}
.header .dropdown.ai-tool .dropdown-menu::before,
.header .dropdown.ai-tool .dropdown-menu::after {
    content: '';
    position: absolute;
    left: calc(50% - var(--sz-10));
    width: 0;
    height: 0;
    border-left: var(--sz-10) solid transparent;
    border-right: var(--sz-10) solid transparent;
}
.header .dropdown.ai-tool .dropdown-menu::before {
    top: calc(var(--sz-10) * -1);
    border-bottom: var(--sz-10) solid var(--gray-100);
}
.header .dropdown.ai-tool .dropdown-menu::after {
    top: calc(var(--sz-9) * -1);
    border-bottom: var(--sz-10) solid rgba(255, 255, 255, 1);
}
.header .dropdown.ai-tool .dropdown-item {
    font-size: var(--sz-14);
}
.header .dropdown.ai-tool .dropdown-item:hover,
.header .dropdown.ai-tool .dropdown-item:focus {
    --bs-dropdown-link-hover-bg: transparent;
    font-weight: 700;
    text-decoration: underline;
    background-color: var(--bs-dropdown-link-hover-bg);
    color: var(--bs-dropdown-link-hover-color);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .dropdown.ai-tool .dropdown-toggle::after {
        width: var(--sz-24);
        height: var(--sz-24);
    }
    .header .dropdown.ai-tool .dropdown-menu {
        left: -65% !important;
        min-width: 8.63rem;
    }
}
/* Dropdown (AI-Tool) : End */
/********** GNB : End **********/


/********** Util : Start **********/
.header .util {
    align-self: flex-end;
    justify-content: flex-end;
    order: -1;
    gap: var(--sz-12);
    width: 100%;
    border-bottom: var(--sz-1) solid var(--gray-100);
}
.header .util > .nav-item {
    padding-top: var(--sz-15);
    padding-bottom: var(--sz-16);
    font-size: var(--sz-13);
    color: var(--gray-100);
}
.header .util .ico-search {
    width: var(--sz-24);
    height: var(--sz-24);
    background-size: var(--sz-24);
}
.header .util .ico-bell {
    width: var(--sz-24);
    height: var(--sz-24);
    background-size: var(--sz-24);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .util {
        align-self: center;
        order: 0;
        gap: var(--sz-20);
        padding-left: 0;
        padding-right: 0;
        border-bottom: none;
    }
    .header .util .nav-link {
        font-size: var(--sz-14);
    }
    .header .util .ico-search {
        width: var(--sz-32);
        height: var(--sz-32);
        background-size: var(--sz-32);
    }
    .header .util .ico-bell {
        width: var(--sz-32);
        height: var(--sz-32);
        background-size: var(--sz-32);
    }
}


/* User-Menu : Start */
.header .user-menu hr {
    opacity: 1;
}


/* (MO) OffCanvas (User-Menu) : Start */
.header .navbar.user-menu {
    padding: 0;
}
.header .navbar.user-menu .navbar-toggler {
    padding: 0;
    border: 0;
}
.header .navbar.user-menu .offcanvas {
    width: var(--sz-200);
    border-left: var(--sz-1) solid var(--gray-100);
    background-color: rgba(255, 255, 255, 0.9);
}
.header .navbar.user-menu .offcanvas .nav-link {
    font-size: var(--sz-14);
    color: var(--gray-100);
}
.header .navbar.user-menu .offcanvas-body {
    padding: var(--sz-8) 0;
}
.header .navbar.user-menu .offcanvas-body .nav-link {
    width: 100%;
    padding: var(--sz-10) var(--sz-16);
}
.header .navbar.user-menu .offcanvas-body .nav-link:hover,
.header .navbar.user-menu .offcanvas-body .nav-link.active {
    font-weight: bold;
    text-decoration: underline;
}
.header .navbar.user-menu .offcanvas-body hr {
    margin: var(--sz-8) 0 var(--sz-16);
}
.header .navbar.user-menu .offcanvas-body .btn {
    display: block;
    width: 100%;
    padding: var(--sz-9) var(--sz-12);
    /* margin: var(--sz-20) var(--sz-16); */
    margin: var(--sz-8) var(--sz-16);
    font-size: var(--sz-14);
}
.header .navbar.user-menu .offcanvas-backdrop.show {
    opacity: 0.1;
}
/* (MO) OffCanvas (User-Menu) : End */


/* (PC) DropDown (User-Menu) : Start */
.header .dropdown.user-menu .dropdown-toggle::after {
    width: var(--sz-16);
    height: var(--sz-16);
    margin-left: 0;
    border: 0;
    background: url(/openads3/images/ico-chevron-bottom-gray-default-24px.svg) no-repeat center / 100%;
    vertical-align: middle;
}
.header .dropdown.user-menu .dropdown-menu {
    position: absolute;
    top: var(--sz-15) !important;
    z-index: 10000;
    min-width: 7.69rem;
    border: var(--sz-1) solid var(--gray-100);
    background: rgba(255, 255, 255, 0.9);
    border-radius: 0;
}
.header .dropdown.user-menu .dropdown-menu::before,
.header .dropdown.user-menu .dropdown-menu::after {
    content: '';
    position: absolute;
    left: var(--sz-20);
    width: 0;
    height: 0;
    border-left: var(--sz-10) solid transparent;
    border-right: var(--sz-10) solid transparent;
}
.header .dropdown.user-menu .dropdown-menu::before {
    top: calc(var(--sz-10) * -1);
    border-bottom: var(--sz-10) solid var(--gray-100);
}
.header .dropdown.user-menu .dropdown-menu::after {
    top: calc(var(--sz-9) * -1);
    border-bottom: var(--sz-10) solid rgba(255, 255, 255, 1);
}
.header .dropdown.user-menu .dropdown-item {
    color: var(--gray-100);
    font-size: var(--sz-13);
}
.header .dropdown.user-menu .dropdown-item:hover,
.header .dropdown.user-menu .dropdown-item:focus {
    --bs-dropdown-link-hover-bg: transparent;
    font-weight: 700;
    text-decoration: underline;
    background-color: var(--bs-dropdown-link-hover-bg);
    color: var(--bs-dropdown-link-hover-color);
}
.header .dropdown.user-menu hr {
    margin: var(--sz-4) 0 var(--sz-8);
}
.header .dropdown.user-menu .ico-arrow-right {
    background-size: var(--sz-12);
}
/* (PC) DropDown (User-Menu) : End */


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    /* (PC) DropDown (User-Menu) : Start */
    .header .dropdown.user-menu .dropdown-toggle::after {
        width: var(--sz-24);
        height: var(--sz-24);
    }
    /* (PC) DropDown (User-Menu) : End */
}
/* User-Menu : End */


/* DropDown (Notification) : Start */
.header .dropdown.notification .dropdown-toggle::after {
    display: none;
}
.header .dropdown.notification .dropdown-menu {
    top: var(--sz-13) !important;
    left: auto !important;
    right: -1.19rem !important;
    z-index: 10000;
    width: 17rem;
    border: 1px solid var(--gray-100);
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 0;
}
.header .dropdown.notification .dropdown-menu::before,
.header .dropdown.notification .dropdown-menu::after {
    content: '';
    position: absolute;
    right: var(--sz-20);
    width: 0;
    height: 0;
    border-left: var(--sz-10) solid transparent;
    border-right: var(--sz-10) solid transparent;
}
.header .dropdown.notification .dropdown-menu::before {
    top: calc(var(--sz-10) * -1);
    border-bottom: var(--sz-10) solid var(--gray-100);
}
.header .dropdown.notification .dropdown-menu::after {
    top: calc(var(--sz-9) * -1);
    border-bottom: var(--sz-10) solid rgba(255, 255, 255, 1);
}
.header .dropdown.notification .box-header {
    padding: var(--sz-8) var(--sz-16) var(--sz-16);
    border-bottom: var(--sz-1) solid var(--gray-100);
}
.header .dropdown.notification .box-header .form-check.form-switch .form-check-input {
    width: var(--sz-28);
    height: var(--sz-16);
    background-position: 0.13rem center;
    background-size: 0.75rem;
}
.header .dropdown.notification .box-header .form-check.form-switch .form-check-input:checked {
    background-position: right 0.13rem center;
}
.header .dropdown.notification .box-body {
    overflow: hidden;
    overflow-y: auto;
    max-height: 22.06rem;
    line-height: 1;
}
/* 스크롤바 설정*/
.header .dropdown.notification .box-body::-webkit-scrollbar {
    width: 4px;
}
/* 스크롤바 막대 설정*/
.header .dropdown.notification .box-body::-webkit-scrollbar-thumb {
    border: 4px solid rgba(217, 217, 217, 1);
    background-color: rgba(255, 255, 255, 1);
}
/* 스크롤바 뒷 배경 설정*/
.header .dropdown.notification .box-body::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, 0);
}
.header .dropdown.notification .box-body > div.group {
    padding: var(--sz-12) var(--sz-16);
    border-bottom: var(--sz-2) solid rgba(30, 30, 30, 0.1);
}
.header .dropdown.notification .box-body ul.group .box {
    padding: var(--sz-12) var(--sz-16);
    border-bottom: var(--sz-1) solid rgba(30, 30, 30, 0.1);
}
.header .dropdown.notification .box-body .img-fluid {
    width: 4.69rem;
}
.header .dropdown.notification .box-body [class*="fs-"] {
    line-height: 1.5;
    white-space: normal !important;
}
.header .dropdown.notification .box-body .text-truncate {
    -webkit-line-clamp: 2;
}
/* DropDown (Notification) : End */


.header .util .btn {
    font-size: var(--sz-14);
}

/********** Util : End **********/



/********** Global-Search : Start **********/
.header .offcanvas.offcanvas-top.global-search {
    --bs-offcanvas-height: 16.38rem;
}
.header .offcanvas.offcanvas-top.global-search,
.header .global-search + .offcanvas-backdrop {
    top: 7.1rem;
}
.header .global-search {
    padding: var(--sz-40) 0 1.88rem;
}
.header .global-search .offcanvas-body {
    overflow: hidden;
    padding: 0;
}
.header .global-search .container-xxl {
    --bs-gutter-x: var(--sz-40);
}
.header .global-search [class*="col"] {
    display: flex;
    flex-direction: column;
    gap: var(--sz-40);
}
.header .global-search .group {
    flex-direction: column;
    gap: var(--sz-12);
}
.header .global-search .group .box {
    display: flex;
    align-items: center;
    gap: var(--sz-12);
}
[class*="search"] .input-group .form-control {
    height: var(--sz-48);
    padding: var(--sz-8) 0;
    border-width: 2px;
    font-size: var(--sz-20);
    line-height: 1.4;
}
[class*="search"] .input-group .form-control:focus {
    border-color: var(--orange-100);
    border-width: 2px;
}
.header .global-search .group .box .dot {
    width: 4px;
    height: 4px;
    margin-top: 0;
    background-color: var(--gray-20);
}

/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .header .offcanvas.offcanvas-top.global-search {
        --bs-offcanvas-height: 17.5rem;
    }
    .header .offcanvas.offcanvas-top.global-search,
    .header .global-search + .offcanvas-backdrop {
        top: var(--sz-80);
    }
    .header .global-search {
        padding: 5.25rem 0 2.88rem;
    }
    .header .global-search .offcanvas-body {
        padding: 0;
    }
    .header .global-search .container-xxl {
        padding-left: 0;
    }
    .header .global-search [class*="col"] {
        gap: var(--sz-32);
    }
    .header .global-search .group {
        gap: var(--sz-32);
    }
    [class*="search"] .input-group .form-control {
        height: 5.25rem;
        padding: var(--sz-16) 0;
        font-size: var(--sz-40);
        line-height: 1.3;
    }
    [class*="search"] .input-group .box-right {
        margin-top: var(--sz-12);
        gap: var(--sz-32);
    }
    [class*="search"] .input-group .vr {
        align-self: auto;
        min-height: 1.63rem;
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .header .global-search .container-xxl {
        max-width: 1216px;
        padding-left: 0;
        padding-right: 0;
    }
}
/********** Global-Search : End **********/
/* ------------------------- Header : End ------------------------- */





/* ------------------------- Content : Start ------------------------- */
.content {
    display: flex;
    flex-direction: column;
    margin: auto;
}
.content > * {
    width: 100%;
    margin: auto;
}
.group,
.box {
    display: flex;
}



/********** Section (Layout) : Start **********/
.section {
    padding-top: var(--sz-80);
}
.section:first-child {
    /* 모바일 헤더 높이 + 패딩 top */
    padding-top: calc(var(--sz-114) + var(--sz-32));
}

.section:last-child {
    padding-bottom: var(--sz-100);
}
.section .inner {
    padding-left: var(--sz-10);
    padding-right: var(--sz-10);
}
.section .box-header {
    position: relative;
    padding-bottom: var(--sz-16);
}
.section .box-header::before {
    content: '';
    position: absolute;
    left: var(--sz-10);
    right: var(--sz-10);
    bottom: 0;
    height: 1px;
    background-color: var(--gray-100);
}
.bg-gray-100 .box-header::before {
    background-color: var(--gray-80);
}
.section .box-header.border-0::before {
    display: none;
}
.section .box-header .icon-link {
    font-size: var(--sz-13);
}


/* Tab : Start */
.section .nav .nav-link {
    padding: 0;
    color: var(--gray-100);
    text-align: left;
}
[class*="bg-gray-100"] .nav .nav-link {
    color: var(--white);
}
.section .nav .nav-link.active {
    text-shadow: 0 0 1px var(--gray-100);
    color: var(--gray-100) !important;
}
.section .nav button.nav-link.active {
    text-decoration: underline;
}
.section .nav-pills .nav-link {
    height: var(--sz-40);
    padding: 0 var(--sz-12);
    border: 1px solid var(--gray-20);
    border-radius: 0;
    white-space: nowrap;
    user-select: none;
}
.section .nav-pills .nav-link.active,
.section .nav-pills button.nav-link.active,
.section .nav-pills .show > .nav-link {
    border: 1px solid var(--gray-100);
    background-color: var(--gray-100);
    color: var(--white) !important;
    text-decoration: none;
}
/* Tab : End */




/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .section {
        padding-top: var(--sz-100);
    }
    .section:first-child {
        /* PC 헤더 높이 + 패딩 top */
        padding-top: calc(var(--sz-80) + var(--sz-100));
    }
    .section:last-child {
        padding-bottom: var(--sz-200);
    }
    .section .inner {
        padding-left: var(--sz-16);
        padding-right: var(--sz-16);
    }
    .section .box-header::before {
        left: var(--sz-16);
        right: var(--sz-16);
    }
    .section .box-header .icon-link {
        font-size: var(--sz-14);
    }


    /* Tab : Start */
    .section .box-header .nav.d-xl-flex.gap-24 {
        row-gap: var(--sz-20) !important;
        margin-top: var(--sz-8);
        margin-bottom: var(--sz-16);
    }
    .section .nav.d-xl-flex.gap-20 {
        margin-top: var(--sz-12);
    }
    .section .nav-pills .nav-link {
        height: var(--sz-48);
        padding: 0 var(--sz-16);
    }
    /* Tab : End */
}
/********** Section (Layout) : Start **********/





/********** Img-Banner (Layout) : Start **********/
.img-banner .inner {
    padding-left: 0;
    padding-right: 0;
}
.img-banner .container-xxl {
    padding-left: 0;
    padding-right: 0;
}
.img-banner .row {
    padding-top: 0;
    margin-left: 0;
    margin-right: 0;
}
.img-banner [class*="col"] {
    padding-left: 0;
    padding-right: 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .img-banner .inner {
        padding-left: var(--sz-16);
        padding-right: var(--sz-16);
    }
    .img-banner .container-xxl {
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
    }
    .img-banner .row {
        margin-right: calc(-0.5 * var(--bs-gutter-x));
        margin-left: calc(-0.5 * var(--bs-gutter-x));
    }
    .img-banner [class*="col"] {
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
    }
}
/********** Img-Banner (Layout) : End **********/





/********** Card-List (Layout) : Start **********/

.empty {
    padding: 5rem 0;
}

/***** Card-List : Start *****/
.card-list .box-body > div[class*="col"]:last-child > .row {
    gap: 32px 0;
}
.card-list .card.border-bottom {
    padding: var(--sz-20) 0;
}
.card-list .tag {
    display: inline-block;
    overflow: hidden;
    max-width: 5.38rem;
    padding: var(--sz-3) var(--sz-6);
    line-height: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.text-truncate {
    display: -webkit-box;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    word-wrap: break-word;
    white-space: normal;
    word-break: keep-all;
    vertical-align: middle;
}
.card-list .stretched-link.text-truncate {
    height: 2.63rem;
    -webkit-line-clamp: 2;
}
.card-list .list-group .text-truncate {
    height: 1.06rem;
    -webkit-line-clamp: 1;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .card-list .box-body > div[class*="col"]:last-child > .row {
        gap: 40px 0;
    }
    .card-list .card.border-bottom {
        padding: var(--sz-32) 0;
        border-radius: 0;
    }
    .card-list .row.align-items-end [class*="col-"]::before {
        top: var(--sz-64);
        left: var(--sz-16);
        right: var(--sz-16);
    }
    .card-list .stretched-link.text-truncate {
        height: var(--sz-72);
    }
    .card-list .text-truncate[class*="-center"] {
        height: 2.6rem;
    }
    .card-list .list-group .text-truncate {
        height: 1.38rem;
        -webkit-line-clamp: 1;
    }
}
/***** Card-List : End *****/





/***** Card-List-Date : Start *****/
.card-list-date .row {
    justify-content: stretch;
    align-items: stretch;
    row-gap: var(--sz-32);
}
.card-list-date .row [class*="col-"] {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding-top: var(--sz-80);
}
.card-list-date .row [class*="col-"]::before {
    content: '';
    display: block;
    position: absolute;
    top: var(--sz-40);
    left: var(--sz-10);
    right: var(--sz-10);
    height: 1px;
    background-color: var(--gray-100);
}
.card-list-date .row [class*="col-"]:nth-child(odd)::before {
    right: 0;
}
.card-list-date .row [class*="col-"]:nth-child(even)::before {
    left: 0;
}
.card-list-date .card-header {
    position: absolute;
    top: calc(var(--sz-80) * -1);
}
.card-list-date .box-body > .group {
    padding: var(--sz-40) 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .card-list-date {
        padding-bottom: var(--sz-100);
    }
    .card-list-date .box-body {
        display: flex;
        flex-wrap: wrap;
        row-gap: var(--sz-32);
    }
    .card-list-date .row [class*="col-"] {
        padding-top: 7.31rem;
    }
    .card-list-date .row [class*="col-"]::before {
        top: var(--sz-56);
    }
    .card-list-date .row [class*="col-"]:nth-child(4n)::before {
        right: var(--sz-16);
    }
    .card-list-date .row [class*="col-"]:nth-child(4n+1)::before {
        left: var(--sz-16);
    }
    .card-list-date .row [class*="col-"]:nth-child(4n+2)::before {
        right: 0;
    }
    .card-list-date .row [class*="col-"]:nth-child(4n+3)::before {
        left: 0;
    }
    .card-list-date .card-header {
        top: -7.31rem;
    }
}
/***** Card-List-Date : End *****/
/********** Card-List (Layout) : End **********/





/********** List-Group (Layout) : Start **********/
/* List-Group : Start */
.list-group .list-group-item {
    padding: var(--sz-8) 0;
    border: none;
    border-radius: 0;
    background-color: transparent;
}
.list-group .list-group-item.tit {
    padding-top: 0;
    padding-left: 0;
    margin-bottom: var(--sz-8);
    border-bottom: 1px solid var(--gray-100);
}
.list-group .list-group-item.img {
    margin-bottom: var(--sz-8);
}
.list-group .list-group-item.position-fixed {
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10;
    padding: var(--sz-20);
    background-color: var(--white);
    border-top: 1px solid var(--gray-10);
}
.list-group .list-group-item.position-fixed .form-select {
    margin-top: calc(var(--sz-10) * -1);
}
/* List-Group : End */


/* List-Group-Flush : Start */
.list-group-flush .list-group-item {
    border-bottom: 1px solid var(--gray-20);
}
.list-group-flush .list-group-item:not([class*="tit"]):first-child {
    border-top: 1px solid var(--gray-20);
}
.list-group-flush > .list-group-item:last-child {
    border-bottom-width: 1px;
}
.list-group-flush.bc-gray-10 .list-group-item {
    border-color: var(--gray-10);
}
/* List-Group-Flush : End */


/* List-Group-Table : Start */
.list-group-table .list-group-item {
    display: flex;
    flex-direction: column;
}


.list-group-table.large .list-group-item {
    padding: var(--sz-16) 0;
}
.list-group-table.large .list-group-item:first-child {
    padding-top: 0;
}
.list-group-table.large .list-group-item.tit {
    margin-bottom: 0;
}
/* List-Group-Table : End */


/* List-Group-Dot : Start */
.list-group-table .list-group-dot .list-group-item,
.list-group-dot .list-group-item {
    position: relative;
    padding: var(--sz-8) var(--sz-14);
}
.list-group-dot .list-group-item::before {
    content: '';
    position: absolute;
    top: var(--sz-16);
    left: 0;
    width: 6px;
    height: 6px;
    background-color: var(--gray-10);
    border-radius: 50%;
}
.list-group-table .list-group-dot .list-group-item.tit,
.list-group-dot .list-group-item.tit {
    padding-left: 0;
    padding-bottom: var(--sz-4);
    margin-bottom: 0;
}
.list-group-dot .list-group-item.tit::before {
    display: none;
}
.list-group-dot.large .list-group-item.tit {
    padding-bottom: var(--sz-12);
    margin-bottom: var(--sz-4);
}
.list-group-dot.large .divider {
    margin: var(--sz-12) 0;
}
ul[class*="bg-"].list-group-dot .list-group-item {
    padding-left: var(--sz-10);
    padding-right: var(--sz-10);
}
ul[class*="bg-"].list-group-dot .list-group-item.tit {
    padding-top: var(--sz-4);
}
ul[class*="bg-"].list-group-dot .list-group-item::before {
    top: 1.125rem;
    width: 3px;
    height: 3px;
    background-color: var(--gray-100);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .list-group-dot .list-group-item::before {
        top: var(--sz-16);
    }
    .list-group-dot.large .list-group-item.tit {
        padding-bottom: var(--sz-16);
        margin-bottom: var(--sz-16);
    }
}
/* List-Group-Dot : End */


/* List-Group-Filter : Start */
.list-group-filter .list-group-item {
    padding: var(--sz-16) 0 var(--sz-24) !important;
}
.list-group-filter .row.gap {
    row-gap: var(--sz-12) !important;
}
.list-group-filter .form-group {
    row-gap: var(--sz-16);
}
.list-group-filter + .box .tag {
    display: flex;
    /* flex-wrap: wrap; */
    max-width: none;
    /* text-overflow: inherit; */
    /* vertical-align: middle; */
    white-space: normal;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .list-group-filter .list-group-item {
        padding: var(--sz-16) 0 var(--sz-16) !important;
    }
    .list-group-filter .form-group {
        column-gap: var(--sz-16);
    }
}
/* List-Group-Filter : End */



ul[class*="bg-"].list-group {
    padding: var(--sz-16) var(--sz-20);
    border-radius: 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    ul[class*="bg-"].list-group {
        padding: var(--sz-20) var(--sz-40);
    }
    ul[class*="bg-"].list-group [class*="fs-16"] {
        line-height: 1.4;
    }
    ul[class*="bg-"].list-group [class*="fs-14"] {
        line-height: 1.6;
    }
}


.list-group-dot .list-group-item.tit,
.list-group-flush .list-group-item.tit,
.list-group-table .list-group-item.tit {
    border-bottom: 1px solid var(--gray-100);
}
/********** List-Group (Layout) : End **********/




/********** Profile-Menu (Layout) : Start **********/
.profile-menu .btn-ico {
    position: absolute;
    right: 0;
    bottom: 0;
}
.profile-menu .ico-setting {
    background-image: url(/openads3/images/ico-setting-28px.svg);
}
.profile-menu .nav {
    padding-bottom: var(--sz-16);
    border-bottom: 1px solid var(--gray-100);
    margin-bottom: 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .profile-menu .nav {
        border-bottom: none;
    }
}
/********** Profile-Menu (Layout) : End **********/




/********** Main (Page) : Start **********/
.main .section-01 {
    padding-top: var(--sz-114);
}
.main .section-01 .inner {
    /* padding-left: var(--sz-16); */
    /* padding-right: var(--sz-16); */
    padding-left: 0;
    padding-right: 0;
}
.main .section-01 .inner .col-12 {
    padding-left: 0;
    padding-right: 0;
}

.main .section-01 .round {
    display: inline-block;
    width: auto;
    padding: var(--sz-8) var(--sz-16);
    border: 1px solid var(--gray-20);
    border-radius: var(--sz-40);
}

/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .main .section-01 {
        padding-top: var(--sz-80);
    }

    .main .section-01 .inner {
        padding-left: var(--sz-16);
        padding-right: var(--sz-16);
    }
    .main .section-01 .inner .col-12 {
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
    }
}



.main .section-02 {
    padding-top: var(--sz-40);
}



.main .section-05 {
    padding-bottom: var(--sz-80);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .main .section-05 .nav {
        margin-top: var(--sz-24);
    }
    .main .section-05.card-list .box-body .tab-pane .row.gap {
        gap: 0 var(--sz-64);
    }
    .main .section-05.card-list .box-body .tab-pane .row.gap > div[class*="col-"] {
        flex-basis: calc(50% - var(--sz-32));
    }
}



.main .section-06 {
    padding: var(--sz-48) 0 var(--sz-60);
}
.main .section-06 .box-header {
    padding-bottom: 0;
}
.main .section-06 .nav {
    margin-top: 0;
}


.bg-gray-100 .nav .nav-item .nav-link {
    display: flex;
    align-items: center;
    gap: var(--sz-8);
    height: 2.13rem;
    text-decoration: none;
}
.bg-gray-100 .nav .nav-item .nav-link.active {
    border-bottom: var(--sz-2) solid var(--white);
    color: var(--white) !important;
    text-decoration: none;
    text-shadow: -0.5px 0 rgba(255, 255, 255, 0.7), 0.5px 0 rgba(255, 255, 255, 0.7), 0 -0.5px rgba(255, 255, 255, 0.7), 0 0.5px rgba(255, 255, 255, 0.7);
}
.bg-gray-100 .nav .nav-item .nav-link .ico {
    display: none;
}
.bg-gray-100 .nav .nav-item .nav-link.active .ico-caret-right {
    display: inline-block;
    background-image: url(/openads3/images/ico-caret-right-white-default-20px.svg);
}


.main .section-06 .card {
    padding-top: var(--sz-32);
}
.main .section-06 .tag {
    padding: 0.31rem var(--sz-8);
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.main .section-06 .ico-chevron-right {
    background-image: url(/openads3/images/ico-chevron-right-white-default-20px.svg);
}
.main .section-06 .dot {
    background-color: var(--gray-20);
}
.main .section-06 .list-group .list-group-item {
    padding: var(--sz-12) 0;
}
.main .section-06 .list-group-flush .list-group-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.main .section-06 .list-group-flush .list-group-item:not([class*="tit"]):first-child {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .main .section-06 {
        padding: var(--sz-80) 0 var(--sz-100);
    }
    .main .section-06 .box-header {
        padding-bottom: var(--sz-24);
    }
    .main .section-06 .card {
        padding-top: 0;
    }
    .main .section-06 .list-group .list-group-item {
        padding: var(--sz-13) 0;
    }
}
/********** Main (Page) : End **********/




/********** Newest (Page) : Start **********/
.newest .bg-orange-5 {
    background-image: url(/openads3/images/bg-circle-orange.svg);
    background-repeat: no-repeat;
    background-position: center 90%;
    background-size: 22.75rem;
}
.newest .section-01 {
    min-height: 38.13rem;
    padding: 10.13rem 0 var(--sz-60);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .newest .bg-orange-5 {
        background-position: center 30%;
        background-size: 46rem;
    }
    .newest .section-01 {
        max-height: 66.88rem;
        padding: 10rem 0 0 !important;
    }
    .newest .section-01 .box-body {
        margin-top: -8.5rem;
    }
}



.newest .section-02  {
    padding-top: var(--sz-60);
}
.newest .section-02 .box-body {
    row-gap: var(--sz-32);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .newest .section-02  {
        padding-top: var(--sz-160);
    }
}
/********** Newest (Page) : End **********/





/********** Popular (Page) : Start **********/
.popular .form-select {
    min-width: 6.81rem;
}


.popular .section-01 {
    padding-top: calc(var(--sz-114) + var(--sz-40));
    padding-bottom: var(--sz-40);
    background-image: url(/openads3/images/bg-circle-orange.svg);
    background-repeat: no-repeat;
    background-position: center 9.13rem;
    background-size: 22.56rem;
}
.popular .section-01 .use-bootstrap-select > .dropdown-menu {
    min-width: 6.81rem;
}
.popular .section-01 .card {
    width: calc(100% - var(--sz-72));
    margin-left: 4.63rem;
}
.popular .section-01 .card .row {
    row-gap: var(--sz-16);
}
.popular .section-01 .card.flex-1 {
    padding-top: var(--sz-40);
    padding-bottom: var(--sz-8);
    border-bottom: 0 !important;
}
.popular .section-01 .card > .row > * > .card-body {
    justify-content: flex-start;
}
.popular .section-01 .card .rank {
    position: absolute;
    left: calc(4.63rem * -1);
}
.popular .section-01 .card .rank.sz-40 {
    margin-left: 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .popular .section-01 {
        padding-top: 10.13rem !important;
        padding-top: calc(var(--sz-80) + var(--sz--80));
        padding-bottom: var(--sz-48);
        background-position: center 7.63rem;
        background-size: 46rem;
    }
    .popular .section-01 .nav {
        margin-top: var(--sz-24);
    }
    .popular .section-01 .nav .nav-item .nav-link {
        display: flex;
        align-items: center;
        gap: var(--sz-8);
        height: 2.44rem;
        text-decoration: none;
        border-bottom: 2px solid transparent;
    }
    .popular .section-01 .nav .nav-item .nav-link.active {
        border-bottom: 2px solid var(--gray-100);
        text-decoration: none;
        text-shadow: -0.5px 0.5px 1px var(--gray-100);
    }
    .popular .section-01 .nav .nav-item .nav-link .ico-caret-right {
        display: none;
    }
    .popular .section-01 .nav .nav-item .nav-link.active .ico-caret-right {
        display: inline-block;
    }
    .popular .section-01 .card {
        flex-basis: calc(33% - var(--sz-16));
        margin-left: 0;
    }
    .popular .section-01 .card .row {
        row-gap: var(--sz-24);
    }
    .popular .section-01 .card.flex-1 {
        padding-top: 0;
        padding-bottom: var(--sz-40);
        border-bottom: 1px solid var(--gray-20) !important;
    }
    .popular .section-01 .card.flex-1 .row {
        row-gap: 0;
        column-gap: var(--sz-8);
    }
    .popular .section-01 .card.flex-1 > .row > * > .card-body .align-items-center {
        margin-top: var(--sz-48);
    }
    .popular .section-01 .card .rank {
        position: static;
        left: 0;
        margin-left: 0;
    }
}



.popular .section-02 .nav {
    margin-bottom: var(--sz-24);
}
.popular .section-02 .nav .nav-item .nav-link {
    text-decoration: none;
}
.popular .section-02 .nav .nav-item .nav-link.active {
    border-bottom: var(--sz-2) solid var(--gray-100);
    text-decoration: none;
}
.popular .section-02 .nav .nav-item .nav-link .ico {
    display: none;
}
.popular .section-02 .nav .nav-item .nav-link.active .ico-caret-right {
    display: inline-block;
    background-image: url(/openads3/images/ico-caret-right-default-20px.svg);
}
.popular .section-02 .tab-pane .row.gap {
    row-gap: var(--sz-8);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .popular .section-02 .col-xl-9 {
        margin-top: calc(var(--sz-56) * -1);
    }
    .popular .section-02 .nav {
        margin-top: var(--sz-8);
    }
    .popular .section-02 .nav .nav-item .nav-link {
        height: var(--sz-48);
        padding: var(--sz-10) var(--sz-16);
        border: 1px solid var(--gray-20);
        line-height: 1;
    }
    .popular .section-02 .nav .nav-item .nav-link.active {
        border: 1px solid var(--gray-100);
        background-color: var(--gray-100);
        color: var(--white) !important;
    }
    .popular .section-02 .tab-pane .row.gap {
        row-gap: var(--sz-32);
    }
}



.popular .section-03 .row.box-body.gap {
    row-gap: var(--sz-32);
}



/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .popular .section-05 .row.gap {
        gap: 0 var(--sz-48);
    }
    .popular .section-05 .row.gap > div[class*="col-"] {
        flex-basis: calc(50% - var(--sz-32));
    }
}



.popular .section-06 .row.box-body.gap {
    row-gap: var(--sz-32);
}



.popular .section-07 .flex-xl-column-reverse > .box > .d-flex {
    width: 50%;
}
.popular .section-07 .list-group .list-group-item {
    padding: 0.81rem 0 var(--sz-12);
}

/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .popular .section-07 .flex-xl-column-reverse > .box > .d-flex {
        width: auto;
    }
    .popular .section-07 .form-select + .use-bootstrap-select-wrapper {
        width: auto !important;
        min-width: 11.25rem;
    }
}
/********** Popular (Page) : End **********/




/********** Cont-Category (Page) : Start **********/
.cont-category .section-01 .box-header::before {
    display: none;
}
.cont-category .section-01 .box-body .row.gap {
    row-gap: var(--sz-32);
}
.cont-category .img-banner {
    margin-left: calc(var(--sz-20) * -1);
    margin-right: calc(var(--sz-20) * -1);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .cont-category .section-01 .box-header::before {
        display: block;
    }
    .cont-category .section-01 .box-body .row.gap {
        row-gap: var(--sz-52);
    }
    .cont-category .img-banner {
        margin-left: 0;
        margin-right: 0;
    }
}
/********** Cont-Category (Page) : End **********/




/********** Event (Page) : Start **********/
.event .section-01 .box-header::before {
    display: none;
}
.event .section-01 .box-body .row.gap {
    row-gap: var(--sz-32);
}
.event .img-banner {
    margin-left: calc(var(--sz-20) * -1);
    margin-right: calc(var(--sz-20) * -1);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .event .section-01 .box-header::before {
        display: block;
    }
    .event .section-01 .box-body .row.gap {
        row-gap: var(--sz-52);
    }
    .event .img-banner {
        margin-left: 0;
        margin-right: 0;
    }
}
/********** Event (Page) : End **********/




/********** Insighter-List (Page) : Start **********/
.insighter-list .section-01 .box-header::before {
    display: none;
}
.insighter-list .section-01 .box-body .row.gap {
    row-gap: var(--sz-48);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .insighter-list .section-01 .box-header::before {
        display: block;
    }
}
/********** Insighter-List (Page) : End **********/




/********** Insighter (Page) : Start **********/
.insighter ul[class*="bg-"].list-group {
    padding: var(--sz-8) var(--sz-16) !important;
    border-width: 1px;
    border-style: solid;
}
.insighter .list-group.flex-row .list-group-item {
    padding: 0;
}
.insighter .card-list .row.gap {
    row-gap: var(--sz-32);
}


.insighter .section-01 .card-list:nth-child(2) .box-header::before {
    display: none;
}

/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .insighter .card-list .row.gap {
        row-gap: var(--sz-52);
    }


    .insighter .section-01 .card-list:nth-child(2) .box-header::before {
        display: block;
    }
}
/********** Insighter (Page) : End **********/




/********** Product (Page) : Start **********/
.product .section-01 {
    padding-top: calc(var(--sz-114) + var(--sz-48));
    padding-bottom: var(--sz-48);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .product .section-01 {
        padding-top: calc(var(--sz-80) + var(--sz-80));
        padding-bottom: 5.75rem;
    }
}



.product .section-02 .row.gap {
    row-gap: var(--sz-32);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .product .section-02 .box-header {
        padding-bottom: var(--sz-24);
    }

    .product .section-02 .box-body .nav {
        padding-bottom: var(--sz-20);
        border-bottom: 1px solid var(--gray-100);
    }

    .product .section-02 .row.gap {
        row-gap: 3.25rem;
    }
}



.product .section-04 .box-header::before {
    display: none;
}
.product .section-04 .box-header .group:first-child {
    position: relative;
    padding-bottom: var(--sz-16);
}
.product .section-04 .box-header .group:first-child::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: var(--gray-100);
}
.product .section-04 .row.gap {
    row-gap: var(--sz-32);
}
.product .section-04 .dropdown-menu {
    min-width: 240px !important;
}
.product .section-04 .dropdown-menu .dropdown-item {
    display: block;
    overflow: hidden;
    width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .product .section-04 .box-header::before {
        display: block;
    }
    .product .section-04 .box-header .group:first-child {
        padding-bottom: 0;
    }
    .product .section-04 .box-header .group:first-child::before {
        display: none;
    }
    .product .section-04 .form-select {
        border-bottom: none;
    }
    .product .section-04 .use-bootstrap-select > .dropdown-menu {
        left: auto;
        right: 0;
        min-width: auto;
    }
}
/********** Product (Page) : End **********/




/********** Promotion (Page) : Start **********/
.promotion .section-01 .position-relative {
    display: block;
}
.promotion .section-01 .position-absolute {
    top: calc(var(--sz-16) * -1);
    right: calc(var(--sz-16) * -1);
    transform: rotate(-30deg);
    opacity: 0.95;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .promotion .section-01 .position-absolute {
        top: calc(var(--sz-24) * -1);
        right: calc(var(--sz-24) * -1);
    }
}



.promotion .section-02 .box.border-bottom {
    padding-bottom: var(--sz-20);
}
.promotion .section-02 .row.gap {
    row-gap: var(--sz-32);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .promotion .section-02 .box-header {
        padding-bottom: var(--sz-24);
    }
    .promotion .section-02 .row.gap {
        row-gap: 3.25rem;
    }
}
/********** Promotion (Page) : End **********/





/********** Search-Result (Page) : Start **********/
.search-result .section-02 .box-header {
    padding-bottom: 0;
}
.search-result .section-02 .box-header::before {
    display: none;
}
.search-result .section-02 .row.gap,
.search-result .section-04 .row.gap {
    row-gap: var(--sz-32);
}
.search-result .section-02 #comp-tab-01-panel-06 .row.gap {
    row-gap: 1.19rem;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .search-result .section-02 .box-header {
        padding-bottom: var(--sz-16);
    }
    .search-result .section-02 .box-header::before {
        display: block;
    }
    .search-result .section-02 .row.gap {
        row-gap: 3.25rem;
    }
    .search-result .tab-content > .tab-pane {
        padding-top: 0;
    }
    .search-result .section-02 #comp-tab-01-panel-06 .row.gap {
        row-gap: var(--sz-52);
    }
}
/********** Search-Result (Page) : End **********/





/********** Service-Intro (Page) : Start **********/
.service-intro .section-01 {
    padding-bottom: var(--sz-80);
}
.service-intro .section-01 .logo {
    display: block;
    width: 21.44rem;
    height: 8.88rem;
    background: url(/openads3/images/img-logo-service-intro.png) no-repeat 0 / auto 100%;
    text-indent: -9999px;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .service-intro .section {
        padding-top: var(--sz-200);
    }

    .service-intro .section-01 {
        padding-top: calc(var(--sz-80) + 3.38rem);
        padding-bottom: var(--sz-120);
    }
    .service-intro .section-01 .logo {
        width: 35.94rem;
        height: 18.06rem;
    }

    .service-intro .section-01 [class*="offset-"] {
        margin-top: calc(var(--sz-40) * -1);
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .service-intro .section-01 .logo {
        margin-left: calc(var(--sz-100) * -1);
    }
}



.service-intro .section-02 {
    padding-top: var(--sz-60);
}
.service-intro .section-02 .box {
    padding: var(--sz-12) 0;
    border-width: 2px !important;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .service-intro .section-02 {
        padding-top: var(--sz-140);
    }
    .service-intro .section-02 .box {
        padding: var(--sz-4) 0;
    }
}



.service-intro .section-03 .group {
    padding: 1.88rem;
}
.service-intro .section-03 .box {
    word-break: keep-all;
}
.service-intro .section-03 .box .ico {
    width: var(--sz-40);
    height: 2.94rem;
}
.service-intro .section-03 .row.mx-0 > [class*="col"]:first-child,
.service-intro .section-03 .row.mx-0 > [class*="col"]:nth-child(2) {
    border-bottom: 1px solid var(--gray-100);
}
.service-intro .section-03 .row.mx-0 > [class*="col"]:first-child,
.service-intro .section-03 .row.mx-0 > [class*="col"]:nth-child(3) {
    border-right: 1px solid var(--gray-100);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .service-intro .section-03 .group {
        padding: 0;
        margin: 0 var(--sz-48);
    }
    .service-intro .section-03 .box .ico {
        width: var(--sz-56);
        height: 4.13rem;
    }
    .service-intro .section-03 .box-body .row.mx-0 [class*="col-"] {
        border-right: 1px solid var(--gray-100);
        border-bottom: none;
    }
    .service-intro .section-03 .box-body .row.mx-0 [class*="col-"]:last-child {
        border-right: none !important;
    }
}



.service-intro .section-04 .row.border-bottom {
    row-gap: var(--sz-4);
    padding-bottom: var(--sz-20);
    border-width: 2px !important;
}
.service-intro .section-04 .box-body [class*="col"].d-flex {
    padding-left: 1.88rem;
}
.service-intro .section-04 .box-body .dot {
    position: absolute;
    left: calc(var(--sz-20) * -1);
    margin-top: 0;
}
.service-intro .section-04 .list-group .list-group-item.tit {
    padding-top: var(--sz-8);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .service-intro .section-04 .row.border-bottom {
        margin-left: 0;
        margin-right: 0;
    }
    .service-intro .section-04 .box-body .col-xl-3 + .col-xl-9 {
        padding-left: 0;
    }
    .service-intro .section-04 .box-body [class*="col"].d-flex {
        padding-left: calc(var(--bs-gutter-x) * 0.5);
    }
    .service-intro .section-04 .box-body .dot {
        position: static;
    }
}
/********** Service-Intro (Page) : End **********/




/********** Notice (Page) : Start **********/
.notice .input-group .form-control {
    height: var(--sz-48);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .notice .input-group .form-control {
        height: var(--sz-56);
    }
    .notice .input-group .box-right {
        margin-top: 0;
    }
}
/********** Notice (Page) : End **********/





/********** Notice-Detail (Page) : Start **********/
.notice-detail .box.border-bottom {
    padding: var(--sz-16) 0;
}
.notice-detail .group:nth-child(2) {
    padding: 0 0 var(--sz-24);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .notice-detail .group:nth-child(2) {
        padding: 0 0 var(--sz-48);
    }
}
/********** Notice-Detail (Page) : End **********/





/********** Support (Page) : Start **********/

/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .support .section {
        padding-top: var(--sz-200);
    }
}


.support .section-01.bg-orange-5 {
    padding-bottom: var(--sz-100);
}
.support .section-01.bg-orange-5 .row.gap {
    row-gap: var(--sz-20);
}
.support .section-01.bg-orange-5 .order-xl-first img {
    width: 15rem;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .support .section-01.bg-orange-5 {
        padding-top: calc(var(--sz-80) + var(--sz-48));
    }
    .support .section-01.bg-orange-5 .row.gap {
        row-gap: var(--sz-40);
    }
    .support .section-01.bg-orange-5 .order-xl-first img {
        width: 17.5rem;
    }
}



.support .section-02 {
    padding-top: var(--sz-160);
}
.support .section-02 .row.mx-xl-0 [class*="col-"] {
    position: relative;
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(1),
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(2) {
    padding-bottom: var(--sz-48);
    border-bottom: 1px solid var(--orange-100);
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(1),
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(3) {
    border-right: 1px solid var(--orange-100);
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(3),
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(4) {
    padding-top: var(--sz-48);
}
.support .section-02 .row.mx-xl-0 [class*="col-"] .rounded-circle {
    position: absolute;
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(1) .rounded-circle {
    right: 1rem;
    bottom: 1rem;
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(2) .rounded-circle {
    left: 1rem;
    bottom: 1rem;
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(3) .rounded-circle {
    top: 1rem;
    right: 1rem;
}
.support .section-02 .row.mx-xl-0 [class*="col-"]:nth-child(4) .rounded-circle {
    top: 1rem;
    left: 1rem;
}
.support .section-02 .list-group {
    padding: var(--sz-20) var(--sz-40);
    margin-top: var(--sz-28);
    background-color: rgba(232, 232, 232, 0.4);
    border-radius: 0;
}




.support .section-03 .row.gap {
    row-gap: var(--sz-48);
}
.support .section-03 [class*="col-xl-9"] .box {
    padding-left: var(--sz-16);
    padding-right: var(--sz-16);
}


.support .section-05 .row.gap {
    row-gap: var(--sz-32);
}
.support .section-05 .box-body [class*="col-xl-3"] {
    position: relative;
    padding-bottom: 12.63rem;
}
.support .section-05 .ico-arrow {
    position: absolute;
    top: 7rem;
    right: -4.25rem;
    width: 7.56rem;
    height: var(--sz-56);
    background-image: url(/openads3/images/ico-arrow-right-orange-121px.svg);
}
.support .section-05 .group ~ .group.flex-xl-column {
    position: absolute;
    top: 14rem;
    left: 50%;
    right: -50%;
}
.support .section-05 .vr {
    height: var(--sz-80);
    opacity: 1;
}


.support .section-07 .bg-orange-100 {
    width: calc(100% - var(--sz-32));
    margin-left: var(--sz-16);
    margin-right: var(--sz-16);
}
.support .section-07 .bg-orange-100 .box-body {
    padding: var(--sz-40);
}
.support .section-07 .bg-orange-100 .btn-outline-secondary {
    border: 1px solid var(--white);
    color: var(--white);
}


/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .support .section-07 .bg-orange-100 {
        width: 100%;
        margin-left: auto;
    }
}

/* 1600px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1600px) {
    .support .section-07 .bg-orange-100 {
        margin-right: auto;
    }
}




.support .section-01 .box-header.gap {
    row-gap: var(--sz-20);
}
.support .section-01 .box-header img {
    width: 15rem;
    height: 11.5rem;
}
.support .section-01 .list-group-dot .list-group-item {
    padding-top: var(--sz-4);
    padding-left: var(--sz-16);
    padding-bottom: var(--sz-4);
}
.support .section-01 .list-group-dot .list-group-item.tit {
    padding-left: 0;
}
.support .section-01 .list-group-dot .list-group-item::before {
    top: 1rem;
    width: 6px;
    height: 6px;
    background-color: var(--gray-10);
}


.support .form-group {
    padding-top: var(--sz-8);
    padding-bottom: var(--sz-8);
    row-gap: var(--sz-16);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .support .section-01 {
        padding-top: calc(var(--sz-80) + var(--sz-80));
    }
    .support .section-01 .box-header.gap .col-xl-4 {
        position: absolute;
        top: calc(var(--sz-20) * -1);
        right: 0;
    }
    .support .section-01 .box-header img {
        width: 24rem;
        height: 18.31rem;
    }
    .support .section-01 .list-group-dot {
        display: inline-flex;
        padding: var(--sz-24);
    }
}
/********** Support (Page) : End **********/





/********** Terms (Page) : Start **********/
.terms {
    font-size: var(--sz-14);
    line-height: 1.6;
    color: var(--gray-100);
}
.terms-lst > li {
    padding: 0 0 var(--sz-48) 0;
}
.terms-lst h3 {
    margin: 0 0 var(--sz-12) 0;
    font-weight: bold;
    font-size: var(--sz-16);
}
.terms-lst p {
    margin: var(--sz-8) 0;
}
.terms .divider {
    padding: 0;
    margin-top: 0;
}
.terms-depth > li {
    position: relative;
    padding: var(--sz-4) 0;
    margin-left: var(--sz-20);
}
.terms-depth > li > span {
    position: absolute;
    top: var(--sz-4);
    left: calc(var(--sz-20) * -1);
    bottom: 0;
    width: var(--sz-8);
    height: 100%;
    margin-right: var(--sz-8);
}
.terms-depth > li > span.dot {
    top: 1px;
    left: calc(var(--sz-12) * -1);
    width: 3px;
    height: 3px;
    border-radius: 50%;
}
.terms-depth > li > p {
    margin-left: calc(var(--sz-20) * -1);
}
.terms table {
    width: 100%;
    margin-top: var(--sz-10);
    margin-bottom: var(--sz-10);
    border: 1px solid var(--gray-20);
    border-bottom: none;
    word-break: keep-all;
}
.terms table th,
.terms table td {
    padding: var(--sz-12) var(--sz-16);
    border-right: 1px solid var(--gray-20);
    border-bottom: 1px solid var(--gray-20);
}
.terms table th {
    text-align: center;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .terms {
        font-size: var(--sz-16);
    }
    .terms-lst h3 {
        font-size: var(--sz-20);
    }
}
/********** Terms (Page) : End **********/





/********** Cont-Detail (Page) : Start **********/
.cont-detail .box-body .card-help .card {
    border-color: var(--gray-20) !important;
}
.cont-detail .box-body .card-help .card-header {
    padding: var(--sz-24) var(--sz-20);
}
.cont-detail .box-body .card-help .card-header .fs-13.text-truncate {
    -webkit-line-clamp: 2;
}


.cont-detail .box-body .card-help .card-body {
    flex: 0 1 auto;
}
.cont-detail .box-body .card-help .card-body .btn {
    height: inherit;
    border: 1px solid transparent;
    border-top: 1px solid var(--gray-20);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .cont-detail .box-body .card-help .card-body {
        padding-right: var(--sz-32);
    }
    .cont-detail .box-body .card-help .card-body .btn {
        border: 1px solid var(--gray-50);
    }
}



.cont-detail .section-01 {
    padding-top: calc(var(--sz-114) + var(--sz-32));
}
.cont-detail .section-01 .box-header::before {
    left: -0.625rem;
    right: -0.625rem;
}
.cont-detail .section-01 .box-header .col {
    padding-bottom: var(--sz-16);
}
.cont-detail .section-01 .box-header .dot.bg-gray-20 {
    width: var(--sz-4);
    height: var(--sz-4);
}
/* .cont-detail .section-01 .box-header .ico-logo-classting {
    width: 7.5rem;
    height: var(--sz-20);
    background-image: url(/openads3/images/logo-classting.svg);
} */
.cont-detail .section-01 .box-header .img-logo {
    width: 7.5rem;
}
.cont-detail .section-01 .box-body .col-xl-9 {
    padding-top: var(--sz-40);
}
.cont-detail .section-01 .box-body .col-xl-3 {
    padding-top: var(--sz-80);
}
.cont-detail .section-01 .box-body .card-help {
    padding-bottom: var(--sz-32);
    border-bottom: 1px solid var(--gray-100);
}
.cont-detail .section-01 .box-body .card-help .btn {
    width: 8.125rem;
    height: var(--sz-40);
}
.cont-detail .section-01 .box-body .card-help .btn.active {
    color: var(--white);
    background-color: var(--orange-100);
    border-color: var(--orange-100);
}
.cont-detail .section-01 .box-body .comment .comment-list .col-xl-2 .d-flex,
.cont-detail .section-01 .box-body .comment .my-comment {
    justify-content: flex-end;
}
.cont-detail .section-01 .box-body .comment {
    padding-top: var(--sz-40);
}
.cont-detail .section-01 .box-body .comment .input-group .btn {
    width: 5.75rem;
}
.cont-detail .section-01 .box-body .comment .comment-list .d-flex.pe-xl-0 .order-xl-2 {
    padding-left: var(--sz-60);
}
.cont-detail .section-01 .box-body .comment .comment-list .d-flex.justify-content-end .btn {
    --bs-btn-padding-x: var(--sz-8);
    border: 1px solid var(--gray-20);
    font-size: var(--sz-12);
    color: var(--gray-70);
}
.cont-detail .section-01 .box-body .comment .comment-list .reply > .d-flex,
.cont-detail .section-01 .box-body .comment .comment-list > .d-flex {
    padding: var(--sz-24) 0;
    border-top: 1px solid var(--gray-20);
}
.cont-detail .section-01 .box-body .comment .comment-list .reply {
    padding-top: var(--sz-24);
}
.cont-detail .section-01 .box-body .comment .comment-list .reply > .d-flex {
    position: relative;
    padding-left: var(--sz-28);
}
.cont-detail .section-01 .box-body .comment .comment-list .reply > .d-flex:first-of-type {
    padding-top: 0;
    border-top: none;
}
.cont-detail .section-01 .box-body .comment .comment-list .reply > .d-flex::before {
    content: '- re';
    position: absolute;
    top: var(--sz-24);
    left: 0;
    font-weight: 500;
    font-size: var(--sz-12);
    color: var(--gray-100);
}
.cont-detail .section-01 .box-body .comment .comment-list .reply > .d-flex:first-child:before {
    top: 0;
}
.cont-detail .section-01 .box-body .comment .comment-list .reply > .d-flex.px-0:before {
    display: none;
}
.cont-detail .section-01 .box-body .comment .comment-list .tag {
    padding: var(--sz-4) var(--sz-6);
    background-color: var(--gray-10);
}
.cont-detail .section-01 .box-body .comment .comment-list .icon-link {
    justify-content: center;
    padding: var(--sz-13) 0;
    border-top: 1px solid var(--gray-20);
    border-bottom: 1px solid var(--gray-20);
}
.cont-detail .section-01 .box-body .row.gap {
    row-gap: var(--sz-32);
}

/* Dropdown : Start */
.cont-detail .comment .dropdown .dropdown-toggle.show .ico-more-dot {
    background-image: url(/openads3/images/ico-more-dot-active-32px.svg);
}
.cont-detail .comment .dropdown .dropdown-item {
    font-size: var(--sz-14);
}
/* Dropdown : End */


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .cont-detail .section-01 {
        padding-top: calc(var(--sz-80) + var(--sz-64));
    }
    .cont-detail .section-01 .box-header::before {
        left: var(--sz-16);
        right: var(--sz-16);
    }
    .cont-detail .section-01 .box-header .dot.bg-gray-20 {
        width: var(--sz-6);
        height: var(--sz-6);
    }


    .cont-detail .section-01 .box-body .col-xl-9 {
        flex: 0 0 70.83%;
        max-width: 70.83%;
        padding-top: var(--sz-64);
        padding-right: var(--sz-72);
        border-right: 1px solid var(--gray-20);
    }
    .cont-detail .section-01 .box-body .col-xl-3 {
        flex: 0 0 29.17%;
        max-width: 29.17%;
        padding-top: var(--sz-56);
        padding-left: var(--sz-48);
        padding-right: var(--sz-32);
    }


    .cont-detail .section-01 .box-body .card-help {
        padding-bottom: var(--sz-48);
    }
    .cont-detail .section-01 .box-body .card-help .btn {
        width: 10rem;
    }


    .cont-detail .section-01 .box-body .comment {
        position: relative;
        padding-top: 2.25rem;
    }
    .cont-detail .section-01 .box-body .comment .my-comment {
        position: absolute;
        top: 2.38rem;
        right: 0;
    }
    .cont-detail .section-01 .box-body .comment .input-group .btn {
        width: 8.25rem;
    }
    .cont-detail .section-01 .box-body .comment .comment-list .d-flex.pe-xl-0 .order-xl-2 {
        padding-right: 9rem;
    }
    .cont-detail .section-01 .box-body .comment .comment-list .d-flex.justify-content-end .btn {
        width: var(--sz-76);
        --bs-btn-padding-x: var(--sz-10);
    }

    .cont-detail .section-01 .box-body .comment .comment-list .reply {
        padding-left: var(--sz-60);
    }
    .cont-detail .section-01 .box-body .comment .comment-list .reply .d-flex.pe-xl-0 .order-xl-2 {
        padding-right: var(--sz-64);
    }

    .cont-detail .section-01 .box-body .row.gap {
        row-gap: var(--sz-60);
    }
    .cont-detail .section-01 .box-body .form-select {
        border-bottom: 1px solid var(--gray-100);
        font-size: var(--sz-20);
    }
}



.cont-detail .section-02 .row.gap,
.cont-detail .section-03 .row.gap {
    row-gap: var(--sz-32);
}


.map {
    width: 100%;
    height: 268px;
}

iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
}


/* <pre-line> html 존재하지 않는 태그 */
/* 기존 오픈애즈 콘텐츠 상세 참고 하여 <pre-line> 태그 삽입 */
pre-line {
    overflow: hidden;
    width: 100%;
    white-space: pre-line;
}

/********** Cont-Detail (Page) : End **********/





/********** Mypage (Page) : Start **********/
.mypage .section-01 .tab-pane .row.gap {
    row-gap: var(--sz-32);
}


.mypage .section-01 .box-header .form-select {
    min-width: 6.25rem;
}
.mypage .section-01 .box-header .use-bootstrap-select-wrapper {
    width: auto !important;
}
.mypage .section-01 .box-header .use-bootstrap-select > .dropdown-menu {
    min-width: auto;
}
.mypage .section-01 .box-header .form-select.w-100 + .use-bootstrap-select-wrapper {
    width: 100% !important;
}


.mypage .section-01 .tab-pane .list-group-table.large .dot {
    width: 3px;
    height: 3px;
    margin: 0;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .mypage .section-01 .tab-pane .row.gap {
        row-gap: 3.25rem;
    }
}
/********** Mypage(Page) : End **********/





/********** Join (Page) : Start **********/
/***** Join : Start *****/
.join .img-fluid {
    width: var(--sz-240);
}

.join .btn.h-48.h-xl-60 {
    border: 1px solid var(--gray-20);
}
.join .divider {
    margin: var(--sz-12) 0;
}


.join .step .badge-text {
    border-radius: 1.125rem;
}
.join .step .badge-text:not(.bg-orange-100) {
    border: 1px solid var(--gray-100);
}


.join .form-group {
    column-gap: var(--sz-24);
    row-gap: var(--sz-12);
}


.join .section-02 .row.gap {
    row-gap: var(--sz-48);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .join .img-fluid {
        width: var(--sz-360);
    }

    .join .divider {
        margin: var(--sz-16) 0;
    }
}
/***** Join : End *****/
/********** Join (Page) : End **********/





/********** Complete (Layout) : Start **********/
.complete.section:first-child {
    padding-top: var(--sz-114);
}
.complete .container-xxl,
.complete .row.box-body .col {
    padding-left: 0;
    padding-right: 0;
}
.complete .group {
    height: 27.5rem;
    padding: var(--sz-48) 0;
    background: url(/openads3/images/bg-complete02.svg) no-repeat right bottom / 70%, url(/openads3/images/bg-complete01.svg) no-repeat left top / 30%;
}
.complete .openads-logo-web {
    width: 12.5rem;
    height: 2.75rem;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .complete.section:first-child {
        padding-top: calc(var(--sz-80) + var(--sz-80));
    }
    .complete .container-xxl {
        padding-left: calc(var(--bs-gutter-x) * 0.5);
        padding-right: calc(var(--bs-gutter-x) * 0.5);
    }
    .complete .row.box-body .col {
        padding-left: calc(var(--bs-gutter-x) * 0.5);
        padding-right: calc(var(--bs-gutter-x) * 0.5);
    }
    .complete .group {
        height: auto;
        padding: 5.5rem 0;
        background: url(/openads3/images/bg-complete02-pc.svg) no-repeat right bottom 3.625rem / 20%, url(/openads3/images/bg-complete01-pc.svg) no-repeat left bottom / 70%;
    }
    .complete .openads-logo-web {
        width: 18rem;
        height: 4rem;
    }
}

/* 1400px 이상 -- 데스크탑 (xxl) */
@media (min-width: 1400px) {
    .complete .container-xxl {
        padding-left: 0;
        padding-right: 0;
    }
}
/********** Complete (Layout) : End **********/





/********** AI (Layout) : Start **********/
.ai .gap {
    row-gap: var(--sz-24);
}
.ai .form-select {
    min-width: 6.81rem;
}
.ai .use-bootstrap-select > .dropdown-menu {
    min-width: 6.81rem;
}
.ai .card .card-img {
    overflow: hidden;
}
.ai .card .rank {
    margin-bottom: var(--sz-8);
}



/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai .gap {
        row-gap: var(--sz-52);
    }
}
/********** AI (Layout) : End **********/




/********** AI-Tool (Page) : Start **********/
.ai-tool .section-01 {
    padding-top: calc(var(--sz-114) + var(--sz-48));
    padding-bottom: var(--sz-48);
}
.ai-tool .section-01 .nav button.nav-link .ico-caret-right {
    display: none;
}
.ai-tool .section-01 .nav button.nav-link.active {
    border-bottom: 2px solid var(--gray-100);
    text-decoration: none;
    text-shadow: -0.5px 0.5px 1px var(--gray-100);
}
.ai-tool .section-01 .nav button.nav-link.active .ico-caret-right {
    display: inline-block;
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai-tool .section-01 {
        padding-top: calc(var(--sz-80) + var(--sz-80));
        padding-bottom: var(--sz-80);
    }
}



.ai-tool .section-04 {
    padding-bottom: var(--sz-100);
}



.ai-tool .section-05.card-list .card.border-bottom {
    padding: var(--sz-40) 0;
    border-color: var(--gray-80) !important;
}
.ai-tool .section-05 .tab-pane .box.gap-xl-32 > .d-flex {
    padding-top: var(--sz-40);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai-tool .section-05 .swiper-slide:first-child > .d-flex {
        border-bottom: 1px solid var(--gray-80);
    }
    .ai-tool .section-05 .swiper-slide:first-child .rank {
        position: relative;
        top: 5.13rem;
    }
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay {
        flex-direction: row;
        gap: var(--sz-32);
        margin-bottom: var(--sz-40);
    }
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay .card-img,
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay .card-img-overlay {
        flex-basis: 50%;
    }
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay .card-img {
        order: 1;
        aspect-ratio: 4 / 2.56 !important;
    }
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay .card-img-overlay {
        position: static;
        padding: 0;
        background: none;
    }
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay .stretched-link.text-truncate {
        height: 4.5rem !important;
        -webkit-line-clamp: 2 !important;
        font-size: var(--sz-28);
        transition: none;
    }
    .ai-tool .section-05 .swiper-slide:first-child .card.overlay:hover .card-img-overlay {
        row-gap: var(--sz-40) !important;
    }
}
/********** AI-Tool (Page) : End **********/




/********** AI-Tool-Search (Page) : Start **********/


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai-tool-search .form-check.square {
        flex-basis: calc(100% / 8 - var(--sz-16));
    }
}



.ai-tool-search .section-01 .list-group-filter .list-group-item.border-top-0 {
    padding: var(--sz-32) 0 var(--sz-16) !important;
}



.ai-tool-search .section-02 {
    padding-top: var(--sz-32);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai-tool-search .section-02 {
        padding-top: var(--sz-80);
    }
    .ai-tool-search .section-02 .box-header.border-0::before {
        display: block;
    }
    .ai-tool-search .section-02 .row.box-body.gap {
        row-gap: 3.25rem;
    }
}
/********** AI-Tool-Search (Page) : End **********/




/********** AI-Prompt (Page) : Start **********/


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai-prompt .section-01 .box-header {
        padding-bottom: var(--sz-24);
    }

    .ai-prompt .section-01 .col-12 .flex-xl-row.gap-20 {
        padding-bottom: var(--sz-20);
        border-bottom: 1px solid var(--gray-100);
    }
}
/********** AI-Prompt (Page) : End **********/





/********** AI-Prompt-Register (Page) : Start **********/


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .ai-prompt-register .form-select.w-30 + .use-bootstrap-select-wrapper {
        width: calc(20% - var(--sz-20)) !important;
    }
}
/********** AI-Prompt-Register (Page) : End **********/





/********** CMS (Layout) : Start **********/
.cms .bg-orange-5 {
    padding: var(--sz-20);
    height: 12.125rem;
}
.product-cms .section-01 {
    padding-top: var(--sz-80);
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .product-cms .section-01 {
        padding-top: calc(var(--sz-80) + var(--sz-100));
    }
    .insighter-cms .section-01,
    .product-cms .section-01 {
        padding-bottom: var(--sz-200);
    }
    .product-cms .form-check.square {
        flex-basis: calc(100% / 4 - var(--sz-16));
    }
    .product-cms .file-upload-group + .form-group .form-check.square {
        flex-basis: calc(100% / 7 - var(--sz-16));
    }
}
/********** CMS (Layout) : End **********/




/********** Error (Page) : Start **********/
.error {

}
.error .logo {
    display: inline-block;
    width: var(--sz-200);
    height: var(--sz-114);
    margin-top: var(--sz-80);
    background: url(/openads3/images/img-logo-service-intro.png) no-repeat center / 100%;
}
/********** Error (Page) : End **********/

/* ------------------------- Content : End ------------------------- */





/* ------------------------- Footer : Start ------------------------- */
.footer {
    position: relative;
}
.footer .inner {
    padding-left: var(--sz-10);
    padding-right: var(--sz-10);
}
.footer .inner::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background-color: var(--gray-100);
}
.footer .inner:nth-child(2)::before {
    background-color: var(--gray-20);
}
.footer .footer-banner {
    display: flex;
    flex-direction: column;
    padding-top: var(--sz-40);
    padding-bottom: var(--sz-48);
    background: url(/openads3/images/footer-banner-bg-m@3x.png) no-repeat right var(--sz-24) / 7.06rem 6.13rem;
    gap: var(--sz-32);
}
.footer .footer-banner .ico-arrow {
    width: 1.56rem;
    height: var(--sz-10);
    background: url(/openads3/images/ico-arrow-right-default-25px-m.svg) no-repeat center / 100%;
}
.footer .footer-group {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    padding-top: var(--sz-40);
    padding-bottom: var(--sz-80);
}
.footer .footer-group .logo {
    display: block;
    margin-bottom: var(--sz-24);
    font-size: var(--sz-20);
    font-weight: bold;
    color: var(--gray-100);
    text-decoration: none;
}
.footer .footer-group .dot {
    margin: 0 var(--sz-8);
    background-color: var(--gray-100);
}
.footer .footer-group .dot:nth-of-type(4) {
    display: none;
}
.footer .footer-group .fs-14 {
    display: inline-block;
}
.footer .footer-group .company-info {
    margin-top: var(--sz-24);
    margin-bottom: var(--sz-40);
}
.footer .footer-group .fs-12 {
    display: inline-block;
    margin-right: var(--sz-8);
}
.footer .footer-menu {
    margin-bottom: var(--sz-16);
}
.footer .footer-sns {
    margin-bottom: var(--sz-40);
}


/* 576px 이상 -- 모바일 (sm) */
@media (min-width: 576px) {
    .footer .footer-group .dot:nth-of-type(4) {
        display: inline-block;
    }
}


/* 1200px 이상 -- 데스크탑 (xl) */
@media (min-width: 1200px) {
    .footer .inner {
        padding-left: var(--sz-16);
        padding-right: var(--sz-16);
    }
    .footer .footer-banner {
        flex-direction: row;
        background: url(/openads3/images/footer-banner-bg-p@3x.png) no-repeat calc(100% - 2.5rem) 0 / 15rem 7.5rem;
    }
    .footer .footer-banner .group {
        flex-basis: 50%;
    }
    .footer .footer-banner .btn {
        margin-right: var(--sz-80);
    }
    .footer .footer-banner .ico-arrow {
        width: 2.81rem;
        height: var(--sz-12);
        background: url(/openads3/images/ico-arrow-right-default-45px-p.svg) no-repeat center / 100%;
    }
    .footer .footer-group {
        flex-direction: row;
        padding-bottom: var(--sz-56);
    }
    .footer .footer-group .d-flex,
    .footer .footer-group .d-block {
        flex-basis: calc(50% - var(--sz-8));
    }
    .footer .footer-group .logo {
        margin-bottom: var(--sz-16);
    }
    .footer .footer-group .dot {
        width: var(--sz-2);
        height: var(--sz-2);
    }
    .footer .footer-group .company-info {
        margin-top: 0;
        margin-bottom: var(--sz-32);
    }
    .footer .footer-sns {
        margin-bottom: 0;
    }
}
/* ------------------------- Footer : End ------------------------- */