/* 관리자 버튼 */
.adminbar {
    position: fixed;
    top: 20vh;
    right: 0;
    z-index: 999999;
}

.adminbar > a {
    padding: 8px 20px;
    background: #9819b7;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    font-size: 16px;
    color: #FFF;
    font-weight: bold;
}

/* 관리자 스킨 수정 버튼 최상위 */
.ctt_admin {
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 99999;
}

.sub-visual {
    position: relative;
    width: 100%;
    height: 60vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-bottom: 10rem;
    z-index: 1;
    justify-content: flex-end;
}

.sub-visual:after {
    content: '';
    display: block;
    width: 100%;
    height: 0.6875rem;
    position: absolute;
    bottom: 0;
    left: 0;
    background: linear-gradient(90deg, #000 0%, #671AEB 41.83%, #F1E5FF 97.6%);
}

.sub-visual #subVisualTitle {
    color: #FFF;
    text-align: center;
    font-size: 2.25rem;
    font-weight: 700;
    line-height: 100%; /* 2.25rem */
    letter-spacing: -0.03125rem;
}

.sub-visual #subVisualSubtitle {
    color: #FFF;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 100%; /* 1.5rem */
    letter-spacing: -0.03125rem;
    margin-bottom: 0.81rem;
}

.sub-visual img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}


/*
    TERM
*/
.term-content {
    display: flex;
    flex-direction: column;
    padding: 3rem;
    border: 1px solid #DEDEDE;
    gap: 3rem;
}
.term-content *,
.term-content *:before,
.term-content *:after {
    word-break: keep-all;
    text-wrap-style: pretty;
    box-sizing: border-box;
    font-family: var(--font-sans);
}
.term-content * {
    margin : 0;
    padding: 0;
}
.term-content ol>li{
    color: #515151;
    font-size: 1rem;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.03125rem;
}
.fw-500{
    font-weight: 500!important;
}
.fw-700 {
    font-weight: 700!important;
}
.color-blue{
    color: #548dd4!important;
}
.color-red{
    color: #d9534f!important;
}
.term-content ol > li > ul > li {
    list-style: disc;
}

.term-content h1 {
    color: #000;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 100%; /* 1.5rem */
    letter-spacing: -0.03125rem;
}

.term-content h2 {
    color: #515151;
    font-size: 1.125rem;
    font-weight: 700;
    line-height: 150%; /* 1.6875rem */
    letter-spacing: -0.03125rem;
}
.term-content h3 {
    color: #515151;
    font-size: 1rem;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.03125rem;
}
.term-content p,
.term-content span
{
    color: #515151;
    font-size: 1rem;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.03125rem;
}
.term-content > .term-subTitle > ol {
    margin-top: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.term-content > .term-subTitle > ol ul {
    margin-top: .75rem;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .625rem;
}

.term-content > .term-subTitle > ol ul > li {
    margin-left: 1.5rem;
}
.term-content > .term-subTitle > ol ul > li p:first-child {
    margin-top: -.625rem;
}
.term-content ol.question{
    counter-reset: section;
    list-style: none;
    padding: 0;
}
.term-content ol.question>li:before{
    counter-increment: section;
    content: "Q" counter(section) ". ";
    font-variant-numeric: tabular-nums;
}
.term-content ol.question>li {
    color: #515151;
    font-size: 1rem;
    font-weight: 700;
    line-height: 150%;
    letter-spacing: -0.03125rem;
}
.term-content > .term-contents {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}
.term-contents > .term-preface {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.term-contents > .term-preface span {
    color: #515151;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -0.03125rem;
    margin-top: -1.5rem;
}

.term-contents > .term-preface > .preface-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.term-content > .term-contents > .content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.term-content > .term-contents > .content ol {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.term-content > .term-contents > .content li{
    margin-left: 1.5rem;
}

.term-content > .term-contents > .content ol > li > .content-table {
    margin-top: 1rem;
    margin-left: -1rem;
}

.term-content > .term-contents .content-table table {
    width: 100%;
    border-spacing: 0;
    border-radius: 5px;
    margin-top: 1rem;

    color: #515151;
    font-size: 1rem;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.03125rem;
    border-collapse: collapse;
}

.term-content > .term-contents .content-table table th,
.term-content > .term-contents .content-table table td {
    border: 1px solid #DEDEDE;
}

.term-content > .term-contents .content-table > table > thead {
    background-color: #F5F5F5;
}

.term-content > .term-contents .content-table > table > thead th{
    padding: 1.125rem 0;
    font-weight: 500;
    text-align: center;
}

.term-content > .term-contents .content-table > table > tbody tr > td.pad{
    padding: .625rem 1rem;
}

.term-content > .term-contents .content-table > table > tbody tr > td.center{
    text-align: center;
}

.content:last-child li:first-child>p{
    margin-top: -1rem;
}


html:has(.loading):not(:has([class=loading][style*='none'])) {
    overflow: hidden;
}



/* 이용약관 */
.term-content > .term-container > ul.term-text {
    list-style: none;
}

.term-content > .term-container ul.sub-container {
    list-style: none;
}

.term-content > .term-container > ul.term-text > li > h2 + ul {
    margin-top: 1.5rem;
}

.term-content > .term-container ul.sub-container > li + li {
    margin-top: 1rem;
}

.term-content > .term-container ul.sub-container > li > h3 + p {
    margin-top: .5rem;
}

.term-content > .term-container ul.sub-container > li > p + ol {
    margin-top: .25rem;
}

.term-content > .term-container ul.sub-container > li > ol {
    margin-left: 1rem;
}
.term-content > .term-container ul.sub-container > li > p {
    font-weight: 500;
    font-size: .875rem;
}
.term-content > .term-container ul.sub-container > li > ol.circle {
    list-style: inside;
    margin-left: 1.125rem;
    margin-top: .5rem;
}
.term-content > .term-container ul.sub-container > li > ol.circle > li > span{
    margin-left: 1.5rem;
}

.term-content > .term-container > ul.term-text > li + li {
    margin-top: 1rem;
}

.term-content > .term-container ul.sub-container > li > ol + ol {
    margin-left: 1.5rem;
}


.term-content .content-table table {
    width: 100%;
    border-spacing: 0;
    border-radius: 5px;
    margin-top: 1rem;

    color: #515151;
    font-size: 1rem;
    font-weight: 400;
    line-height: 150%;
    letter-spacing: -0.03125rem;
    border-collapse: collapse;
}

.term-content .content-table table th,
.term-content .content-table table td {
    border: 1px solid #DEDEDE;
}

.term-content .content-table > table > thead {
    background-color: #F5F5F5;
}

.term-content .content-table > table > thead th{
    padding: 1.125rem 0;
    font-weight: 500;
    padding: 1.125rem 0;
    font-weight: 500;
    text-align: start;
    padding-left: 1rem;
}
.term-content > .term-container .content-table > table > tbody tr > td:first-child {
    background-color: #EFF6E7;
}
.term-content .content-table > table > tbody tr > td.pad{
    padding: .625rem 1rem;
}

.term-content .content-table > table > tbody tr > td.center{
    text-align: center;
}

.loading {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: #FFF;
    opacity: .9;
    z-index: 1000;
}

.loading-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: absolute;
    gap: 1.5rem;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.loading-inner img {
    width: 7.5rem;
    height: 7.5rem;
    object-fit: cover;
}
.loading-inner span,
.loading-inner p{
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: -0.03125rem;
    text-align: center;
}

/*비밀번호 찾기*/
#find_info {
    padding: calc(17.5rem + var(--header-height)) 19.625rem 7.5rem;
}
.new_win .new_win_con {
    margin: 0;
    padding: 0;
}
#find_info > div {
    max-width: 450px;
    margin: 0 auto;
}
#find_info > div > h3 {
    color: #000;
    font-size: 2.25rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%; /* 2.25rem */
    letter-spacing: -0.03125rem;
    text-align: center;
    margin-bottom: 3.5rem;
}
.new_win .btn_submit {
    color: #FFF;
    font-size: 1rem;
    font-weight: 500;
    line-height: 150%; /* 1.5rem */
    letter-spacing: -0.03125rem;
}
.btn_submit {
    background-color: var(--primary-color);
    border-radius: 5px;
}
.btn_submit:hover{
    background-color: var(--primary-color);
}

@media screen and (max-width: 768px) {
    .sub-visual{
        height: 25vh;
        padding-bottom:2.5rem;
    }
    .sub-visual #subVisualSubtitle{
        font-size: 1rem;
        line-height: 150%;
        margin-bottom: 0;
    }
    .sub-visual #subVisualTitle{
        font-size: 1.5625rem;
        line-height: 140%;
    }

    .loading-inner img {
        width: 3rem;
        height: 3rem;
    }

    .loading-inner {
        gap: .5rem;
    }

    .loading-inner span, .loading-inner p {
        font-size: .875rem;
    }
    #find_info {
        padding: calc(5rem + var(--header-height)) 2.5rem 7.5rem;
    }
    #find_info > div {
        max-width: 280px;
        margin: 0 auto;
    }
    #find_info > div > h3 {
        font-size: 1.25rem;
        line-height: 140%;
        margin-bottom: 2.5rem;
    }
    .new_win .btn_submit {
        font-size: .875rem;
        line-height: 100%;
    }
}